chore: refactor providers

jedwards1230 · Apr 18, 2024 · 64578ba · 64578ba
1 parent 2cac9e7
commit 64578ba
Show file tree

Hide file tree

Showing 9 changed files with 72 additions and 68 deletions.
diff --git a/client/bun.lockb b/client/bun.lockb
diff --git a/client/package.json b/client/package.json
@@ -64,7 +64,7 @@
 		"expo-web-browser": "~12.8.2",
 		"gpt4-tokenizer": "^1.3.0",
 		"nativewind": "^4.0.1",
-		"openai": "^4.37.0",
+		"openai": "^4.37.1",
 		"patch-package": "^8.0.0",
 		"react": "18.2.0",
 		"react-dom": "18.2.0",

diff --git a/client/src/app/(auth)/_layout.tsx b/client/src/app/(auth)/_layout.tsx
@@ -1,14 +1,15 @@
 import { useUserData } from "@/hooks/stores/useUserData";
-import { Redirect, Stack } from "expo-router";
+import { Redirect, Stack, useLocalSearchParams } from "expo-router";
 
 export default function AuthLayout() {
-	const session = useUserData((s) => s.session);
-	if (session) return <Redirect href="/(main)" />;
+	const params = useLocalSearchParams();
+	const session = useUserData.use.session();
+	if (session) return <Redirect href={{ pathname: "/(main)", params }} />;
 	return (
-		<Stack initialRouteName="index">
-			<Stack.Screen name="index" options={{ headerShown: false }} />
-			<Stack.Screen name="login" options={{ headerShown: false }} />
-			<Stack.Screen name="signup" options={{ headerShown: false }} />
+		<Stack screenOptions={{ headerShown: false }}>
+			<Stack.Screen name="index" />
+			<Stack.Screen name="login" />
+			<Stack.Screen name="signup" />
 		</Stack>
 	);
 }

diff --git a/client/src/app/(main)/_layout.tsx b/client/src/app/(main)/_layout.tsx
@@ -3,7 +3,7 @@ import { useUserData } from "@/hooks/stores/useUserData";
 import { Redirect } from "expo-router";
 
 export default function HomeLayout() {
-	const session = useUserData((s) => s.session);
+	const session = useUserData.use.session();
 	if (!session) return <Redirect href="/(auth)" />;
 	return <Drawer />;
 }

diff --git a/client/src/app/(main)/index.tsx b/client/src/app/(main)/index.tsx
@@ -1,4 +1,5 @@
 import { useGlobalSearchParams } from "expo-router";
+import Head from "expo-router/head";
 import { useEffect } from "react";
 
 import { ChatView } from "@/views/chat";
@@ -8,7 +9,14 @@ export default function Chat() {
 	const { c } = useGlobalSearchParams<{ c?: string }>();
 	const setThreadId = useConfigStore((s) => s.setThreadId);
 	useEffect(() => setThreadId(c || null), [c]);
-	return <ChatView threadId={c || null} />;
+	return (
+		<>
+			<Head>
+				<title>myChat{c ? ` | ${c}` : ""}</title>
+			</Head>
+			<ChatView threadId={c || null} />
+		</>
+	);
 }
 
 export { ErrorBoundary } from "expo-router";
diff --git a/client/src/app/_layout.tsx b/client/src/app/_layout.tsx
@@ -7,20 +7,12 @@ import { useFonts } from "expo-font";
 import { Stack } from "expo-router/stack";
 import * as SplashScreen from "expo-splash-screen";
 import { useEffect } from "react";
-import { GestureHandlerRootView } from "react-native-gesture-handler";
-
-import { AppStateProvider } from "@/providers/AppStateProvider";
-import NativeHapticsProvider from "@/providers/HapticsProvider";
-import { ThemeProvider } from "@/providers/ThemeProvider";
-import { QueryClientProvider } from "@/providers/QueryClientProvider";
-import { HotkeyProvider } from "@/providers/HotkeyProvider";
+import Head from "expo-router/head";
 
 import { PortalHost } from "@/components/primitives/portal";
-import { Platform } from "react-native";
+import { Providers } from "@/providers";
 
-export const unstable_settings = {
-	initialRouteName: "(main)",
-};
+export const unstable_settings = { initialRouteName: "(main)" };
 
 // Prevent the splash screen from auto-hiding before asset loading is complete.
 SplashScreen.preventAutoHideAsync();
@@ -42,55 +34,28 @@ export default function RootLayout() {
 	return loaded ? <RootProviders /> : null;
 }
 
-const PlatformProviders = Platform.select({
-	web: (props: { children: React.ReactNode }) => (
-		<HotkeyProvider>{props.children}</HotkeyProvider>
-	),
-	default: (props: { children: React.ReactNode }) => (
-		<GestureHandlerRootView className="flex-1">
-			<NativeHapticsProvider>{props.children}</NativeHapticsProvider>
-		</GestureHandlerRootView>
-	),
-});
-
 function RootProviders() {
 	return (
-		<ThemeProvider>
-			<QueryClientProvider>
-				<PlatformProviders>
-					<AppStateProvider>
-						<Stack
-							initialRouteName="(main)"
-							screenOptions={{
-								headerShown: false,
-								contentStyle: { backgroundColor: "#fff" },
-							}}
-						>
-							<Stack.Screen name="(auth)" />
-							<Stack.Screen name="(main)" />
-							<Stack.Screen
-								name="file/[id]"
-								options={{ presentation: "modal" }}
-							/>
-							<Stack.Screen
-								name="agent/index"
-								options={{ presentation: "modal" }}
-							/>
-							<Stack.Screen
-								name="agent/[id]"
-								options={{ presentation: "modal" }}
-							/>
-							<Stack.Screen name="agent/create/index" />
-							<Stack.Screen
-								name="settings"
-								options={{ presentation: "modal" }}
-							/>
-						</Stack>
-					</AppStateProvider>
-					<PortalHost />
-				</PlatformProviders>
-			</QueryClientProvider>
-		</ThemeProvider>
+		<Providers>
+			<Head>
+				<title>myChat</title>
+			</Head>
+			<Stack
+				screenOptions={{
+					headerShown: false,
+					contentStyle: { backgroundColor: "#fff" },
+				}}
+			>
+				<Stack.Screen name="(main)" />
+				<Stack.Screen name="(auth)" />
+				<Stack.Screen name="file/[id]" options={{ presentation: "modal" }} />
+				<Stack.Screen name="agent/index" options={{ presentation: "modal" }} />
+				<Stack.Screen name="agent/[id]" options={{ presentation: "modal" }} />
+				<Stack.Screen name="agent/create/index" />
+				<Stack.Screen name="settings" options={{ presentation: "modal" }} />
+			</Stack>
+			<PortalHost />
+		</Providers>
 	);
 }
 

diff --git a/client/src/providers/PlatformProviders.tsx b/client/src/providers/PlatformProviders.tsx
@@ -0,0 +1,11 @@
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+
+import NativeHapticsProvider from "@/providers/HapticsProvider";
+
+export function PlatformProviders(props: { children: React.ReactNode }) {
+	return (
+		<GestureHandlerRootView className="flex-1">
+			<NativeHapticsProvider>{props.children}</NativeHapticsProvider>
+		</GestureHandlerRootView>
+	);
+}
diff --git a/client/src/providers/PlatformProviders.web.tsx b/client/src/providers/PlatformProviders.web.tsx
@@ -0,0 +1,5 @@
+import { HotkeyProvider } from "@/providers/HotkeyProvider";
+
+export function PlatformProviders(props: { children: React.ReactNode }) {
+	return <HotkeyProvider>{props.children}</HotkeyProvider>;
+}
diff --git a/client/src/providers/index.tsx b/client/src/providers/index.tsx
@@ -0,0 +1,14 @@
+import { AppStateProvider } from "@/providers/AppStateProvider";
+import { ThemeProvider } from "@/providers/ThemeProvider";
+import { QueryClientProvider } from "@/providers/QueryClientProvider";
+import { PlatformProviders } from "./PlatformProviders";
+
+export const Providers = (props: { children: React.ReactNode }) => (
+	<ThemeProvider>
+		<QueryClientProvider>
+			<PlatformProviders>
+				<AppStateProvider>{props.children}</AppStateProvider>
+			</PlatformProviders>
+		</QueryClientProvider>
+	</ThemeProvider>
+);