Update React Compiler to 1.0.0 (#13004)

* update react compiler to 1.0.0

* update test

* cleanup

Author: phryneas

eslint.config.mjs

@@ -15,15 +15,15 @@ if (!process.features.typescript) {
 import path from "node:path";
 import { fileURLToPath } from "node:url";
 
-import { fixupConfigRules, fixupPluginRules } from "@eslint/compat";
+import { fixupPluginRules } from "@eslint/compat";
 import { FlatCompat } from "@eslint/eslintrc";
 import js from "@eslint/js";
 import typescriptEslint from "@typescript-eslint/eslint-plugin";
 import tsParser from "@typescript-eslint/parser";
 import _import from "eslint-plugin-import";
 import * as mdx from "eslint-plugin-mdx";
-import reactCompiler from "eslint-plugin-react-compiler";
 import globals from "globals";
+import reactHooks from "eslint-plugin-react-hooks";
 
 import localRules from "./eslint-local-rules/index.mjs";
 
@@ -143,19 +143,16 @@ export default [
       ],
     },
   },
-  ...fixupConfigRules(compat.extends("plugin:react-hooks/recommended")).map(
-    (config) => ({
-      ...config,
-      files: ["**/*.ts", "**/*.tsx"],
-      ignores: ["**/__tests__/**/*.*", "**/*.d.ts"],
-    })
-  ),
+  {
+    ...reactHooks.configs.flat.recommended,
+    files: ["src/react/**/*.ts", "src/react/**/*.tsx"],
+    ignores: ["**/__tests__/**/*.*", "**/*.d.ts"],
+  },
   {
     files: ["**/*.ts", "**/*.tsx"],
     ignores: ["**/__tests__/**/*.*", "**/*.d.ts"],
 
     plugins: {
-      "react-compiler": reactCompiler,
       ...tsPlugins,
     },
 
@@ -178,7 +175,6 @@ export default [
 
     // rules for source files, but no tests
     rules: {
-      "react-compiler/react-compiler": "error",
       "@typescript-eslint/consistent-type-exports": ["error"],
       "@typescript-eslint/no-import-type-side-effects": "error",
       "@typescript-eslint/no-restricted-types": [

package-lock.json

@@ -199,14 +199,13 @@
     "@typescript-eslint/types": "8.21.0",
     "@typescript-eslint/utils": "8.21.0",
     "ast-types": "0.16.1",
-    "babel-plugin-react-compiler": "19.1.0-rc.2",
+    "babel-plugin-react-compiler": "1.0.0",
     "eslint": "9.31.0",
     "eslint-import-resolver-typescript": "3.7.0",
     "eslint-plugin-import": "2.31.0",
     "eslint-plugin-local-rules": "3.0.2",
     "eslint-plugin-mdx": "^3.6.2",
-    "eslint-plugin-react-compiler": "19.1.0-rc.2",
-    "eslint-plugin-react-hooks": "5.1.0",
+    "eslint-plugin-react-hooks": "7.0.1",
     "eslint-plugin-testing-library": "7.1.1",
     "expect": "29.7.0",
     "expect-type": "1.1.0",

package.json

@@ -11,7 +11,7 @@ test("test is running against source or ESM (in CI) build", () => {
 
 test("test is running against uncompiled or compiled (in CI)", () => {
   if (isCI) {
-    expect(reactCompilerVersion).toMatchInlineSnapshot(`"19.1.0-rc.2"`);
+    expect(reactCompilerVersion).toMatchInlineSnapshot(`"1.0.0"`);
   } else {
     expect(reactCompilerVersion).toBe("uncompiled");
   }

src/react/hooks/__tests__/bundle.test.tsx

@@ -7,8 +7,10 @@ export function useDeepMemo<TValue>(
   deps: DependencyList
 ) {
   const ref = React.useRef<{ deps: DependencyList; value: TValue }>(void 0);
+  // eslint-disable-next-line react-hooks/refs
   if (!ref.current || !equal(ref.current.deps, deps)) {
     ref.current = { value: memoFn(), deps };
   }
+  // eslint-disable-next-line react-hooks/refs
   return ref.current.value;
 }

src/react/hooks/internal/useDeepMemo.ts

@@ -427,7 +427,6 @@ export function useBackgroundQuery<
   "use no memo";
   return wrapHook(
     "useBackgroundQuery",
-    // eslint-disable-next-line react-compiler/react-compiler
     useBackgroundQuery_,
     useApolloClient(typeof options === "object" ? options.client : undefined)
   )(query, options ?? ({} as any));

src/react/hooks/useBackgroundQuery.ts

@@ -182,7 +182,6 @@ export function useFragment<
   "use no memo";
   return wrapHook(
     "useFragment",
-    // eslint-disable-next-line react-compiler/react-compiler
     useFragment_,
     useApolloClient(options.client)
   )(options);

src/react/hooks/useFragment.ts

@@ -492,9 +492,11 @@ export function useLazyQuery<
       ...eagerMethods,
       ...result,
       client,
+      // eslint-disable-next-line react-hooks/refs
       previousData: previousDataRef.current,
       variables: observable.variables,
       observable,
+      // eslint-disable-next-line react-hooks/refs
       called: !!resultRef.current,
     };
   }, [client, observableResult, eagerMethods, observable]);

src/react/hooks/useLazyQuery.ts

@@ -392,7 +392,6 @@ export function useQuery<
   "use no memo";
   return wrapHook(
     "useQuery",
-    // eslint-disable-next-line react-compiler/react-compiler
     useQuery_,
     useApolloClient(typeof options === "object" ? options.client : undefined)
   )(query, options);
@@ -568,7 +567,6 @@ function useResult<TData, TVariables extends OperationVariables>(
               return;
             }
 
-            // eslint-disable-next-line react-compiler/react-compiler
             resultData.variables = observable.variables;
 
             if (previous.data && !equal(previous.data, result.data)) {

src/react/hooks/useQuery.ts

@@ -82,7 +82,6 @@ export function useQueryRefHandlers<
 
   return wrapHook(
     "useQueryRefHandlers",
-    // eslint-disable-next-line react-compiler/react-compiler
     useQueryRefHandlers_,
     clientOrObsQuery
   )(queryRef);