eslint.config.js

const js = require('@eslint/js');
const fecConfig = require('@redhat-cloud-services/eslint-config-redhat-cloud-services');
const { defineConfig } = require('eslint/config');
const prettierConfig = require('eslint-config-prettier');
const pluginImport = require('eslint-plugin-import');
const jestDom = require('eslint-plugin-jest-dom');
const pluginJsxA11y = require('eslint-plugin-jsx-a11y');
const pluginPlaywright = require('eslint-plugin-playwright');
const pluginReact = require('eslint-plugin-react');
const pluginReactHooks = require('eslint-plugin-react-hooks');
const pluginReactRedux = require('eslint-plugin-react-redux');
const pluginTestingLibrary = require('eslint-plugin-testing-library');
const globals = require('globals');
const tseslint = require('typescript-eslint');

module.exports = defineConfig([
  {
    // Ignore programatically generated files and build artifacts
    ignores: [
      // Build outputs
      'dist/**',
      'cockpit/public/**',
      '.cache/**',
      'playwright-report/**',
      'pkg/**',
      // Generated API code
      '**/mockServiceWorker.js',
      '**/imageBuilderApi.ts',
      '**/hosted/contentSourcesApi.ts',
      '**/rhsmApi.ts',
      '**/complianceApi.ts',
      '**/types/generated.ts',
    ],
  },

  {
    // Base config for js/ts files
    files: ['**/*.{js,ts,jsx,tsx}'],
    languageOptions: {
      parser: tseslint.parser,
      globals: {
        ...globals.browser,
        ...globals.node,
        JSX: 'readonly',
        // vitest
        describe: 'readonly',
        it: 'readonly',
        test: 'readonly',
        expect: 'readonly',
        vi: 'readonly',
        beforeAll: 'readonly',
        beforeEach: 'readonly',
        afterAll: 'readonly',
        afterEach: 'readonly',
      },
    },
    plugins: {
      js,
      '@typescript-eslint': tseslint.plugin,
      react: pluginReact,
      'react-hooks': pluginReactHooks,
      'react-redux': pluginReactRedux,
      import: pluginImport,
      'jsx-a11y': pluginJsxA11y,
    },
    rules: {
      ...js.configs.recommended.rules,
      ...tseslint.configs.recommended.rules,
      ...pluginReact.configs.flat.recommended.rules,
      ...pluginReactHooks.configs.recommended.rules,
      ...pluginReactRedux.configs.recommended.rules,
      ...pluginJsxA11y.configs.recommended.rules,
      ...fecConfig.rules,
      'import/order': [
        'error',
        {
          groups: [
            'builtin',
            'external',
            'internal',
            'sibling',
            'parent',
            'index',
          ],
          alphabetize: {
            order: 'asc',
            caseInsensitive: true,
          },
          'newlines-between': 'always',
          pathGroups: [
            // ensures the import of React is always on top
            {
              pattern: 'react',
              group: 'builtin',
              position: 'before',
            },
            {
              pattern: '@/**',
              group: 'internal',
              position: 'before',
            },
          ],
          pathGroupsExcludedImportTypes: ['react'],
        },
      ],
      'sort-imports': [
        'error',
        {
          ignoreCase: true,
          ignoreDeclarationSort: true,
          ignoreMemberSort: false,
        },
      ],
      'no-duplicate-imports': 'error',
      // NOTE: we can enable this after the revamp and after summit. We can live with
      // the mixture of alias imports and relative imports. We can then enable the warning
      // or maybe errors (after summit). We can slowly migrate during the revamp, but adding
      // warnings now adds too much noise.
      // 'no-restricted-imports': ['warn', {
      //   patterns: [{
      //     group: ['../../*'],
      //     message: 'Avoid deep relative imports (../../ or deeper). Use @/ alias instead.',
      //   }],
      // }],
      'no-restricted-imports': [
        'error',
        {
          patterns: [
            {
              group: [
                '@/store/slices/wizard/cloud/*',
                '@/store/slices/wizard/compliance/*',
                '@/store/slices/wizard/content/*',
                '@/store/slices/wizard/details/*',
                '@/store/slices/wizard/filesystem/*.ts',
                '@/store/slices/wizard/output/*',
                '@/store/slices/wizard/registration/*',
                '@/store/slices/wizard/system/*',
              ],
              message:
                'Import from @/store/slices/wizard instead. Direct imports into slice internals bypass the barrel and fragment createSelector memoization caches.',
            },
          ],
        },
      ],
      'prefer-const': [
        'error',
        {
          destructuring: 'any',
        },
      ],
      'no-console': 'error',
      eqeqeq: 'error',
      'array-callback-return': 'warn',
      '@typescript-eslint/ban-ts-comment': [
        'error',
        {
          'ts-expect-error': 'allow-with-description',
          'ts-ignore': 'allow-with-description',
          'ts-nocheck': true,
          'ts-check': true,
          minimumDescriptionLength: 5,
        },
      ],
      '@typescript-eslint/ban-types': 'off',
      '@typescript-eslint/no-explicit-any': 'error',
      '@typescript-eslint/no-unsafe-function-type': 'error',
      'no-unused-vars': 'off', // disable js rule in favor of @typescript-eslint's rule
      '@typescript-eslint/no-unused-vars': [
        'error',
        {
          argsIgnorePattern: '^_',
          varsIgnorePattern: '^_',
          caughtErrorsIgnorePattern: '^_',
        },
      ],
      'react-hooks/set-state-in-effect': 'warn', // TODO address issues and enable the rule
      'no-restricted-syntax': [
        'error',
        {
          selector: "ImportSpecifier[imported.name='useAppStore']",
          message:
            'useAppStore exposes the raw store — only use it for store.getState() inside event handlers, never during render. Add an eslint-disable with justification if this usage is intentional.',
        },
      ],
    },
    settings: {
      react: {
        version: 'detect', // Automatically detect React version
      },
    },
  },

  {
    // TypeScript parser with project for source files only
    files: ['src/**/*.{js,ts,jsx,tsx}', 'playwright/**/*.ts'],
    languageOptions: {
      parser: tseslint.parser,
      parserOptions: {
        project: [
          './tsconfig.json',
          './tsconfig.vitest.json',
          './playwright/tsconfig.json',
        ],
      },
    },
    rules: {
      // Type-aware rules that require parserOptions.project
      '@typescript-eslint/no-require-imports': 'error',
      '@typescript-eslint/no-unnecessary-condition': 'error',
    },
  },

  {
    // Override for test files (legacy integration tests + co-located unit tests)
    files: [
      'src/test/**/*.{ts,tsx}',
      '**/*.test.{ts,tsx}',
      '**/tests/**/*.{ts,tsx}',
    ],
    plugins: {
      'jest-dom': jestDom,
      'testing-library': pluginTestingLibrary,
    },
    rules: {
      ...jestDom.configs.recommended.rules,
      ...pluginTestingLibrary.configs.react.rules,
      'react/display-name': 'off',
      'react/prop-types': 'off',
      'testing-library/no-debugging-utils': 'error',
    },
  },

  {
    // Override for Playwright tests
    files: ['playwright/**/*.ts'],
    plugins: {
      playwright: pluginPlaywright,
    },
    rules: {
      ...pluginPlaywright.configs.recommended.rules,
      'playwright/no-conditional-in-test': 'off',
      'playwright/no-conditional-expect': 'off',
      'playwright/no-skipped-test': [
        'error',
        {
          allowConditional: true,
        },
      ],
      '@typescript-eslint/await-thenable': 'error',
      '@typescript-eslint/no-floating-promises': 'error',
    },
  },

  {
    files: [
      'playwright/BootTests/helpers/OpenStackWrapper.ts',
      'playwright/BootTests/helpers/imageBuilding.ts',
    ],
    rules: {
      'no-console': 'off',
    },
  },

  prettierConfig,
]);