(#418) Upgrade to ESLint 9.x

This upgrades to the latest version of ESLint. With this upgrade, the
format of the config file change to a `eslint.config.mjs` file. A tool
was used by ESLint to convert over the existing .eslintrc.js file. More
information on the conversion can be found at https://eslint.org/docs/latest/use/configure/migration-guide.

After this upgrade of ESLint, ESLint was ran and tested by making
purposeful changes to ensure that errors were caught. This worked
successfully, and also found an actual error that was fixed.

build/choco-theme.ts

@@ -255,13 +255,13 @@ const init = async () => {
             );
         }
 
-        // ESLint and tsconfig - needed if repository contains it's own assets along with choco-theme
+        // ESLint - needed if repository contains it's own assets along with choco-theme
         if (repository.name === repositoryConfig.portal.name || repository.name === repositoryConfig.ccm.name) {
             parallelTasksInitial.push(
                 {
-                    task: '.eslintrc.js',
-                    source: `${repositoryConfig.theme.root}.eslintrc.js`,
-                    destination: `${repository.root}.eslintrc.js`,
+                    task: 'eslint.config.mjs',
+                    source: `${repositoryConfig.theme.root}eslint.config.mjs`,
+                    destination: `${repository.root}eslint.config.mjs`,
                     isFolder: false
                 }
             );

eslint.config.mjs

@@ -0,0 +1,113 @@
+import globals from "globals";
+import typescriptEslint from "@typescript-eslint/eslint-plugin";
+import tsParser from "@typescript-eslint/parser";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import js from "@eslint/js";
+import { FlatCompat } from "@eslint/eslintrc";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+    allConfig: js.configs.all
+});
+
+export default [{
+    ignores: [
+        "js/src/lib",
+        "**/node_modules",
+        "wwwroot/js/**/*.min.js",
+        "input/assets/js/*.min.js",
+        "Scripts/*.min.js",
+    ],
+}, ...compat.extends("standard"), {
+    languageOptions: {
+        globals: {
+            ...globals.browser,
+            Prism: "readonly",
+            bootstrap: "readonly",
+        },
+
+        ecmaVersion: "latest",
+        sourceType: "module",
+    },
+}, ...compat.extends(
+    "standard",
+    "eslint:recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:@typescript-eslint/recommended",
+).map(config => ({
+    ...config,
+    files: ["js/src/ts/**/*.ts", "playwright/**/*.ts", "build/**/*.ts"],
+})), {
+    files: ["js/src/ts/**/*.ts", "playwright/**/*.ts", "build/**/*.ts"],
+
+    plugins: {
+        "@typescript-eslint": typescriptEslint,
+    },
+
+    languageOptions: {
+        parser: tsParser,
+        ecmaVersion: 5,
+        sourceType: "script",
+
+        parserOptions: {
+            project: "tsconfig.json",
+        },
+    },
+}, ...compat.extends("plugin:playwright/recommended").map(config => ({
+    ...config,
+    files: ["playwright/**/*.ts"],
+})), {
+    files: ["playwright/**/*.ts"],
+
+    languageOptions: {
+        ecmaVersion: 5,
+        sourceType: "script",
+
+        parserOptions: {
+            project: "playwright/tsconfig.json",
+        },
+    },
+
+    rules: {
+        "playwright/no-conditional-in-test": 0,
+        "playwright/expect-expect": 0,
+    },
+}, {
+    files: [
+        "**/eslint.config.mjs",
+        "**/postcss.config.js",
+        "js/**/**/*.*",
+        "getting-started/*.js",
+        "playwright/**/*.ts",
+        "wwwroot/js/src/**/*.js",
+        "build/**/*.*",
+    ],
+
+    rules: {
+        semi: ["error", "always"],
+        quotes: ["error", "single"],
+
+        indent: ["error", 4, {
+            SwitchCase: 1,
+        }],
+
+        "no-var": "error",
+        "one-var": ["error", "never"],
+        "one-var-declaration-per-line": ["error", "always"],
+
+        "no-unused-vars": ["error", {
+            varsIgnorePattern: "Alert|Button|Carousel|Collapse|Dropdown|Modal|Offcanvas|Tab",
+        }],
+
+        "prefer-template": "error",
+        "prefer-arrow-callback": ["error"],
+        "func-style": ["error", "expression"],
+        "arrow-parens": ["error", "as-needed"],
+        "object-shorthand": ["error", "consistent-as-needed"],
+        eqeqeq: 0,
+    },
+}];

js/src/ts/tab-multiples.ts

@@ -14,7 +14,7 @@ window.addEventListener('DOMContentLoaded', () => {
             // Ensure the data-choco-tab-multi attribute is valid JSON
             try {
                 tabMultiConfig = JSON.parse(tabMultiConfigAttribute ?? '');
-            } catch (error) {
+            } catch {
                 console.error(`Invalid JSON: ${tabMultiConfigAttribute}`);
                 return; // Skip further processing
             }

package.json

@@ -80,6 +80,8 @@
   },
   "dependencies": {
     "@eonasdan/tempus-dominus": "^6.9.9",
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.11.1",
     "@fortawesome/fontawesome-free": "^6.1.2",
     "@microsoft/signalr": "^8.0.7",
     "@playwright/test": "^1.44.1",
@@ -99,13 +101,14 @@
     "datatables.net-bs5": "^2.0.8",
     "datatables.net-dt": "^2.0.8",
     "esbuild": "^0.20.1",
-    "eslint": "^8.57.0",
+    "eslint": "^9.11.1",
     "eslint-config-standard": "^17.0.0",
     "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-n": "^16.6.2",
     "eslint-plugin-playwright": "^1.4.1",
     "eslint-plugin-promise": "^6.0.0",
     "flatpickr": "^4.6.13",
+    "globals": "^15.9.0",
     "jquery": "^3.7.1",
     "jquery-serializejson": "^3.2.1",
     "jquery-validation": "^1.21.0",