import type { Middleware } from '../index';
import { error, off, warn } from '../constants';
import { ReactRulesObject } from '@aet/eslint-define-config/src/rules/react';
import { ReactRefreshRulesObject } from '@aet/eslint-define-config/src/rules/react-refresh';

const reactRules: Partial<ReactRulesObject> = {
  '@eslint-react/no-missing-component-display-name': off,
  '@eslint-react/no-children-prop': error,
};

export const react: Middleware = (config, { addRules }) => {
  config.plugins.push('@eslint-react/eslint-plugin', 'react-hooks');
  config.extends.push(
    'plugin:@eslint-react/recommended-legacy',
    'plugin:@eslint-react/dom-legacy',
    'plugin:react-hooks/recommended',
    'plugin:jsx-a11y/recommended',
  );
  config.overrides.push({
    files: ['*.tsx'],
    rules: {
      '@eslint-react/no-leaked-conditional-rendering': error,
    },
  });
  addRules(reactRules);
};

const refreshRules: Partial<ReactRefreshRulesObject> = {
  'react-refresh/only-export-components': [warn, { allowConstantExport: true }],
};

export const reactRefresh: Middleware = (config, { addRules }) => {
  config.plugins.push('react-refresh');
  addRules(refreshRules);
};