Update ESLint configuration and dependency versions

eslint.config.mjs

@@ -1,49 +1,31 @@
-import globals from 'globals'
-import cypressPlugin from 'eslint-plugin-cypress/flat'
-import prettierPlugin from 'eslint-plugin-prettier/recommended'
-import mochaPlugin from 'eslint-plugin-mocha'
+import js from "@eslint/js";
+import globals from "globals";
+import tseslint from "typescript-eslint";
+import pluginReact from "eslint-plugin-react";
+import cypressPlugin from "eslint-plugin-cypress/flat";
+import { defineConfig } from "eslint/config";
 
-// NOTE: This config is only used for running ESLint on the Cypress tests. Frontend and backend use their own configs.
+const cypressRecommended = cypressPlugin.configs.recommended;
 
-const mochaRecommended = mochaPlugin.configs.flat.recommended
-const cypressRecommended = cypressPlugin.configs.recommended
-const mochaLanguageOptions = mochaRecommended.languageOptions ?? {}
-const cypressLanguageOptions = cypressRecommended.languageOptions ?? {}
-const mochaRules = mochaRecommended.rules ?? {}
-const cypressRules = cypressRecommended.rules ?? {}
-
-/** @type {import('eslint').Linter.Config[]} */
-export default [
+export default defineConfig([
+  {
+    files: ["**/*.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
+    plugins: { js },
+    extends: ["js/recommended"],
+    languageOptions: { globals: { ...globals.browser, ...globals.node } },
+  },
+  tseslint.configs.recommended,
+  pluginReact.configs.flat.recommended,
   {
-    files: ['cypress/**/*.{cy,spec}.{js,ts,tsx}'],
-    ...mochaRecommended,
     ...cypressRecommended,
-    rules: {
-      ...mochaRules,
-      ...cypressRules,
-      'mocha/no-mocha-arrows': 'off',
-      'mocha/no-skipped-tests': 'off',
-      'mocha/max-top-level-suites': 'off',
-      'mocha/no-top-level-hooks': 'off',
-      'mocha/no-sibling-hooks': 'off',
-    },
+    files: ["cypress/**/*.{cy,spec}.{js,ts,tsx}"],
     languageOptions: {
-      ...mochaLanguageOptions,
-      ...cypressLanguageOptions,
+      ...cypressRecommended.languageOptions,
       globals: {
         ...globals.browser,
         ...globals.node,
+        ...(cypressRecommended.languageOptions?.globals ?? {}),
       },
-      parserOptions: {
-        ecmaVersion: 'latest',
-        sourceType: 'module',
-      },
-    },
-    plugins: {
-      mocha: mochaPlugin,
-      cypress: cypressPlugin,
     },
   },
-
-  prettierPlugin,
-]
+]);