fix: add react plugin

eslint.config.js

@@ -15,6 +15,7 @@ module.exports = init(
     react: true,
     storybook: true,
     typescript: true,
+    tailwind: false,
   },
   {
     rules: {

package.json

@@ -24,6 +24,7 @@
   },
   "main": "src/index.js",
   "dependencies": {
+    "@eslint-react/eslint-plugin": "1.5.15",
     "@graphql-eslint/eslint-plugin": "3.20.1",
     "deepmerge": "4.3.1",
     "eslint-import-resolver-typescript": "3.6.1",
@@ -37,13 +38,12 @@
     "eslint-plugin-playwright": "1.6.2",
     "eslint-plugin-prettier": "5.1.3",
     "eslint-plugin-promise": "6.2.0",
-    "eslint-plugin-react": "7.34.2",
     "eslint-plugin-react-hooks": "4.6.2",
     "eslint-plugin-storybook": "0.8.0",
     "eslint-plugin-tailwindcss": "3.17.3",
     "eslint-plugin-vitest": "0.5.4",
-    "local-pkg": "0.5.0",
     "globals": "15.4.0",
+    "local-pkg": "0.5.0",
     "typescript-eslint": "rc-v8"
   },
   "devDependencies": {

src/init.d.ts

@@ -15,7 +15,7 @@ export interface Options {
   storybook?: boolean;
   prettier?: boolean;
   playwright?: boolean;
-  typescript?: { projects: string[] | string | boolean; tsconfigRootDir?: string };
+  typescript?: { projects: string[] | boolean | string; tsconfigRootDir?: string };
   disableExpensiveRules?: boolean;
   ignores?: string[];
 }

src/modules/jest.js

@@ -1,16 +1,13 @@
-const globals = require('globals');
 const plugin = require('eslint-plugin-jest');
-const { predicate } = require('../utils/conditions');
 const { globs } = require('../utils/globs');
 
 /**
  * @param { import('./init.d.ts').Options } options
  * @return { import('eslint').Linter.FlatConfig } */
-function jest(options = {}) {
+function jest() {
   return {
     files: globs.test,
     plugins: { jest: plugin },
-    languageOptions: { globals: globals.jest },
     rules: {
       'jest/consistent-test-it': 'off',
       'jest/expect-expect': 'off',

src/modules/playwright.js

@@ -1,4 +1,3 @@
-const globals = require('globals');
 const plugin = require('eslint-plugin-playwright');
 const { globs } = require('../utils/globs');
 

src/modules/react.js

@@ -1,109 +1,85 @@
-const reactPlugin = require('eslint-plugin-react');
+const reactPlugin = require('@eslint-react/eslint-plugin');
 const hooksPlugin = require('eslint-plugin-react-hooks');
 const a11yPlugin = require('eslint-plugin-jsx-a11y');
 
 /** @return { import('eslint').Linter.FlatConfig } */
 function react() {
   return {
     plugins: {
-      'react': reactPlugin,
+      ...reactPlugin.configs.all.plugins,
       'react-hooks': hooksPlugin,
       'jsx-a11y': a11yPlugin,
     },
+    languageOptions: {
+      globals: {
+        React: 'readonly',
+      },
+    },
     settings: {
       react: {
         pragma: 'React',
         version: 'detect',
       },
     },
     rules: {
-      'react/boolean-prop-naming': 'off',
-      'react/button-has-type': 'off',
-      'react/default-props-match-prop-types': 'off',
-      'react/destructuring-assignment': 'off',
-      'react/display-name': ['off', { ignoreTranspilerName: false }],
-      'react/forbid-component-props': 'off',
-      'react/forbid-dom-props': 'off',
-      'react/forbid-elements': 'off',
-      'react/forbid-foreign-prop-types': 'error',
-      'react/forbid-prop-types': 'off',
-      'react/function-component-definition': ['warn', { namedComponents: 'arrow-function', unnamedComponents: 'arrow-function' }],
-      'react/hook-use-state': 'off',
-      'react/iframe-missing-sandbox': 'error',
-      'react/jsx-boolean-value': 'warn',
-      'react/jsx-child-element-spacing': 'warn',
-      'react/jsx-curly-brace-presence': ['warn', { props: 'never', children: 'ignore' }],
-      'react/jsx-filename-extension': ['error', { extensions: ['.jsx', '.tsx'] }],
-      'react/jsx-fragments': 'off',
-      'react/jsx-handler-names': 'off',
-      'react/jsx-key': 'error',
-      'react/jsx-max-depth': 'off',
-      'react/jsx-newline': 'off',
-      'react/jsx-no-bind': 'off',
-      'react/jsx-no-comment-textnodes': 'error',
-      'react/jsx-no-constructed-context-values': 'error',
-      'react/jsx-no-duplicate-props': 'error',
-      'react/jsx-no-leaked-render': 'error',
-      'react/jsx-no-literals': 'off',
-      'react/jsx-no-script-url': 'error',
-      'react/jsx-no-target-blank': 'error',
-      'react/jsx-no-undef': 'error',
-      'react/jsx-no-useless-fragment': 'warn',
-      'react/jsx-one-expression-per-line': ['off', { allow: 'literal' }],
-      'react/jsx-pascal-case': 'error',
-      'react/jsx-props-no-multi-spaces': 'off',
-      'react/jsx-props-no-spreading': 'off',
-      'react/jsx-sort-props': 'off',
-      'react/jsx-uses-react': 'error',
-      'react/jsx-uses-vars': 'error',
-      'react/no-access-state-in-setstate': 'error',
-      'react/no-adjacent-inline-elements': 'error',
-      'react/no-array-index-key': 'warn',
-      'react/no-arrow-function-lifecycle': 'error',
-      'react/no-children-prop': 'off',
-      'react/no-danger': 'off',
-      'react/no-danger-with-children': 'error',
-      'react/no-deprecated': 'error',
-      'react/no-did-mount-set-state': 'error',
-      'react/no-did-update-set-state': 'error',
-      'react/no-direct-mutation-state': 'error',
-      'react/no-find-dom-node': 'error',
-      'react/no-invalid-html-attribute': 'warn',
-      'react/no-is-mounted': 'error',
-      'react/no-multi-comp': 'off',
-      'react/no-namespace': 'error',
-      'react/no-object-type-as-default-prop': 'warn',
-      'react/no-redundant-should-component-update': 'error',
-      'react/no-render-return-value': 'error',
-      'react/no-set-state': 'off',
-      'react/no-string-refs': 'error',
-      'react/no-this-in-sfc': 'error',
-      'react/no-typos': 'error',
-      'react/no-unescaped-entities': 'warn',
-      'react/no-unknown-property': 'error',
-      'react/no-unsafe': 'warn',
-      'react/no-unstable-nested-components': ['error', { allowAsProps: true }],
-      'react/no-unused-class-component-methods': 'warn',
-      'react/no-unused-prop-types': 'error',
-      'react/no-unused-state': 'error',
-      'react/no-will-update-set-state': 'error',
-      'react/prefer-es6-class': 'off',
-      'react/prefer-exact-props': 'off',
-      'react/prefer-read-only-props': 'off',
-      'react/prefer-stateless-function': 'off',
-      'react/prop-types': 'off',
-      'react/react-in-jsx-scope': 'off', // JSX automatic runtime
-      'react/require-default-props': 'off',
-      'react/require-optimization': 'off',
-      'react/require-render-return': 'error',
-      'react/self-closing-comp': 'error',
-      'react/sort-comp': 'off',
-      'react/sort-default-props': 'warn',
-      'react/sort-prop-types': 'off',
-      'react/state-in-constructor': 'off',
-      'react/static-property-placement': 'off',
-      'react/style-prop-object': 'error',
-      'react/void-dom-elements-no-children': 'error',
+      '@eslint-react/dom/no-children-in-void-dom-elements': 'warn',
+      '@eslint-react/dom/no-dangerously-set-innerhtml': 'warn',
+      '@eslint-react/dom/no-dangerously-set-innerhtml-with-children': 'error',
+      '@eslint-react/dom/no-find-dom-node': 'error',
+      '@eslint-react/dom/no-missing-button-type': 'warn',
+      '@eslint-react/dom/no-missing-iframe-sandbox': 'warn',
+      '@eslint-react/dom/no-namespace': 'error',
+      '@eslint-react/dom/no-render-return-value': 'error',
+      '@eslint-react/dom/no-script-url': 'warn',
+      '@eslint-react/dom/no-unsafe-iframe-sandbox': 'warn',
+      '@eslint-react/dom/no-unsafe-target-blank': 'warn',
+
+      '@eslint-react/ensure-forward-ref-using-ref': 'warn',
+      '@eslint-react/no-access-state-in-setstate': 'error',
+      '@eslint-react/no-array-index-key': 'warn',
+      '@eslint-react/no-children-count': 'warn',
+      '@eslint-react/no-children-for-each': 'warn',
+      '@eslint-react/no-children-map': 'warn',
+      '@eslint-react/no-children-only': 'warn',
+      '@eslint-react/no-children-prop': 'warn',
+      '@eslint-react/no-children-to-array': 'warn',
+      '@eslint-react/no-clone-element': 'warn',
+      '@eslint-react/no-comment-textnodes': 'warn',
+      '@eslint-react/no-component-will-mount': 'error',
+      '@eslint-react/no-component-will-receive-props': 'error',
+      '@eslint-react/no-component-will-update': 'error',
+      '@eslint-react/no-create-ref': 'error',
+      '@eslint-react/no-direct-mutation-state': 'error',
+      '@eslint-react/no-duplicate-key': 'error',
+      '@eslint-react/no-implicit-key': 'error',
+      '@eslint-react/no-missing-key': 'error',
+      '@eslint-react/no-nested-components': 'warn',
+      '@eslint-react/no-redundant-should-component-update': 'error',
+      '@eslint-react/no-set-state-in-component-did-mount': 'warn',
+      '@eslint-react/no-set-state-in-component-did-update': 'warn',
+      '@eslint-react/no-set-state-in-component-will-update': 'warn',
+      '@eslint-react/no-string-refs': 'error',
+      '@eslint-react/no-unsafe-component-will-mount': 'warn',
+      '@eslint-react/no-unsafe-component-will-receive-props': 'warn',
+      '@eslint-react/no-unsafe-component-will-update': 'warn',
+      '@eslint-react/no-unstable-context-value': 'error',
+      '@eslint-react/no-unstable-default-props': 'error',
+      '@eslint-react/no-unused-class-component-members': 'warn',
+      '@eslint-react/no-unused-state': 'warn',
+      '@eslint-react/no-useless-fragment': 'warn',
+      '@eslint-react/prefer-destructuring-assignment': 'warn',
+      '@eslint-react/prefer-shorthand-boolean': 'warn',
+      '@eslint-react/prefer-shorthand-fragment': 'warn',
+
+      '@eslint-react/hooks-extra/ensure-custom-hooks-using-other-hooks': 'warn',
+      '@eslint-react/hooks-extra/ensure-use-callback-has-non-empty-deps': 'warn',
+      '@eslint-react/hooks-extra/ensure-use-memo-has-non-empty-deps': 'warn',
+      '@eslint-react/hooks-extra/prefer-use-state-lazy-initialization': 'warn',
+
+      '@eslint-react/naming-convention/component-name': 'warn',
+      '@eslint-react/naming-convention/filename': 'warn',
+      '@eslint-react/naming-convention/filename-extension': 'warn',
+      '@eslint-react/naming-convention/use-state': 'warn',
 
       'react-hooks/exhaustive-deps': 'warn',
       'react-hooks/rules-of-hooks': 'error',

src/modules/strict.js

@@ -1,14 +1,11 @@
-const { predicate } = require('../utils/conditions');
-
 /**
  * @param {import('../init.d.ts').Options} options
  * @return { import('eslint').Linter.FlatConfig }
  */
-function strict(options = {}) {
+function strict() {
   return {
     rules: {
       'no-console': 'warn',
-      // ...predicate(options.typescript, { '@typescript-eslint/no-non-null-assertion': 'warn' }),
     },
   };
 }

src/modules/tailwind.js

@@ -1,7 +1,7 @@
-const plugin = require('eslint-plugin-tailwindcss');
-
 /** @return { Promise<import('eslint').Linter.FlatConfig> } */
 function tailwind() {
+  const plugin = require('eslint-plugin-tailwindcss');
+
   return {
     plugins: { tailwindcss: plugin },
     rules: {

src/modules/tests.js

@@ -1,7 +1,7 @@
 const plugin = require('eslint-plugin-jest-formatting');
+const globals = require('globals');
 const { globs } = require('../utils/globs');
 const { predicate } = require('../utils/conditions');
-const globals = require('globals');
 
 /**
  * @param {import('../init').Options} options
@@ -12,7 +12,7 @@ function tests(options = {}) {
     plugins: { 'jest-formatting': plugin },
     files: [...globs.test, ...globs.e2e],
     languageOptions: {
-      globals: globals['shared-node-browser'],
+      globals: { ...globals['shared-node-browser'], ...globals.jest },
     },
     rules: {
       'jest-formatting/padding-around-after-all-blocks': 'warn',

src/modules/typescript.js

@@ -93,6 +93,7 @@ function typescript(options = {}) {
       '@typescript-eslint/no-non-null-asserted-nullish-coalescing': 'error',
       '@typescript-eslint/no-non-null-asserted-optional-chain': 'error',
       '@typescript-eslint/no-non-null-assertion': 'off',
+      ...predicate(options.strict, { '@typescript-eslint/no-non-null-assertion': 'warn' }),
       '@typescript-eslint/no-redeclare': ['off', { ignoreDeclarationMerge: true }], // useful in FP.
       '@typescript-eslint/no-require-imports': 'error',
       '@typescript-eslint/no-restricted-imports': 'off',