"Restore" ESLint support

I removed our leftover config in opencast#700 with a promise to bring ESLint back.
Well this is it, for now!

This introduces an ESLint config file in the new flat file format,
which will be required for ESLint `>= 9`. It is already supported in version 8, though,
which we are still stuck on because of the (unmaintained) config we are/were using.
I briefly tried to port this project over to `@opencast/eslint-config-ts-react`,
but the code said "no," basically. ;P

This has a few unfortunate consequences. See opencast#713. I plan to address these in due time, though.

Note that this does **not** introduce automatic/live checking of the code
during development. I only added a call to the linter to the build command,
in turn making CI fail when there are warnings.
I created opencast#712 to track the live thing if we want that.

eslint.config.js

@@ -0,0 +1,9 @@
+import { FlatCompat } from "@eslint/eslintrc";
+
+const config = [
+    { ignores: ["build"] },
+    ...new FlatCompat({ baseDirectory: import.meta.dirname })
+        .extends("eslint-config-react-app"),
+];
+
+export default config;

package.json

@@ -45,7 +45,7 @@
   },
   "scripts": {
     "start": "vite",
-    "build": "tsc && vite build",
+    "build": "tsc && eslint . --max-warnings=0 && vite build",
     "serve": "vite preview",
     "test": "vitest"
   },
@@ -62,12 +62,18 @@
     ]
   },
   "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@eslint/eslintrc": "^3.1.0",
+    "@eslint/js": "^9.5.0",
     "@redux-devtools/extension": "^3.3.0",
     "@types/lodash": "^4.17.4",
     "@types/node": "^20.14.1",
     "@types/react-dom": "^18.3.0",
     "@types/uuid": "^9.0.8",
+    "@typescript-eslint/eslint-plugin": "^7.13.1",
     "@vitejs/plugin-react-swc": "^3.7.0",
+    "eslint": "^8.57.0",
+    "eslint-config-react-app": "^7.0.1",
     "prop-types": "^15.8.1",
     "rollup-preserve-directives": "^1.1.1",
     "sass": "^1.77.4",

src/components/Header.tsx

@@ -14,7 +14,7 @@ import {
 } from "../selectors/userInfoSelectors";
 import { availableHotkeys } from "../configs/hotkeysConfig";
 import { studioURL } from "../configs/generalConfig";
-import { getCurrentLanguageInformation, hasAccess } from "../utils/utils";
+import { hasAccess } from "../utils/utils";
 import { overflowStyle } from "../utils/componentStyles";
 import RegistrationModal from "./shared/RegistrationModal";
 import HotKeyCheatSheet from "./shared/HotKeyCheatSheet";
@@ -26,9 +26,6 @@ import { Tooltip } from "./shared/Tooltip";
 import { HiTranslate } from "react-icons/hi";
 import { IconContext } from "react-icons";
 
-// Get code, flag and name of the current language
-const currentLanguage = getCurrentLanguageInformation();
-
 // References for detecting a click outside of the container of the dropdown menus
 const containerLang = React.createRef<HTMLDivElement>();
 const containerHelp = React.createRef<HTMLDivElement>();

src/components/events/partials/EventActionCell.tsx

@@ -1,7 +1,6 @@
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import ConfirmModal from "../../shared/ConfirmModal";
-import { connect } from "react-redux";
 import EventDetailsModal from "./modals/EventDetailsModal";
 import EmbeddingCodeModal from "./modals/EmbeddingCodeModal";
 import { getUserInformation } from "../../../selectors/userInfoSelectors";

src/components/events/partials/ModalTabsAndPages/SeriesDetailsThemeTab.tsx

@@ -3,7 +3,6 @@ import { useTranslation } from "react-i18next";
 import { Formik } from "formik";
 import _ from "lodash";
 import cn from "classnames";
-import { connect } from "react-redux";
 import Notifications from "../../../shared/Notifications";
 import { getUserInformation } from "../../../../selectors/userInfoSelectors";
 import { hasAccess } from "../../../../utils/utils";

src/components/events/partials/SeriesActionsCell.tsx

@@ -1,7 +1,6 @@
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import ConfirmModal from "../../shared/ConfirmModal";
-import { connect } from "react-redux";
 import SeriesDetailsModal from "./modals/SeriesDetailsModal";
 import {
 	fetchSeriesDetailsThemeNames,

src/components/recordings/partials/RecordingsActionCell.tsx

@@ -1,6 +1,5 @@
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
 import ConfirmModal from "../../shared/ConfirmModal";
 import RecordingDetailsModal from "./modal/RecordingDetailsModal";
 import { getUserInformation } from "../../../selectors/userInfoSelectors";

src/components/shared/Notifications.tsx

@@ -3,7 +3,6 @@ import {
 	getNotifications,
 	getGlobalPositions,
 } from "../../selectors/notificationSelector";
-import { connect } from "react-redux";
 import { useTranslation } from "react-i18next";
 import cn from "classnames";
 import {

src/components/statistics/Statistics.tsx

@@ -1,5 +1,4 @@
 import React, { useEffect, useState } from "react";
-import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import cn from "classnames";

src/components/users/partials/GroupsActionsCell.tsx

@@ -1,5 +1,4 @@
 import React, { useState } from "react";
-import { connect } from "react-redux";
 import { useTranslation } from "react-i18next";
 import ConfirmModal from "../../shared/ConfirmModal";
 import GroupDetailsModal from "./modal/GroupDetailsModal";

src/components/users/partials/UsersActionsCell.tsx

@@ -1,6 +1,5 @@
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
 import ConfirmModal from "../../shared/ConfirmModal";
 import UserDetailsModal from "./modal/UserDetailsModal";
 import { getUserInformation } from "../../../selectors/userInfoSelectors";