docs(linter): Clarify react-in-jsx-scope rule docs. (#15749)

Mention that it is an unnecessary practice for most modern React projects. Generally, you do not need to do `import React from 'react';` anymore for React 17+ projects.

Author: connorshea

crates/oxc_linter/src/rules/react/react_in_jsx_scope.rs

@@ -10,7 +10,7 @@ use crate::{
 };
 
 fn react_in_jsx_scope_diagnostic(span: Span) -> OxcDiagnostic {
-    OxcDiagnostic::warn("'React' must be in scope when using JSX")
+    OxcDiagnostic::warn("`React` must be in scope when using JSX.")
         .with_help("When using JSX, `<a />` expands to `React.createElement(\"a\")`. Therefore the `React` variable must be in scope.")
         .with_label(span)
 }
@@ -21,7 +21,18 @@ pub struct ReactInJsxScope;
 declare_oxc_lint!(
     /// ### What it does
     ///
-    /// Disallow missing React when using JSX
+    /// Enforces that React is imported and in-scope when using JSX syntax.
+    ///
+    /// Note that this rule is **not necessary** on React 17+ if you are using
+    /// the new JSX Transform, and you can disable this rule and skip importing
+    /// `React` in files with JSX syntax.
+    ///
+    /// If your `tsconfig.json` has `jsx` set to `react-jsx` or `react-jsxdev`, you are using the new JSX Transform.
+    /// For JavaScript projects using Babel, you are using the new JSX Transform if your React preset configuration
+    /// (in `.babelrc` or `babel.config.js`) has `runtime: "automatic"`.
+    ///
+    /// For more information, see
+    /// [the React blog post on JSX Transform](https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html#eslint).
     ///
     /// ### Why is this bad?
     ///
@@ -32,13 +43,13 @@ declare_oxc_lint!(
     ///
     /// Examples of **incorrect** code for this rule:
     /// ```jsx
-    /// var a = <a />;
+    /// const a = <a />;
     /// ```
     ///
     /// Examples of **correct** code for this rule:
     /// ```jsx
     /// import React from "react";
-    /// var a = <a />;
+    /// const a = <a />;
     /// ```
     ReactInJsxScope,
     react,

crates/oxc_linter/src/snapshots/react_react_in_jsx_scope.snap

@@ -1,35 +1,35 @@
 ---
 source: crates/oxc_linter/src/tester.rs
 ---
-  ⚠ eslint-plugin-react(react-in-jsx-scope): 'React' must be in scope when using JSX
+  ⚠ eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[react_in_jsx_scope.tsx:1:15]
  1 │ var App, a = <App />;
    ·               ───
    ╰────
   help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.
 
-  ⚠ eslint-plugin-react(react-in-jsx-scope): 'React' must be in scope when using JSX
+  ⚠ eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[react_in_jsx_scope.tsx:1:10]
  1 │ var a = <App />;
    ·          ───
    ╰────
   help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.
 
-  ⚠ eslint-plugin-react(react-in-jsx-scope): 'React' must be in scope when using JSX
+  ⚠ eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[react_in_jsx_scope.tsx:1:10]
  1 │ var a = <img />;
    ·          ───
    ╰────
   help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.
 
-  ⚠ eslint-plugin-react(react-in-jsx-scope): 'React' must be in scope when using JSX
+  ⚠ eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[react_in_jsx_scope.tsx:1:9]
  1 │ var a = <>fragment</>;
    ·         ──
    ╰────
   help: When using JSX, `<a />` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope.
 
-  ⚠ eslint-plugin-react(react-in-jsx-scope): 'React' must be in scope when using JSX
+  ⚠ eslint-plugin-react(react-in-jsx-scope): `React` must be in scope when using JSX.
    ╭─[react_in_jsx_scope.tsx:1:15]
  1 │ var Foo, a = <img />;
    ·               ───