Streamline CRA deps and webpack config (#3396)

web/features/.browserslistrc

@@ -0,0 +1,9 @@
+[production]
+>0.2%
+not dead
+not op_mini all
+
+[development]
+last 3 chrome version
+last 3 firefox version
+last 3 safari version

web/features/.vscode/settings.json

@@ -1,6 +1,12 @@
 {
-    "xml.trace.server": "off",
-    "typescript.tsserver.log": "off",
-    "js/ts.implicitProjectConfig.target": "ES2016",
-    "typescript.tsserver.experimental.enableProjectDiagnostics": false
-}
+  "xml.trace.server": "off",
+  "typescript.tsserver.log": "off",
+  "js/ts.implicitProjectConfig.target": "ES2016",
+  "typescript.tsserver.experimental.enableProjectDiagnostics": false,
+
+  "editor.tabSize": 4,
+  "editor.detectIndentation": false,
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit"
+  }
+}

web/features/eslint.config.js

@@ -0,0 +1,48 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  overrides: [
+    {
+      env: {
+        node: true,
+      },
+      files: ['.eslintrc.{js,cjs}'],
+      parserOptions: {
+        sourceType: 'script',
+      },
+    },
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['@typescript-eslint', 'react', 'react-hooks'],
+  rules: {
+    indent: [
+      'error',
+      4,
+      {
+        SwitchCase: 1,
+      },
+    ],
+    'linebreak-style': ['error', 'unix'],
+    quotes: ['error', 'single'],
+    semi: ['error', 'always'],
+    'react/jsx-uses-react': 'off',
+    'react/react-in-jsx-scope': 'off',
+  },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+  },
+};