Merge branch 'leaderboard' of https://github.com/source-academy/frontend into leaderboard

Author: tohyzhong

.env.example

@@ -2,6 +2,7 @@ REACT_APP_DEPLOYMENT_NAME=Source Academy
 
 REACT_APP_BACKEND_URL=http://localhost:4000
 REACT_APP_USE_BACKEND=TRUE
+REACT_APP_USE_EMPTY_ASSET_PREFIX=FALSE
 REACT_APP_PLAYGROUND_ONLY=FALSE
 REACT_APP_SHOW_RESEARCH_PROMPT=FALSE
 

.github/workflows/build-development.yml

@@ -11,6 +11,10 @@ jobs:
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
+      # Has to be run before actions/setup-node.
+      # See: https://github.com/actions/setup-node/issues/480
+      - name: Enable corepack for Yarn
+        run: corepack enable
       - name: Setup node
         uses: actions/setup-node@v4
         with:
@@ -23,7 +27,7 @@ jobs:
         run: echo "time=$(date -Iseconds)" >> $GITHUB_OUTPUT
       - name: yarn install and build
         run: |
-          yarn install --frozen-lockfile
+          yarn install --immutable
           yarn run build
         env:
           REACT_APP_URL_SHORTENER_SIGNATURE: ${{ secrets.REACT_APP_URL_SHORTENER_SIGNATURE }}

.github/workflows/ci.yml

@@ -26,13 +26,17 @@ jobs:
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
+      # Has to be run before actions/setup-node.
+      # See: https://github.com/actions/setup-node/issues/480
+      - name: Enable corepack for Yarn
+        run: corepack enable
       - name: Setup node
         uses: actions/setup-node@v4
         with:
           node-version: 20
           cache: yarn
       - name: Install dependencies
-        run: yarn install --frozen-lockfile
+        run: yarn install --immutable
       - name: Run command
         run: yarn run ${{ matrix.commands }}
       - name: Coveralls - Upload test coverage report

.gitignore

@@ -24,8 +24,6 @@ terraform*
 .env.test.local
 .env.production.local
 .idea/
-.vscode/
-cadet-frontend.iml
 
 npm-debug.log*
 .eslintcache
@@ -34,3 +32,22 @@ yarn-error.log
 # emacs backup files
 
 *~
+
+# yarn files
+
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+# Swap the comments on the following lines if you wish to use zero-installs
+# In that case, don't forget to run `yarn config set enableGlobalCache false`!
+# Documentation here: https://yarnpkg.com/features/caching#zero-installs
+
+#!.yarn/cache
+.pnp.*
+
+# We use .node-version
+/.tool-versions

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "eslint.useFlatConfig": true,
+  "files.insertFinalNewline": true,
+  "liveServer.settings.file": "/index.html",
+  "liveServer.settings.NoBrowser": true,
+  "liveServer.settings.root": "/build"
+}

.yarnrc.yml

@@ -0,0 +1 @@
+nodeLinker: node-modules

README.md

@@ -22,10 +22,12 @@ The Source Academy (<https://sourceacademy.org/>) is an immersive online experie
 
 1. Install the version of Node.js as specified in the `.node-version` file
 
-1. Install Python (known working versions: `2.7`, `3.8`, `3.9`, `3.10`) – **Note: Python `3.11` does not work**
-
 1. Clone this repository and navigate to it using your command line
 
+1. Install the version of `yarn` as specified in `package.json`, `packageManager`. 
+
+   > We recommend using `corepack` to manage the version of `yarn`, you may simply run `corepack enable` to complete this step.
+
 1. Run `yarn install` to install dependencies.
 
    - If you are on Ubuntu and encounter the error message: `No such file or directory: 'install'`, you might be running the incorrect "yarn" from the cmdtest testing suite instead of the JavaScript package manager of the same name. Refer to this [StackOverflow post](https://stackoverflow.com/questions/46013544/yarn-install-command-error-no-such-file-or-directory-install).

craco.config.js

@@ -139,7 +139,8 @@ const cracoConfig = {
           'split-on-first',
           'filter-obj',
           '@sourceacademy/c-slang',
-          'java-parser'
+          'java-parser',
+          'conductor'
         ),
         '^.+\\.module\\.(css|sass|scss)$'
       ];

eslint.config.js renamed to eslint.config.mjs

@@ -1,19 +1,16 @@
 // @ts-check
 
-// Todo: Use ES module
-const eslint = require('@eslint/js');
-const tseslint = require('typescript-eslint');
-const reactRefresh = require('eslint-plugin-react-refresh');
+// import eslint from '@eslint/js';
+import { config, configs } from 'typescript-eslint';
+import reactPlugin from 'eslint-plugin-react';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import simpleImportSort from 'eslint-plugin-simple-import-sort'
+// import reactRefresh from 'eslint-plugin-react-refresh';
 
-const FlatCompat = require('@eslint/eslintrc').FlatCompat;
-const compat = new FlatCompat({
-  baseDirectory: `${__dirname}`
-});
-
-module.exports = tseslint.config(
-  { ignores: ['eslint.config.js'] },
+export default config(
+  { ignores: ['eslint.config.mjs'] },
   // eslint.configs.recommended,
-  ...tseslint.configs.recommended,
+  ...configs.recommended,
   // TODO: Enable when ready
   // {
   //   plugins: {
@@ -23,14 +20,15 @@ module.exports = tseslint.config(
   //     'react-refresh/only-export-components': 'warn'
   //   }
   // },
-  ...compat.config({
-    extends: [
-      'plugin:react-hooks/recommended'
-      // "plugin:react/recommended",
-      // "plugin:react/jsx-runtime"
-    ],
-    plugins: ['simple-import-sort'],
+  {
+    files: ['**/*.ts*'],
+    plugins: {
+      'react-hooks': reactHooksPlugin,
+      'react': reactPlugin,
+      'simple-import-sort': simpleImportSort
+    },
     rules: {
+      ...reactHooksPlugin.configs['recommended-latest'].rules,
       'no-restricted-imports': [
         'error',
         {
@@ -73,5 +71,5 @@ module.exports = tseslint.config(
       ],
       'simple-import-sort/imports': 'error'
     }
-  })
+  }
 );

package.json

@@ -1,6 +1,7 @@
 {
   "private": true,
   "name": "frontend",
+  "packageManager": "[email protected]",
   "version": "1.4.3",
   "scripts-info": {
     "analyze": "Analyze bundle size breakdown",
@@ -47,24 +48,26 @@
     "array-move": "^4.0.0",
     "browserfs": "^1.4.3",
     "classnames": "^2.3.2",
+    "conductor": "https://github.com/source-academy/conductor.git#0.2.1",
     "dayjs": "^1.11.13",
-    "dompurify": "^3.1.6",
+    "dompurify": "^3.2.4",
     "flexboxgrid": "^6.3.1",
     "flexboxgrid-helpers": "^1.1.3",
     "hastscript": "^9.0.0",
     "i18next": "^23.11.2",
     "i18next-browser-languagedetector": "^8.0.0",
     "java-slang": "^1.0.13",
     "js-cookie": "^3.0.5",
-    "js-slang": "^1.0.76",
+    "js-slang": "^1.0.81",
     "js-yaml": "^4.1.0",
     "konva": "^9.2.0",
+    "language-directory": "https://github.com/source-academy/language-directory.git",
     "lodash": "^4.17.21",
     "lz-string": "^1.4.4",
     "mdast-util-from-markdown": "^2.0.0",
     "mdast-util-to-hast": "^13.0.0",
     "normalize.css": "^8.0.1",
-    "phaser": "^3.55.2",
+    "phaser": "~3.87.0",
     "query-string": "^9.0.0",
     "re-resizable": "^6.9.9",
     "react": "^18.3.1",
@@ -138,15 +141,16 @@
     "cross-env": "^7.0.3",
     "eslint": "^9.9.0",
     "eslint-plugin-react": "^7.35.0",
-    "//": "See: https://github.com/facebook/react/issues/28313#issuecomment-2076798972, https://github.com/t3-oss/create-t3-turbo/issues/984#issuecomment-2076413457",
-    "eslint-plugin-react-hooks": "5.1.0-canary-cb151849e1-20240424",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.9",
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "https-browserify": "^1.0.0",
     "husky": "^9.0.0",
     "npm-run-all2": "^7.0.0",
     "os-browserify": "^0.3.0",
+    "path": "^0.12.7",
     "path-browserify": "^1.0.1",
+    "phaser3spectorjs": "^0.0.8",
     "prettier": "^3.3.3",
     "process": "^0.11.10",
     "react-error-overlay": "^6.0.11",
@@ -163,9 +167,6 @@
     "url": "^0.11.1",
     "webpack-bundle-analyzer": "^4.9.0"
   },
-  "resolutions": {
-    "**/gl": "^8.0.2"
-  },
   "browserslist": {
     "production": [
       "Firefox ESR",