Replace react-scripts with react-app-rewired

frontend/config-overrides.js

@@ -0,0 +1,41 @@
+const getCacheIdentifier = require("react-dev-utils/getCacheIdentifier");
+
+const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== "false";
+
+module.exports = function override(config, webpackEnv) {
+  console.log("overriding webpack config...");
+
+  const isEnvDevelopment = webpackEnv === "development";
+  const isEnvProduction = webpackEnv === "production";
+  const loaders = config.module.rules[1].oneOf;
+
+  loaders.splice(loaders.length - 1, 0, {
+    test: /\.(js|mjs|cjs)$/,
+    exclude: /@babel(?:\/|\\{1,2})runtime/,
+    loader: require.resolve("babel-loader"),
+    options: {
+      babelrc: false,
+      configFile: false,
+      compact: false,
+      presets: [[require.resolve("babel-preset-react-app/dependencies"), { helpers: true }]],
+      cacheDirectory: true,
+      // See #6846 for context on why cacheCompression is disabled
+      cacheCompression: false,
+      // @remove-on-eject-begin
+      cacheIdentifier: getCacheIdentifier(isEnvProduction ? "production" : isEnvDevelopment && "development", [
+        "babel-plugin-named-asset-import",
+        "babel-preset-react-app",
+        "react-dev-utils",
+        "react-scripts"
+      ]),
+      // @remove-on-eject-end
+      // Babel sourcemaps are needed for debugging into node_modules
+      // code.  Without the options below, debuggers like VSCode
+      // show incorrect code and set breakpoints on the wrong lines.
+      sourceMaps: shouldUseSourceMap,
+      inputSourceMap: shouldUseSourceMap
+    }
+  });
+
+  return config;
+};

frontend/package.json

@@ -30,7 +30,6 @@
     "react-i18next": "^12.2.2",
     "react-lazylog": "^4.5.3",
     "react-router-dom": "^6.10.0",
-    "react-scripts": "5.0.1",
     "react-toastify": "^9.1.3",
     "react-world-flags": "^1.5.1"
   },
@@ -44,13 +43,14 @@
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "prettier": "^2.8.4",
+    "react-app-rewired": "^2.2.1",
     "typescript": "^4.9.5"
   },
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "start": "react-app-rewired start",
+    "build": "react-app-rewired build",
+    "test": "react-app-rewired test",
+    "eject": "react-app-rewired eject"
   },
   "eslintConfig": {
     "extends": [