Update eslint to v9.x and other dependencies

apps/ocp-plugin/package.json

@@ -53,7 +53,7 @@
   "devDependencies": {
     "@types/react-dom": "^18.2.17",
     "css-loader": "^6.8.1",
-    "css-minimizer-webpack-plugin": "^7.0.4",
+    "css-minimizer-webpack-plugin": "^8.0.0",
     "html-webpack-plugin": "^5.6.3",
     "mini-css-extract-plugin": "^2.10.0",
     "monaco-editor-webpack-plugin": "^7.1.0",
@@ -66,7 +66,7 @@
     "tsconfig-paths-webpack-plugin": "^4.1.0",
     "ts-loader": "^9.4.4",
     "url-loader": "^4.1.1",
-    "webpack": "5.76.3",
+    "webpack": "^5.105.4",
     "webpack-dev-server": "^5.2.3"
   },
   "dependencies": {

apps/standalone/package.json

@@ -20,9 +20,9 @@
   },
   "devDependencies": {
     "@types/react-dom": "^18.2.17",
-    "copy-webpack-plugin": "^13.0.0",
+    "copy-webpack-plugin": "^14.0.0",
     "css-loader": "^6.8.1",
-    "css-minimizer-webpack-plugin": "^7.0.4",
+    "css-minimizer-webpack-plugin": "^8.0.0",
     "dotenv": "^16.3.1",
     "html-webpack-plugin": "^5.6.3",
     "mini-css-extract-plugin": "^2.10.0",
@@ -36,7 +36,7 @@
     "ts-loader": "^9.4.4",
     "tsconfig-paths-webpack-plugin": "^4.1.0",
     "url-loader": "^4.1.1",
-    "webpack": "5.76.3",
+    "webpack": "^5.105.4",
     "webpack-dev-server": "^5.2.3"
   },
   "dependencies": {

apps/standalone/src/app/components/AppLayout/AppLayout.tsx

@@ -89,7 +89,9 @@ const AppLayoutContent = () => {
       onClick={(event) => {
         event.preventDefault();
         const primaryContentContainer = document.getElementById(pageId);
-        primaryContentContainer && primaryContentContainer.focus();
+        if (primaryContentContainer) {
+          primaryContentContainer.focus();
+        }
       }}
       href={`#${pageId}`}
     >

apps/standalone/src/app/components/Login/LoginPage.tsx

@@ -52,7 +52,7 @@ const LoginPage = () => {
       setIsRedirecting(true);
       try {
         await redirectToProviderLogin(provider);
-      } catch (err) {
+      } catch {
         setIsRedirecting(false);
         setUserSelectedProvider(null);
         setError(
@@ -86,15 +86,15 @@ const LoginPage = () => {
             setIsRedirecting(true);
             try {
               await redirectToProviderLogin(providers[0]);
-            } catch (err) {
+            } catch {
               setIsRedirecting(false);
               setError(t('Failed to initiate login'));
             }
           }
         } else {
           setError(t('No authentication providers found. Please contact your administrator.'));
         }
-      } catch (err) {
+      } catch {
         setError(t('Failed to load the authentication providers'));
       } finally {
         setLoading(false);

apps/standalone/src/app/context/AuthContext.ts

@@ -71,7 +71,7 @@ export const useAuthContext = () => {
                   errorMessage = text;
                 }
               }
-            } catch (parseErr) {
+            } catch {
               // If parsing fails, use default error message
               errorMessage = 'Authentication failed';
             }
@@ -119,7 +119,7 @@ export const useAuthContext = () => {
                   errorMessage = text;
                 }
               }
-            } catch (parseErr) {
+            } catch {
               // If parsing fails, use default error message
             }
             setError(errorMessage);
@@ -140,7 +140,7 @@ export const useAuthContext = () => {
                   errorMessage = text;
                 }
               }
-            } catch (parseErr) {
+            } catch {
               // If parsing fails, use default error message
             }
             setError(errorMessage);
@@ -206,7 +206,7 @@ export const useAuthContext = () => {
           } else {
             localStorage.removeItem(EXPIRATION);
           }
-        } catch (err) {
+        } catch {
           // By deleting the expiration, the next API request will get 401 and redirect to login
           localStorage.removeItem(EXPIRATION);
         }

apps/standalone/src/app/utils/apiCalls.ts

@@ -65,7 +65,11 @@ const getFullApiUrl = (path: string): { api: 'flightctl' | 'imagebuilder' | 'ale
 export const logout = async () => {
   const response = await fetch(`${uiProxyAPI}/logout`, { credentials: 'include' });
   const { url } = (await response.json()) as { url: string };
-  url ? (window.location.href = url) : window.location.reload();
+  if (url) {
+    window.location.href = url;
+  } else {
+    window.location.reload();
+  }
 };
 
 export const redirectToLogin = () => {

eslint.config.js

@@ -0,0 +1,127 @@
+const { defineConfig, globalIgnores } = require('eslint/config');
+
+const tsParser = require('@typescript-eslint/parser');
+const typescriptEslint = require('@typescript-eslint/eslint-plugin');
+const reactHooks = require('eslint-plugin-react-hooks');
+
+const { fixupPluginRules } = require('@eslint/compat');
+
+const globals = require('globals');
+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: {
+      parser: tsParser,
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+
+      parserOptions: {
+        comment: true,
+
+        ecmaFeatures: {
+          jsx: true,
+        },
+
+        project: true,
+      },
+
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+      },
+    },
+
+    extends: compat.extends(
+      'plugin:react/recommended',
+      'plugin:@typescript-eslint/recommended',
+      'plugin:@typescript-eslint/recommended-type-checked',
+    ),
+
+    settings: {
+      react: {
+        version: 'detect',
+      },
+    },
+
+    plugins: {
+      '@typescript-eslint': typescriptEslint,
+      'react-hooks': fixupPluginRules(reactHooks),
+    },
+
+    rules: {
+      'sort-imports': [
+        'error',
+        {
+          ignoreDeclarationSort: true,
+        },
+      ],
+
+      'no-restricted-imports': [
+        'error',
+        {
+          patterns: [
+            {
+              group: ['@patternfly/react-icons/dist/esm**'],
+              message: 'Import using the full js path `@patternfly/react-icons/dist/js/icons<icon>` instead',
+            },
+            {
+              group: ['@patternfly/react-tokens/dist/esm**'],
+              message: 'Import using the full js path `@patternfly/react-tokens/dist/js/icons<icon>` instead',
+            },
+          ],
+
+          paths: [
+            {
+              name: '@patternfly/react-icons',
+              message: 'Import using full path `@patternfly/react-icons/dist/js/icons<icon>` instead',
+            },
+            {
+              name: '@patternfly/react-tokens',
+              message: 'Import using full path `@patternfly/react-tokens/dist/js/<token>` instead',
+            },
+            {
+              name: '@patternfly/react-core',
+              importNames: ['Form'],
+              message: 'Use FlightCtlForm wrapper',
+            },
+            {
+              name: '@patternfly/react-core',
+              importNames: ['WizardFooterWrapper', 'WizardFooter'],
+              message: 'Use FlightCtlWizardFooter wrapper',
+            },
+            {
+              name: 'react-i18next',
+              importNames: ['useTranslation'],
+              message: 'Import useTranslation from @flightctl/ui-components/hooks/useTranslation instead',
+            },
+            {
+              name: 'lodash',
+              message: 'Import using full path `lodash/<function>` instead',
+            },
+          ],
+        },
+      ],
+
+      '@typescript-eslint/explicit-function-return-type': 'off',
+      'react/self-closing-comp': 'error',
+      'react-hooks/rules-of-hooks': 'error',
+      'react-hooks/exhaustive-deps': 'error',
+      'react/prop-types': 'off',
+      'no-console': 'error',
+      '@typescript-eslint/no-misused-promises': 'off',
+      '@typescript-eslint/no-floating-promises': 'off',
+      '@typescript-eslint/no-unsafe-enum-comparison': 'off',
+      '@typescript-eslint/no-unused-vars': 'error',
+    },
+  },
+  globalIgnores(['**/*.json']),
+]);