Bump eslint from 8.57.0 to 9.27.0

eslint.config.js

@@ -0,0 +1,111 @@
+const {
+    defineConfig,
+} = require("eslint/config");
+
+const globals = require("globals");
+const security = require("eslint-plugin-security");
+const cypress = require("eslint-plugin-cypress");
+const typescriptEslint = require("@typescript-eslint/eslint-plugin");
+const tsParser = require("@typescript-eslint/parser");
+const js = require("@eslint/js");
+
+const {
+    FlatCompat,
+} = require("@eslint/eslintrc");
+
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+    allConfig: js.configs.all
+});
+
+module.exports = defineConfig([{
+    languageOptions: {
+        globals: {
+            ...globals.browser,
+            ...globals.amd,
+            ...globals.jquery,
+            ...cypress.environments.globals.globals,
+        },
+    },
+
+    plugins: {
+        security,
+        cypress,
+        "@typescript-eslint": typescriptEslint,
+    },
+
+    extends: compat.extends(
+        "eslint:recommended",
+        "plugin:security/recommended-legacy",
+        "plugin:react/recommended",
+    ),
+
+    "rules": {
+        "indent": ["error", 4],
+        "linebreak-style": ["error", "unix"],
+
+        "no-unused-vars": ["error", {
+            "vars": "all",
+            "args": "none",
+        }],
+
+        "quotes": ["error", "single"],
+        "semi": ["error", "always"],
+
+        "max-len": [2, {
+            "code": 80,
+            "tabWidth": 4,
+            "ignoreUrls": true,
+        }],
+
+        "space-before-function-paren": ["error", "never"],
+        "space-in-parens": ["error", "never"],
+        "no-trailing-spaces": ["error"],
+
+        "key-spacing": ["error", {
+            "beforeColon": false,
+        }],
+
+        "func-call-spacing": ["error", "never"],
+        "react/prop-types": [0],
+        "security/detect-buffer-noassert": 1,
+        "security/detect-child-process": 1,
+        "security/detect-disable-mustache-escape": 1,
+        "security/detect-eval-with-expression": 1,
+        "security/detect-new-buffer": 1,
+        "security/detect-no-csrf-before-method-override": 1,
+        "security/detect-non-literal-fs-filename": 1,
+        "security/detect-non-literal-regexp": 1,
+        "security/detect-non-literal-require": 0,
+        "security/detect-object-injection": 0,
+        "security/detect-possible-timing-attacks": 1,
+        "security/detect-pseudoRandomBytes": 1,
+        "security/detect-unsafe-regex": 1,
+    },
+}, {
+    files: ["**/*.{ts,tsx}"],
+
+    "rules": {
+        "max-len": [2, {
+            "code": 100,
+            "tabWidth": 4,
+            "ignoreUrls": true,
+        }],
+    },
+
+    languageOptions: {
+        parser: tsParser,
+
+        parserOptions: {
+            tsconfigRootDir: __dirname,
+            project: ["./tsconfig.json"],
+        },
+    },
+
+    extends: compat.extends(
+        "plugin:@typescript-eslint/eslint-recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:@typescript-eslint/recommended-requiring-type-checking",
+    ),
+}]);

media/src/activity.tsx

@@ -1,10 +1,13 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { ActivityMap } from './activity/activity-map';
 
-ReactDOM.render(
-    <React.StrictMode>
-        <ActivityMap />
-    </React.StrictMode>,
-    document.getElementById('activity-map-container')
-);
+const container = document.getElementById('activity-map-container');
+if (container) {
+    const root = createRoot(container);
+    root.render(
+        <React.StrictMode>
+            <ActivityMap />
+        </React.StrictMode>
+    );
+}

media/src/activity/activity-map-pane-panels.tsx

@@ -67,7 +67,6 @@ export const DefaultPanel: React.FC<DefaultPanelProps> = (
     // const [reflectionSubmittedAt, setReflectionSubmittedAt] = useState<string>('');
     const [reflectionModifiedAt, setReflectionModifiedAt] = useState<string>('');
     // TODO: display response status
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const [reflectionStatus, setReflectionStatus] = useState<string>('DRAFT');
     const [feedback, setFeedback] = useState<string>('');
     const [feedbackSubmittedDate, setFeedbackSubmittedDate] = useState<string>('');

media/src/activity/activity-map.tsx

@@ -378,15 +378,13 @@ export const ActivityMap: React.FC = () => {
         }
         let layerPk = activeLayer;
         if (isFaculty && !projectLayerData.has(layerPk)) {
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
             const firstLayerPk = projectLayerData.keys().next().value;
             if (typeof firstLayerPk == 'number') {
                 layerPk = firstLayerPk;
             } else {
                 throw new Error('Add Event failed: no active layer can be found');
             }
         } else if (!isFaculty && !layerData.has(layerPk)) {
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
             const firstLayerPk = layerData.keys().next().value;
             if (typeof firstLayerPk == 'number') {
                 layerPk = firstLayerPk;
@@ -686,7 +684,6 @@ export const ActivityMap: React.FC = () => {
             }));
     }
     const handleViewportChange = useCallback(
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         (newViewport: React.SetStateAction<ViewportState>) => setViewportState(newViewport),
         []
     );
@@ -710,7 +707,6 @@ export const ActivityMap: React.FC = () => {
         // if no date with events, we don't include the layer.
 
         let layersForZoom: LayerData[] = [];
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
         const rangeEpoch1 = Date.parse(range1);
         const rangeEpoch2 = Date.parse(range2);
         const filteredLayers:  Map<number, LayerData> = new Map();

media/src/project.tsx

@@ -1,10 +1,13 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { ProjectMap } from './project/project-map';
 
-ReactDOM.render(
-    <React.StrictMode>
-        <ProjectMap />
-    </React.StrictMode>,
-    document.getElementById('project-map-container')
-);
+const container = document.getElementById('project-map-container');
+if (container) {
+    const root = createRoot(container);
+    root.render(
+        <React.StrictMode>
+            <ProjectMap />
+        </React.StrictMode>
+    );
+}

media/src/project/project-map.tsx

@@ -469,7 +469,6 @@ export const ProjectMap: React.FC = () => {
     }
 
     const handleViewportChange = useCallback(
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         (newViewport: React.SetStateAction<ViewportState>) => setViewportState(newViewport),
         []
     );
@@ -570,7 +569,7 @@ export const ProjectMap: React.FC = () => {
                     />
                     <DeckGL
                         layers={[
-                            ...rasterLayers as any, // eslint-disable-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment, max-len
+                            ...rasterLayers as any, // eslint-disable-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment, max-len
                             ...mapLayers
                         ]}
                         viewState={viewportState}