Merge pull request #307 from code-dot-org/switch-to-function-components

Switch to React functional components

Author: wilkie

.eslintrc.js

@@ -6,12 +6,14 @@ module.exports = {
   "globals": {
   },
   "plugins": [
-    "jsx-a11y"
+    "jsx-a11y",
+    "react-hooks"
   ],
   "extends": [
     'plugin:react/recommended',
     "eslint:recommended",
-    "plugin:jsx-a11y/recommended"
+    "plugin:jsx-a11y/recommended",
+    "plugin:react-hooks/recommended"
   ],
   "env": {
     "browser": true,
@@ -23,14 +25,11 @@ module.exports = {
       "version": "detect"
     }
   },
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
   "parserOptions": {
     "sourceType": "module",
     "ecmaFeatures": {
-      "jsx": true,
-      "modules": true,
-      "ecmaVersion": 6,
-      "experimentalObjectRestSpread": true
+      "jsx": true
     }
   },
   "rules": {
@@ -58,6 +57,7 @@ module.exports = {
     "no-useless-escape": "off",
     "no-with": "error",
     "object-curly-spacing": "off",
+    "react/react-in-jsx-scope": "off",
     "react/button-has-type": "error",
     "react/display-name": "off",
     "react/jsx-closing-bracket-location": "error", // autofixable

babel.config.json

@@ -1,6 +1,6 @@
 {
   "presets": [
     ["@babel/preset-env", {"loose": true}],
-    "@babel/preset-react"
+    ["@babel/preset-react", {"runtime": "automatic"}]
   ]
 }

package.json

@@ -32,32 +32,33 @@
   },
   "devDependencies": {
     "@babel/core": "^7.29.0",
+    "@babel/eslint-parser": "^7.28.6",
     "@babel/preset-env": "^7.29.2",
     "@babel/preset-react": "^7.28.5",
-    "babel-eslint": "^9.0.0",
-    "babel-jest": "29",
+    "babel-jest": "^29.7.0",
     "babel-loader": "^10.1.1",
-    "copy-webpack-plugin": "11",
+    "copy-webpack-plugin": "^11.0.0",
     "core-js": "^3",
     "css-loader": "^7.1.4",
-    "eslint": "6.1.0",
-    "eslint-plugin-jsx-a11y": "^6.4.1",
-    "eslint-plugin-react": "7.14.3",
+    "eslint": "^8.57.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "29",
-    "messageformat": "2.3.0",
+    "jest": "^29.7.0",
+    "messageformat": "^2.3.0",
     "ml-knn": "^3.0.0",
-    "query-string": "4.1.0",
-    "react": "~15.4.0",
-    "react-dom": "~15.4.0",
+    "query-string": "^4.1.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-papaparse": "^3.8.0",
-    "react-redux": "^5.0.0",
+    "react-redux": "^9.2.0",
     "redux": "^4.0.5",
     "style-loader": "^4.0.0",
-    "webpack": "5",
+    "webpack": "^5.106.0",
     "webpack-bundle-analyzer": "^3.6.0",
-    "webpack-cli": "5",
-    "webpack-dev-server": "5"
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^5.2.3"
   },
   "files": [
     "dist/**/!(mainDev.js)",