eslint.config.js

import js from '@eslint/js'
import globals from 'globals'
import react from 'eslint-plugin-react'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'
import tsParser from '@typescript-eslint/parser'
import sort from 'eslint-plugin-sort'
import storybook from 'eslint-plugin-storybook'

export default tseslint.config(
  { ignores: ['dist', 'node_modules', 'storybook-static'] },
  {
    extends: [js.configs.recommended, ...tseslint.configs.recommendedTypeChecked],
    files: ['**/*.{ts,tsx}'],
    languageOptions: {
      ecmaVersion: 2020,
      globals: globals.browser,
      parser: tsParser,
      parserOptions: {
        project: [
          './tsconfig.node.json',
          './tsconfig.app.json',
          './.storybook/tsconfig.storybook.json',
        ],
        tsconfigRootDir: import.meta.dirname,
      },
    },
    plugins: {
      react,
      'react-hooks': reactHooks,
      'react-refresh': reactRefresh,
      sort,
      storybook,
    },
    settings: { react: { version: '19' } },
    rules: {
      ...react.configs.recommended.rules,
      ...react.configs['jsx-runtime'].rules,
      ...reactHooks.configs.recommended.rules,
      'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
      ...sort.configs.recommended.rules,
      'react/jsx-sort-props': ['error', { reservedFirst: true }] /* sort props alpha */,
      'react/no-unknown-property': ['error', { ignore: ['css'] }] /* fix emotion css */,
      'react/no-unescaped-entities': 'off' /* temp - make text with ' ' readable */,
      'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
      'react/jsx-max-props-per-line': [1, { when: 'multiline' }] /* max props per line */,
      'sort/type-properties': ['error'],
      'sort/string-enums': ['error'],
      'sort/string-unions': ['error'],
    },
  }
)