Improved EsLint performance + bump frontend packages (#656)

* Bump frontend packages to latest

* DropDown.stories.tsx fixed

frontend/eslint.config.js

@@ -1,10 +1,10 @@
 import js from "@eslint/js";
 import { defineConfig } from "eslint/config";
 import globals from "globals";
-import tseslint from "typescript-eslint";
+import { configs as tseslintConf } from "typescript-eslint";
 import react from "eslint-plugin-react";
 import reactHooks from "eslint-plugin-react-hooks";
-import importPlugin from "eslint-plugin-import";
+import { flatConfigs as importXFlatConf } from "eslint-plugin-import-x";
 import prettierRecommended from "eslint-plugin-prettier/recommended";
 // import tscPlugin from "eslint-plugin-tsc";
 
@@ -12,11 +12,11 @@ export default defineConfig(
   { ignores: ["dist", "node_modules"] },
 
   js.configs.recommended,
-  tseslint.configs.recommendedTypeChecked,
+  tseslintConf.recommendedTypeChecked,
   // tsEslint.configs.strictTypeChecked, // The project is not ready yet
   // tsEslint.configs.stylisticTypeChecked, // Added for better 2026 coding standards, however the project is not ready yet
-  importPlugin.flatConfigs.recommended,
-  importPlugin.flatConfigs.typescript,
+  importXFlatConf.recommended,
+  importXFlatConf.typescript,
   react.configs.flat.recommended,
   react.configs.flat["jsx-runtime"],
   reactHooks.configs.flat.recommended,
@@ -38,7 +38,7 @@ export default defineConfig(
     },
     settings: {
       react: { version: "detect" },
-      "import/resolver": {
+      "import-x/resolver": {
         node: true,
         typescript: {
           alwaysTryTypes: true,
@@ -57,7 +57,7 @@ export default defineConfig(
       semi: ["error", "always"],
 
       /* ───────── Import Precision ───────── */
-      "import/no-duplicates": ["error", { "prefer-inline": true }],
+      "import-x/no-duplicates": ["error", { "prefer-inline": true }],
 
       /* ───────── React Precision ───────── */
       "no-restricted-properties": [
@@ -105,7 +105,7 @@ export default defineConfig(
   },
   {
     files: ["**/*.{js,mjs}"],
-    ...tseslint.configs.disableTypeChecked,
+    ...tseslintConf.disableTypeChecked,
     languageOptions: {
       globals: {
         ...globals.node,
@@ -114,6 +114,6 @@ export default defineConfig(
   },
   {
     files: ["eslint.config.js"],
-    rules: { "import/no-unresolved": "off" },
+    rules: { "import-x/no-unresolved": "off" },
   }
 );

frontend/package.json

@@ -35,27 +35,27 @@
     "react-dom": "^19.2.4",
     "react-error-boundary": "^6.1.1",
     "react-icons": "^5.5.0",
-    "react-intersection-observer": "^10.0.2",
+    "react-intersection-observer": "^10.0.3",
     "react-modern-drawer": "^1.4.0",
     "react-router": "^7.13.0",
     "react-select": "^5.10.2",
-    "swagger-ui-react": "^5.31.0",
+    "swagger-ui-react": "^5.31.2",
     "uuid": "^13.0.0"
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3.3.3",
     "@eslint/js": "^9.39.2",
-    "@storybook/addon-docs": "^10.2.8",
-    "@storybook/addon-links": "^10.2.8",
+    "@storybook/addon-docs": "^10.2.10",
+    "@storybook/addon-links": "^10.2.10",
     "@storybook/mdx2-csf": "^1.1.0",
-    "@storybook/react-vite": "^10.2.8",
-    "@tailwindcss/vite": "^4.1.18",
+    "@storybook/react-vite": "^10.2.10",
+    "@tailwindcss/vite": "^4.2.0",
     "@types/luxon": "^3.7.1",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
     "@types/swagger-ui-react": "^5.18.0",
-    "@typescript-eslint/eslint-plugin": "^8.48.0",
-    "@typescript-eslint/parser": "^8.48.0",
+    "@typescript-eslint/eslint-plugin": "^8.56.0",
+    "@typescript-eslint/parser": "^8.56.0",
     "@vitejs/plugin-react": "^5.1.4",
     "autoprefixer": "^10.4.24",
     "babel-plugin-react-compiler": "^1.0.0",
@@ -63,11 +63,11 @@
     "eslint": "^9.39.2",
     "eslint-config-prettier": "^10.1.8",
     "eslint-import-resolver-typescript": "^4.4.4",
-    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-import-x": "^4.16.1",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",
-    "eslint-plugin-storybook": "^10.2.8",
+    "eslint-plugin-storybook": "^10.2.10",
     "eslint-plugin-tsc": "^2.0.0",
     "flowbite": "^4.0.1",
     "globals": "^17.3.0",
@@ -75,14 +75,17 @@
     "lint-staged": "^16.2.7",
     "prettier": "^3.8.1",
     "prettier-plugin-tailwindcss": "^0.7.2",
-    "rollup-plugin-visualizer": "^6.0.5",
-    "storybook": "^10.2.8",
-    "tailwindcss": "^4.1.18",
+    "rollup-plugin-visualizer": "^7.0.0",
+    "storybook": "^10.2.10",
+    "tailwindcss": "^4.2.0",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.55.0",
+    "typescript-eslint": "^8.56.0",
     "vite": "^7.3.1",
     "vite-plugin-static-copy": "^3.2.0"
   },
+  "overrides": {
+    "minimatch": "^10.2.2"
+  },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": "npm run lint:fix",
     "*.{js,jsx,ts,tsx,json,css,md,mdx}": "npm run prettier:fix"

frontend/src/components/common/DropDown.stories.tsx

@@ -5,13 +5,9 @@ import { action } from "storybook/actions";
 import DropDown from "./DropDown";
 
 const meta = {
-  /* 👇 The title prop is optional.
-   * See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
-   * to learn how to generate automatic titles
-   */
   title: "DropDown",
   component: DropDown,
-} as unknown as Meta<typeof DropDown>;
+} satisfies Meta<typeof DropDown>;
 
 export default meta;