import globals from 'globals';
import reactPlugin from 'eslint-plugin-react';
import reactHooksPlugin from 'eslint-plugin-react-hooks';
import stylisticPlugin from '@stylistic/eslint-plugin';

export default [
  {
    ignores: ['node_modules/**', 'vendor/**', 'var/**', 'public/build/**'],
  },
  {
    files: ['**/*.{js,mjs,cjs,jsx,ts,tsx}'],
    plugins: {
      react: reactPlugin,
      'react-hooks': reactHooksPlugin,
      '@stylistic': stylisticPlugin,
    },
    languageOptions: {
      globals: {
        ...globals.browser,
        ...globals.node,
      },
      parserOptions: {
        ecmaVersion: 'latest',
        sourceType: 'module',
        ecmaFeatures: {
          jsx: true,
        },
      },
    },
    settings: {
      react: {
        version: 'detect',
      },
    },
    rules: {
      'yoda': ['error', 'always'],
      'arrow-body-style': ['error', 'as-needed'],
      'no-empty': ['error', { 'allowEmptyCatch': true }],
      'no-multiple-empty-lines': 1,
      'no-unused-vars': ['error', {
        'vars': 'all',
        'args': 'after-used',
        'caughtErrors': 'none',
        'ignoreRestSiblings': false,
        'reportUsedIgnorePattern': false,
      }],
      'react/react-in-jsx-scope': 'off',
      'react/prop-types': 'off',
      'react-hooks/rules-of-hooks': 'error',
      'react-hooks/exhaustive-deps': 'warn',
      '@stylistic/semi': 0,
      '@stylistic/comma-dangle': [1, {
        arrays: 'only-multiline',
        objects: 'only-multiline',
        imports: 'only-multiline',
        exports: 'only-multiline',
        functions: 'only-multiline',
      }],
      '@stylistic/operator-linebreak': ['error', 'before'],
      '@stylistic/indent': ['error', 2, { SwitchCase: 1 }],
      '@stylistic/space-before-function-paren': ['error', {
        anonymous: 'never',
        named: 'never',
        asyncArrow: 'always',
      }],
      '@stylistic/arrow-parens': ['error', 'as-needed', {
        requireForBlockBody: false,
      }],
      '@stylistic/arrow-spacing': ['error', {
        before: true,
        after: true,
      }],
      '@stylistic/no-mixed-spaces-and-tabs': 1,
      '@stylistic/jsx-closing-bracket-location': 1,
      '@stylistic/jsx-closing-tag-location': 1,
      '@stylistic/jsx-curly-brace-presence': [1, 'never'],
      '@stylistic/jsx-curly-spacing': 1,
      '@stylistic/jsx-equals-spacing': 1,
      '@stylistic/jsx-first-prop-new-line': [1, 'multiline-multiprop'],
      '@stylistic/jsx-pascal-case': [1, {
        allowAllCaps: false,
        allowNamespace: true,
        allowLeadingUnderscore: false,
      }],
      '@stylistic/no-multi-spaces': 1,
      '@stylistic/jsx-self-closing-comp': ['error', {
        component: true,
        html: true,
      }],
      '@stylistic/jsx-wrap-multilines': [1, {
        declaration: 'parens-new-line',
        assignment: 'parens-new-line',
        return: 'parens-new-line',
        arrow: 'parens-new-line',
        condition: 'ignore',
        logical: 'parens-new-line',
        prop: 'parens-new-line',
        propertyValue: 'parens-new-line',
      }],
      '@stylistic/jsx-tag-spacing': [1, {
        closingSlash: 'never',
        beforeSelfClosing: 'always',
        afterOpening: 'never',
        beforeClosing: 'allow',
      }],
    },
  },
  {
    files: ['**/*.jsx'],
    rules: {
      'react/jsx-uses-vars': 'error',
      'no-unused-vars': ['error', {
        varsIgnorePattern: '^React$',
        args: 'after-used',
        caughtErrors: 'none',
        ignoreRestSiblings: false,
        reportUsedIgnorePattern: false,
      }],
    },
  },
];