deps: Upgrade expo & nextjs to react 19 (#1565)

* Attempt to upgrade expo 53

* Attempt upgrade nextjs

* Fix a bunch of peer deps

* upgrade some docs deps

* fix typecheck

* update the shadcn calendar component

* more fixes

* more fixes

* revert ollama upgrade

* update react version to use carets

* remove react-select from landing

* fix the typescript error caused by customFetch

* upgrade the new grid user setting to nextjs 15

* mobile: enable react canary to support react 19.1

* upgrade react native menu

* fix navigation context error

2 files changed, 48 insertions, 43 deletions

diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index e1751f1e..ca3da0cb 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -32,42 +32,47 @@ export default function RootLayout() {
   }, [settings.theme]);
 
   return (
-    <GestureHandlerRootView style={{ flex: 1 }}>
-      <ShareIntentProvider>
-        <Providers>
-          <StyledStack
-            contentClassName={cn(
-              "w-full flex-1 bg-gray-100 text-foreground dark:bg-background",
-              colorScheme == "dark" ? "dark" : "light",
-            )}
-            screenOptions={{
-              headerTitle: "",
-              headerTransparent: true,
-            }}
-          >
-            <Stack.Screen name="index" />
-            <Stack.Screen
-              name="signin"
-              options={{
-                headerShown: true,
-                headerBackVisible: true,
-                headerBackTitle: "Back",
-                title: "",
-              }}
-            />
-            <Stack.Screen name="sharing" />
-            <Stack.Screen
-              name="test-connection"
-              options={{
-                title: "Test Connection",
-                headerShown: true,
-                presentation: "modal",
-              }}
-            />
-          </StyledStack>
-          <StatusBar style="auto" />
-        </Providers>
-      </ShareIntentProvider>
-    </GestureHandlerRootView>
+    <>
+      <StyledStack
+        layout={(props) => {
+          return (
+            <GestureHandlerRootView style={{ flex: 1 }}>
+              <ShareIntentProvider>
+                <Providers>{props.children}</Providers>
+              </ShareIntentProvider>
+            </GestureHandlerRootView>
+          );
+        }}
+        contentClassName={cn(
+          "w-full flex-1 bg-gray-100 text-foreground dark:bg-background",
+          colorScheme == "dark" ? "dark" : "light",
+        )}
+        screenOptions={{
+          headerTitle: "",
+          headerTransparent: true,
+        }}
+      >
+        <Stack.Screen name="index" />
+        <Stack.Screen
+          name="signin"
+          options={{
+            headerShown: true,
+            headerBackVisible: true,
+            headerBackTitle: "Back",
+            title: "",
+          }}
+        />
+        <Stack.Screen name="sharing" />
+        <Stack.Screen
+          name="test-connection"
+          options={{
+            title: "Test Connection",
+            headerShown: true,
+            presentation: "modal",
+          }}
+        />
+      </StyledStack>
+      <StatusBar style="auto" />
+    </>
   );
 }
diff --git a/apps/mobile/app/sharing.tsx b/apps/mobile/app/sharing.tsx
index 941b4c83..506b5100 100644
--- a/apps/mobile/app/sharing.tsx
+++ b/apps/mobile/app/sharing.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { ActivityIndicator, Pressable, Text, View } from "react-native";
 import { useRouter } from "expo-router";
 import { useShareIntentContext } from "expo-share-intent";
@@ -83,7 +83,7 @@ export default function Sharing() {
   const router = useRouter();
   const [mode, setMode] = useState<Mode>({ type: "idle" });
 
-  let autoCloseTimeoutId: NodeJS.Timeout | null = null;
+  const autoCloseTimeoutId = useRef<number | null>(null);
 
   let comp;
   switch (mode.type) {
@@ -102,8 +102,8 @@ export default function Sharing() {
             label="Manage"
             onPress={() => {
               router.replace(`/dashboard/bookmarks/${mode.bookmarkId}/info`);
-              if (autoCloseTimeoutId) {
-                clearTimeout(autoCloseTimeoutId);
+              if (autoCloseTimeoutId.current) {
+                clearTimeout(autoCloseTimeoutId.current);
               }
             }}
           />
@@ -126,11 +126,11 @@ export default function Sharing() {
       return;
     }
 
-    autoCloseTimeoutId = setTimeout(() => {
+    autoCloseTimeoutId.current = setTimeout(() => {
       router.replace("dashboard");
     }, 2000);
 
-    return () => clearTimeout(autoCloseTimeoutId!);
+    return () => clearTimeout(autoCloseTimeoutId.current!);
   }, [mode.type]);
 
   return (