[example][apollo-client][react-navigation] fix type errors

.github/workflows/checks.yml

@@ -0,0 +1,31 @@
+name: Checks
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    types: [opened, synchronize]
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event_name }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  checks:
+    runs-on: ubuntu-latest
+    steps:
+      - name: 🏗 Setup repository
+        uses: actions/checkout@v4
+
+      - name: 🏗 Setup Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+
+      - name: 📦 Install dependencies
+        run: bun install --frozen-lockfile
+
+      - name: 🔍 Check apps
+        run: |
+          bun run lint:apps
+          bun run typecheck:apps

apps/example/package.json

@@ -8,7 +8,8 @@
     "ios": "expo run:ios",
     "web": "expo start --web",
     "lint": "expo lint",
-    "fix-deps": "expo install --check"
+    "fix-deps": "expo install --check",
+    "typecheck": "tsc --noEmit"
   },
   "dependencies": {
     "@apollo/client": "^3.11.10",

apps/example/src/app/_layout.tsx

@@ -1,7 +1,7 @@
 import { useReactNavigationDevTools } from '@dev-plugins/react-navigation';
 import FontAwesome from '@expo/vector-icons/FontAwesome';
 import { useFonts } from 'expo-font';
-import { SplashScreen, Stack , useNavigationContainerRef } from 'expo-router';
+import { SplashScreen, Stack, useNavigationContainerRef } from 'expo-router';
 import { useEffect } from 'react';
 import { StatusBar } from 'expo-status-bar';
 

apps/example/src/app/index.tsx

@@ -8,19 +8,19 @@ export default function TesterScreen() {
     <SafeAreaView style={styles.outerContainer}>
       <Stack.Screen options={{ headerShown: false }} />
       <View style={styles.container}>
-        <TestCase title="Apollo Client" route="/apollo-client/" />
-        <TestCase title="React Query" route="/react-query/" />
-        <TestCase title="React Query Time" route="/react-query-time/" />
-        <TestCase title="TinyBase" route="/tinybase/" />
-        <TestCase title="Vanilla Log Viewer" route="/vanilla-log-viewer/" />
-        <TestCase title="Async Storage" route="/async-storage/" />
-        <TestCase title="React Native MMKV" route="/react-native-mmkv/" />
+        <TestCase title="Apollo Client" route="/apollo-client" />
+        <TestCase title="React Query" route="/react-query" />
+        <TestCase title="React Query Time" route="/react-query-time" />
+        <TestCase title="TinyBase" route="/tinybase" />
+        <TestCase title="Vanilla Log Viewer" route="/vanilla-log-viewer" />
+        <TestCase title="Async Storage" route="/async-storage" />
+        <TestCase title="React Native MMKV" route="/react-native-mmkv" />
       </View>
     </SafeAreaView>
   );
 }
 
-function TestCase<T>({ title, route }: { title: string; route: LinkProps<T>['href'] }) {
+function TestCase({ title, route }: { title: string; route: LinkProps['href'] }) {
   return (
     <Link href={route} asChild>
       <Pressable style={styles.testCaseContainer}>

bun.lock

@@ -65,6 +65,7 @@
         "expo": "53.0.7",
         "expo-module-scripts": "^4.1.7",
         "graphql": "^16.9.0",
+        "react-dom": "19.1.0",
         "typescript": "~5.8.3",
       },
       "peerDependencies": {

package.json

@@ -3,6 +3,8 @@
   "version": "1.0.0",
   "private": true,
   "scripts": {
+    "lint:apps": "bun run --filter './apps/**' lint",
+    "typecheck:apps": "bun run --filter './apps/**' typecheck",
     "postinstall": "./scripts/prepare-packages.js"
   },
   "workspaces": [

packages/apollo-client/package.json

@@ -41,6 +41,7 @@
     "expo": "53.0.7",
     "expo-module-scripts": "^4.1.7",
     "graphql": "^16.9.0",
+    "react-dom": "19.1.0",
     "typescript": "~5.8.3"
   },
   "peerDependencies": {

packages/react-navigation/src/useReactNavigationDevTools.ts

@@ -5,13 +5,16 @@ import { useEffect, useRef } from 'react';
 
 import { ReduxExtensionAdapter } from './ReduxExtensionAdapter';
 
-export function useReactNavigationDevTools(ref: React.RefObject<NavigationContainerRef<any>>) {
+export function useReactNavigationDevTools(
+  ref: React.RefObject<NavigationContainerRef<any> | null>
+) {
   const client = useDevToolsPluginClient('react-navigation');
   const adapterRef = useRef(new ReduxExtensionAdapter());
   // @ts-ignore: Override global
   globalThis.__REDUX_DEVTOOLS_EXTENSION__ = {
     connect: () => adapterRef.current,
   };
+  // @ts-ignore: useReduxDevToolsExtension does not accept null ref from NavigationContainerRefWithCurrent
   useReduxDevToolsExtension(ref);
 
   useEffect(() => {