pkg: Update react (#3030)

* pkg: Update react

* fix: act compatibility

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Nathaniel Tucker <me@ntucker.me>

.changeset/light-needles-visit.md

@@ -0,0 +1,5 @@
+---
+"@data-client/test": patch
+---
+
+Use @testing-library/react-hooks act as it is fully compatible with 17,18,19 of React

examples/github-app/package.json

@@ -40,7 +40,7 @@
     "@types/uuid": "^9.0.0",
     "@typescript-eslint/eslint-plugin": "7.7.1",
     "@typescript-eslint/parser": "7.7.1",
-    "react-refresh": "0.14.1",
+    "react-refresh": "0.14.2",
     "serve": "14.2.3",
     "webpack": "5.91.0",
     "webpack-cli": "5.1.4",
@@ -56,8 +56,8 @@
     "@js-temporal/polyfill": "^0.4.4",
     "antd": "5.16.4",
     "parse-link-header": "^2.0.0",
-    "react": "18.3.0",
-    "react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-error-boundary": "^4.0.0",
     "react-markdown": "9.0.1",
     "rehype-highlight": "7.0.0",

examples/nextjs/package.json

@@ -20,8 +20,8 @@
     "@types/react-dom": "18.3.0",
     "classnames": "^2.3.2",
     "next": "14.2.3",
-    "react": "18.3.0",
-    "react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "redux": "^5.0.0",
     "typescript": "^5.1.6",
     "uuid": "^9.0.1"

examples/todo-app/package.json

@@ -35,7 +35,7 @@
     "@linaria/shaker": "5.0.3",
     "@types/react-dom": "18.3.0",
     "@types/uuid": "^9.0.0",
-    "react-refresh": "0.14.1",
+    "react-refresh": "0.14.2",
     "webpack": "5.91.0",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "5.0.4"
@@ -44,8 +44,8 @@
     "@data-client/endpoint": "^0.11.0",
     "@data-client/react": "^0.11.0",
     "@data-client/rest": "^0.11.0",
-    "react": "18.3.0",
-    "react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "uuid": "^9.0.0"
   },
   "packageManager": "yarn@4.1.1"

package.json

@@ -92,12 +92,12 @@
     "node-fetch": "^3.3.0",
     "npm-run-all": "^4.1.5",
     "prettier": "3.2.5",
-    "react": "18.3.0",
-    "react-dom": "18.3.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-native": "0.74.0",
     "react-native-safe-area-context": "^4.4.1",
     "react-native-screens": "^3.18.2",
-    "react-test-renderer": "18.3.0",
+    "react-test-renderer": "18.3.1",
     "redux": "5.0.1",
     "rimraf": "^5.0.0",
     "rollup": "2.79.1",

packages/react/src/hooks/__tests__/useController/fetch.tsx

@@ -1,13 +1,16 @@
 import { ResolveType } from '@data-client/core';
 import { CacheProvider } from '@data-client/react';
 import { CacheProvider as ExternalCacheProvider } from '@data-client/redux';
-import { act } from '@testing-library/react-hooks';
 import { CoolerArticle, FutureArticleResource } from '__tests__/new';
 import nock from 'nock';
 
 import { useCache, useSuspense } from '../..';
 // relative imports to avoid circular dependency in tsconfig references
-import { makeRenderDataClient, FixtureEndpoint } from '../../../../../test';
+import {
+  makeRenderDataClient,
+  FixtureEndpoint,
+  act,
+} from '../../../../../test';
 import useController from '../../useController';
 
 export const payload = {

packages/react/src/hooks/__tests__/useController/reset.tsx

@@ -1,9 +1,9 @@
 import { CacheProvider } from '@data-client/react';
 import { makeRenderDataClient } from '@data-client/test';
+import { act } from '@data-client/test';
 import { FixtureEndpoint } from '@data-client/test/mockState';
 import { waitFor } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
-import { act } from '@testing-library/react-hooks';
 import { CoolerArticleDetail, FutureArticleResource } from '__tests__/new';
 import nock from 'nock';
 import { useEffect } from 'react';

packages/react/src/hooks/__tests__/useSuspense.web.tsx

@@ -16,7 +16,7 @@ import {
 import { normalize } from '@data-client/normalizr';
 import { jest } from '@jest/globals';
 import { Temporal } from '@js-temporal/polyfill';
-import { render, act } from '@testing-library/react';
+import { render } from '@testing-library/react';
 import {
   CoolerArticleResource,
   InvalidIfStaleArticleResource,
@@ -44,7 +44,7 @@ import {
   ControllerContext,
   StateContext,
 } from '../..';
-import { makeRenderDataClient, mockInitialState } from '../../../../test';
+import { makeRenderDataClient, mockInitialState, act } from '../../../../test';
 import { articlesPages, payload, users, nested } from '../test-fixtures';
 import useSuspense from '../useSuspense';
 

packages/test/src/makeRenderDataClient/renderHook.cts

@@ -6,9 +6,8 @@ import type {
   Queries,
   waitForOptions,
   RenderHookOptions,
+  act as ActType,
 } from '@testing-library/react';
-import React from 'react';
-import type { act as reactAct } from 'react-dom/test-utils';
 
 import { USE18 } from './use18.cjs';
 
@@ -18,13 +17,10 @@ export const renderHook: RenderHook =
   : (require('@testing-library/react-hooks').renderHook as any);
 export default renderHook;
 
-type ActType =
-  typeof reactAct extends undefined ? (callback: () => void) => void
-  : typeof reactAct;
-
-export const act: ActType =
-  Object.hasOwn(React, 'act') ? (React as any).act
-  : USE18 ? (require('./render18HookWrapped.js').act as any)
+// this is for react native + react web compatibility, not actually 18 compatibility
+export const act: typeof ActType =
+  USE18 ?
+    require('./render18HookWrapped.js').act
   : (require('@testing-library/react-hooks').act as any);
 
 export type { RenderHookOptions } from '@testing-library/react';