fix: React should not be in scope (#48)

Author: targos

base.js

@@ -21,6 +21,7 @@ export default defineConfig(
       parserOptions: {
         ecmaFeatures: {
           jsx: true,
+          jsxPragma: null,
         },
       },
     },
@@ -83,7 +84,7 @@ export default defineConfig(
       'react/jsx-no-undef': 'error',
       'react/jsx-no-useless-fragment': ['error', { allowExpressions: true }],
       'react/jsx-pascal-case': ['error', { allowAllCaps: true }],
-      'react/jsx-uses-react': 'error',
+      'react/jsx-uses-react': 'off',
       'react/jsx-uses-vars': 'error',
     },
   },

test/not_ok.jsx

@@ -0,0 +1,7 @@
+import React, { useEffect, useState } from 'react';
+
+export default function MyComponent() {
+  const [value] = useState('');
+  useEffect(() => value, []);
+  return <div>Hello world</div>;
+}

test/test.js

@@ -6,6 +6,39 @@ const ESLint = await loadESLint({ useFlatConfig: true });
 /** @type {import('eslint').ESLint} */
 const eslint = new ESLint();
 
-const [okResult] = await eslint.lintFiles(['test/ok.jsx']);
+const [okResult, notOkResult] = await eslint.lintFiles([
+  'test/ok.jsx',
+  'test/not_ok.jsx',
+]);
 
 assert.strictEqual(okResult.errorCount, 0, 'ok.jsx should have no error');
+
+const errors = notOkResult.messages.filter(isError).map(getRuleId).sort();
+
+assert.deepStrictEqual(errors, [
+  'no-unused-vars',
+  'react-hooks/exhaustive-deps',
+]);
+
+const warnings = notOkResult.messages
+  .filter(isWarning)
+  .filter(excludeJsdoc)
+  .map(getRuleId)
+  .sort();
+assert.deepStrictEqual(warnings, []);
+
+function isError(message) {
+  return message.severity === 2;
+}
+
+function isWarning(message) {
+  return message.severity === 1;
+}
+
+function excludeJsdoc(message) {
+  return !message.ruleId.startsWith('jsdoc/');
+}
+
+function getRuleId(message) {
+  return message.ruleId;
+}