Merge pull request #116 from Loxeris/feat_eslint_imports

feat: config eslint import plugin

.eslintrc.json

@@ -1,6 +1,17 @@
 {
-  "extends": ["next/core-web-vitals", "prettier"],
+  "extends": [
+    "next/core-web-vitals",
+    "prettier",
+    "plugin:import/recommended",
+    "plugin:import/typescript"
+  ],
   "globals": {
     "JSX": "readonly"
+  },
+  "plugins": ["import"],
+  "rules": {
+    "import/order": ["error"],
+    "import/no-unused-modules": ["error"],
+    "import/no-useless-path-segments": ["error"]
   }
 }

package.json

@@ -39,6 +39,7 @@
     "eslint": "^8.56.0",
     "eslint-config-next": "^14.1.3",
     "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-import": "^2.29.1",
     "husky": "^9.0.11",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",

src/components/applications/JobMonitor.tsx

@@ -2,10 +2,10 @@
 import * as React from "react";
 import CssBaseline from "@mui/material/CssBaseline";
 import { Box } from "@mui/material";
-import { useMUITheme } from "@/hooks/theme";
 import { ThemeProvider as MUIThemeProvider } from "@mui/material/styles";
 import { JobDataTable } from "../ui/JobDataTable";
 import Dashboard from "../layout/Dashboard";
+import { useMUITheme } from "@/hooks/theme";
 
 /**
  * Build the Job Monitor application

src/components/applications/LoginForm.tsx

@@ -10,15 +10,15 @@ import MenuItem from "@mui/material/MenuItem";
 import Button from "@mui/material/Button";
 import Autocomplete from "@mui/material/Autocomplete";
 import TextField from "@mui/material/TextField";
-import { useMetadata, Metadata } from "@/hooks/metadata";
 import Image from "next/image";
 import { CssBaseline, Stack } from "@mui/material";
-import { useMUITheme } from "@/hooks/theme";
 import { ThemeProvider as MUIThemeProvider } from "@mui/material/styles";
 import { useRouter } from "next/navigation";
-import { useOIDCContext } from "@/hooks/oidcConfiguration";
 import * as React from "react";
 import { useOidc } from "@axa-fr/react-oidc";
+import { useOIDCContext } from "@/hooks/oidcConfiguration";
+import { useMUITheme } from "@/hooks/theme";
+import { useMetadata, Metadata } from "@/hooks/metadata";
 
 /**
  * Login form

src/components/applications/UserDashboard.tsx

@@ -2,11 +2,11 @@
 import * as React from "react";
 import CssBaseline from "@mui/material/CssBaseline";
 import { Box } from "@mui/material";
-import { useMUITheme } from "@/hooks/theme";
 import { ThemeProvider as MUIThemeProvider } from "@mui/material/styles";
 import { useOidcAccessToken } from "@axa-fr/react-oidc";
-import { useOIDCContext } from "@/hooks/oidcConfiguration";
 import Dashboard from "../layout/Dashboard";
+import { useOIDCContext } from "@/hooks/oidcConfiguration";
+import { useMUITheme } from "@/hooks/theme";
 
 /**
  * Build the User Dashboard page

src/components/layout/Dashboard.tsx

@@ -7,11 +7,11 @@ import IconButton from "@mui/material/IconButton";
 import MenuIcon from "@mui/icons-material/Menu";
 import Toolbar from "@mui/material/Toolbar";
 import Stack from "@mui/material/Stack";
+import { ThemeProvider as MUIThemeProvider } from "@mui/material/styles";
 import { ProfileButton } from "../ui/ProfileButton";
 import DashboardDrawer from "../ui/DashboardDrawer";
-import { useMUITheme } from "@/hooks/theme";
-import { ThemeProvider as MUIThemeProvider } from "@mui/material/styles";
 import { ThemeToggleButton } from "../ui/ThemeToggleButton";
+import { useMUITheme } from "@/hooks/theme";
 
 interface DashboardProps {
   children: React.ReactNode;

src/components/ui/DashboardDrawer.tsx

@@ -1,4 +1,3 @@
-import { DiracLogo } from "./DiracLogo";
 import { usePathname } from "next/navigation";
 import NextLink from "next/link";
 import {
@@ -15,6 +14,7 @@ import { Dashboard, FolderCopy } from "@mui/icons-material";
 import MonitorIcon from "@mui/icons-material/Monitor";
 import MenuBookIcon from "@mui/icons-material/MenuBook";
 import { ReactEventHandler } from "react";
+import { DiracLogo } from "./DiracLogo";
 
 // Define the sections that are accessible to users.
 // Each section has an associated icon and path.

src/components/ui/JobDataTable.tsx

@@ -1,5 +1,4 @@
 import * as React from "react";
-import { DataTable, MenuItem } from "./DataTable";
 import Box from "@mui/material/Box";
 import {
   blue,
@@ -21,17 +20,19 @@ import {
   Tooltip,
   useMediaQuery,
   useTheme,
+  Backdrop,
+  CircularProgress,
+  Snackbar,
 } from "@mui/material";
 import { useOidcAccessToken } from "@axa-fr/react-oidc";
-import { useOIDCContext } from "../../hooks/oidcConfiguration";
 import DeleteIcon from "@mui/icons-material/Delete";
 import ClearIcon from "@mui/icons-material/Clear";
 import ReplayIcon from "@mui/icons-material/Replay";
-import { Backdrop, CircularProgress, Snackbar } from "@mui/material";
-import { mutate } from "swr";
-import useSWR from "swr";
-import { fetcher } from "@/hooks/utils";
+import useSWR, { mutate } from "swr";
+import { useOIDCContext } from "../../hooks/oidcConfiguration";
+import { DataTable, MenuItem } from "./DataTable";
 import { JobHistoryDialog } from "./JobHistoryDialog";
+import { fetcher } from "@/hooks/utils";
 import { Filter } from "@/types/Filter";
 import { Column } from "@/types/Column";
 

src/components/ui/ProfileButton.tsx

@@ -1,5 +1,4 @@
 "use client";
-import { useOIDCContext } from "@/hooks/oidcConfiguration";
 import { useOidc, useOidcAccessToken } from "@axa-fr/react-oidc";
 import { Logout } from "@mui/icons-material";
 import {
@@ -15,6 +14,7 @@ import {
 } from "@mui/material";
 import { deepOrange } from "@mui/material/colors";
 import React from "react";
+import { useOIDCContext } from "@/hooks/oidcConfiguration";
 
 /**
  * Profile button, expected to vary whether the user is connected

src/hooks/theme.tsx

@@ -1,8 +1,8 @@
-import { ThemeContext } from "@/contexts/ThemeProvider";
 import { PaletteMode } from "@mui/material";
 import { deepOrange, grey, lightGreen } from "@mui/material/colors";
 import { createTheme, darken, lighten } from "@mui/material/styles";
 import { useContext } from "react";
+import { ThemeContext } from "@/contexts/ThemeProvider";
 
 /**
  * Custom hook to access the theme context

test/unit-tests/Dashboard.test.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { render, fireEvent } from "@testing-library/react";
+import { useOidc, useOidcAccessToken } from "@axa-fr/react-oidc";
 import Dashboard from "@/components/layout/Dashboard";
 import { ThemeProvider } from "@/contexts/ThemeProvider";
-import { useOidc, useOidcAccessToken } from "@axa-fr/react-oidc";
 
 // Mock the module
 jest.mock("@axa-fr/react-oidc", () => ({

test/unit-tests/JobDataTable.test.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import { JobDataTable } from "@/components/ui/JobDataTable";
 import useSWR from "swr";
 import { useOidcAccessToken } from "@axa-fr/react-oidc";
+import { JobDataTable } from "@/components/ui/JobDataTable";
 
 // Mock modules
 jest.mock("@axa-fr/react-oidc", () => ({

test/unit-tests/ProfileButton.test.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { render, fireEvent } from "@testing-library/react";
-import { ProfileButton } from "@/components/ui/ProfileButton";
 import { useOidcAccessToken, useOidc } from "@axa-fr/react-oidc";
+import { ProfileButton } from "@/components/ui/ProfileButton";
 import { OIDCConfigurationContext } from "@/contexts/OIDCConfigurationProvider";
 
 // Mocking the hooks

test/unit-tests/UserDashboard.test.tsx

@@ -1,12 +1,12 @@
 import React from "react";
 import { render } from "@testing-library/react";
-import UserDashboard from "@/components/applications/UserDashboard";
-import { ThemeProvider } from "@/contexts/ThemeProvider";
 import {
   useOIDCContext,
   useOidcAccessToken,
   useOidc,
 } from "@axa-fr/react-oidc";
+import UserDashboard from "@/components/applications/UserDashboard";
+import { ThemeProvider } from "@/contexts/ThemeProvider";
 
 // Mock the modules
 jest.mock("@axa-fr/react-oidc", () => ({