Migrate to ESLint and resolve lint errors

.github/workflows/ci.yml

@@ -84,6 +84,15 @@ jobs:
       - working-directory: ./assets
         run: npm run format:check
 
+  js-lint:
+    name: Frontend Lint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: ./.github/actions/setup
+      - working-directory: ./assets
+        run: npm run lint:errors
+
   js-types:
     name: Frontend Types
     runs-on: ubuntu-latest

.tool-versions

@@ -1,3 +1,3 @@
 elixir 1.15.7-otp-26
 erlang 26.2
-nodejs 16.20.2
+nodejs 18.20.2

Dockerfile

@@ -14,7 +14,7 @@ RUN mix do local.hex --force, local.rebar --force
 RUN mix do deps.get --only prod
 
 # next, build the frontend assets within a Node.JS container
-FROM node:16 as assets-builder
+FROM node:18 as assets-builder
 
 WORKDIR /root
 ADD . .

assets/eslint.config.mjs

@@ -0,0 +1,35 @@
+import globals from "globals";
+import pluginJs from "@eslint/js";
+import tseslint from "typescript-eslint";
+import pluginReactConfig from "eslint-plugin-react/configs/recommended.js";
+import eslintConfigPrettier from "eslint-config-prettier";
+
+export default [
+  { languageOptions: { globals: globals.browser } },
+  pluginJs.configs.recommended,
+  ...tseslint.configs.recommended,
+  pluginReactConfig,
+  eslintConfigPrettier,
+  {
+    settings: { react: { version: "detect" } },
+    rules: {
+      "no-empty": ["error", { allowEmptyCatch: true }],
+      "react/display-name": "warn",
+      "react/prop-types": "warn",
+      "@typescript-eslint/ban-ts-comment": "warn",
+      "@typescript-eslint/no-explicit-any": "warn",
+      "@typescript-eslint/no-unused-vars": [
+        // https://typescript-eslint.io/rules/no-unused-vars/
+        "error",
+        {
+          args: "all",
+          argsIgnorePattern: "^_",
+          caughtErrors: "all",
+          caughtErrorsIgnorePattern: "^_",
+          destructuredArrayIgnorePattern: "^_",
+          varsIgnorePattern: "^_",
+        },
+      ],
+    },
+  },
+];