fix typecheck React 18

Author: mdjastrzebski

.github/actions/setup-deps-react-18/action.yml

@@ -0,0 +1,32 @@
+name: Setup deps (React 18)
+description: Setup Node.js and install dependencies
+
+runs:
+  using: composite
+  steps:
+    - name: Setup Node.js
+      uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
+      with:
+        node-version-file: .nvmrc
+
+    - name: Cache deps
+      id: yarn-cache
+      uses: actions/cache@5a3ec84eff668545956fd18022155c47e93e2684 # v4.2.3
+      with:
+        path: |
+          ./node_modules
+          .yarn/install-state.gz
+        key: ${{ runner.os }}-yarn-${{ hashFiles('yarn.lock') }}-${{ hashFiles('**/package.json', '!node_modules/**') }}
+        restore-keys: |
+          ${{ runner.os }}-yarn-${{ hashFiles('yarn.lock') }}
+          ${{ runner.os }}-yarn-
+
+    - name: Install deps
+      if: steps.yarn-cache.outputs.cache-hit != 'true'
+      run: yarn install --immutable
+      shell: bash
+
+    - name: Switch to React 18
+      run: |
+        yarn add -D react@18.3.1 react-test-renderer@18.3.1 @types/react@18.3.1 @types/react-test-renderer@18.3.1 react-native@0.77.0 @react-native/babel-preset@0.77.0
+      shell: bash

.github/workflows/ci.yml

@@ -48,11 +48,7 @@ jobs:
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
 
       - name: Setup Node.js and deps
-        uses: ./.github/actions/setup-deps
-
-      - name: Switch to React 18
-        run: |
-          yarn add -D react@18.3.1 react-test-renderer@18.3.1 react-native@0.77.0 @react-native/babel-preset@0.77.0
+        uses: ./.github/actions/setup-deps-react-18
 
       - name: Typecheck
         run: yarn typecheck
@@ -83,11 +79,7 @@ jobs:
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
 
       - name: Setup Node.js and deps
-        uses: ./.github/actions/setup-deps
-
-      - name: Switch to React 18
-        run: |
-          yarn add -D react@18.3.1 react-test-renderer@18.3.1 react-native@0.77.0 @react-native/babel-preset@0.77.0
+        uses: ./.github/actions/setup-deps-react-18
 
       - name: Test
         run: yarn test:ci

src/__tests__/render-hook-async.test.tsx

@@ -13,6 +13,12 @@ afterEach(() => {
   console.error = originalConsoleError;
 });
 
+function useSuspendingHook(promise: Promise<string>) {
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore: React 18 does not have `use` hook
+  return React.use(promise);
+}
+
 test('renderHookAsync renders hook asynchronously', async () => {
   const { result } = await renderHookAsync(() => {
     const [state, setState] = React.useState(1);
@@ -124,10 +130,6 @@ test('handles multiple state updates in effects', async () => {
 });
 
 testGateReact19('handles hook with suspense', async () => {
-  function useSuspendingHook(promise: Promise<string>) {
-    return React.use(promise);
-  }
-
   let resolvePromise: (value: string) => void;
   const promise = new Promise<string>((resolve) => {
     resolvePromise = resolve;
@@ -169,10 +171,6 @@ testGateReact19('handles hook suspense with error boundary', async () => {
   // eslint-disable-next-line no-console
   console.error = excludeConsoleMessage(console.error, ERROR_MESSAGE);
 
-  function useSuspendingHook(promise: Promise<string>) {
-    return React.use(promise);
-  }
-
   let rejectPromise: (error: Error) => void;
   const promise = new Promise<string>((_resolve, reject) => {
     rejectPromise = reject;

src/__tests__/suspense-fake-timers.test.tsx

@@ -16,6 +16,8 @@ afterEach(() => {
 });
 
 function Suspending({ promise, testID }: { promise: Promise<unknown>; testID: string }) {
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore React 18 does not have `use` hook
   React.use(promise);
   return <View testID={testID} />;
 }

src/__tests__/suspense.test.tsx

@@ -14,6 +14,8 @@ afterEach(() => {
 });
 
 function Suspending({ promise, testID }: { promise: Promise<unknown>; testID: string }) {
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore React 18 does not have `use` hook
   React.use(promise);
   return <View testID={testID} />;
 }