From 2cd2f92e9e0c82eaa5f21fe0c30e20ebea7aba24 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Fri, 22 Mar 2024 15:10:24 +0000
Subject: fix(mobile): Fix setting propagatin

---
 apps/mobile/app/dashboard/(tabs)/settings.tsx | 22 +++++-----------------
 apps/mobile/app/dashboard/_layout.tsx         | 12 ++++++++++++
 apps/mobile/app/index.tsx                     | 19 ++++++++-----------
 apps/mobile/app/signin.tsx                    | 15 +++++----------
 4 files changed, 30 insertions(+), 38 deletions(-)

(limited to 'apps/mobile/app')

diff --git a/apps/mobile/app/dashboard/(tabs)/settings.tsx b/apps/mobile/app/dashboard/(tabs)/settings.tsx
index fe138f52..f60c2495 100644
--- a/apps/mobile/app/dashboard/(tabs)/settings.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/settings.tsx
@@ -1,29 +1,17 @@
-import { useEffect } from "react";
 import { SafeAreaView, Text, View } from "react-native";
-import { useRouter } from "expo-router";
 import { Button } from "@/components/ui/Button";
+import PageTitle from "@/components/ui/PageTitle";
 import { useSession } from "@/lib/session";
 import { api } from "@/lib/trpc";
-import PageTitle from "@/components/ui/PageTitle";
 
 export default function Dashboard() {
-  const router = useRouter();
-
-  const { isLoggedIn, logout } = useSession();
-
-  useEffect(() => {
-    if (isLoggedIn !== undefined && !isLoggedIn) {
-      router.replace("signin");
-    }
-  }, [isLoggedIn]);
+  const { logout } = useSession();
 
   const { data, error, isLoading } = api.users.whoami.useQuery();
 
-  useEffect(() => {
-    if (error?.data?.code === "UNAUTHORIZED") {
-      logout();
-    }
-  }, [error]);
+  if (error?.data?.code === "UNAUTHORIZED") {
+    logout();
+  }
 
   return (
     <SafeAreaView>
diff --git a/apps/mobile/app/dashboard/_layout.tsx b/apps/mobile/app/dashboard/_layout.tsx
index bb14a203..ef04fcd1 100644
--- a/apps/mobile/app/dashboard/_layout.tsx
+++ b/apps/mobile/app/dashboard/_layout.tsx
@@ -1,6 +1,18 @@
+import { useIsLoggedIn } from "@/lib/session";
+import { useRouter } from "expo-router";
 import { Stack } from "expo-router/stack";
+import { useEffect } from "react";
 
 export default function Dashboard() {
+  const router = useRouter();
+
+  const isLoggedIn = useIsLoggedIn();
+  useEffect(() => {
+    if (isLoggedIn !== undefined && !isLoggedIn) {
+      return router.replace("signin");
+    }
+  }, [isLoggedIn]);
+
   return (
     <Stack>
       <Stack.Screen
diff --git a/apps/mobile/app/index.tsx b/apps/mobile/app/index.tsx
index f075fd6d..235b19e4 100644
--- a/apps/mobile/app/index.tsx
+++ b/apps/mobile/app/index.tsx
@@ -1,19 +1,16 @@
-import { useEffect } from "react";
-import { View } from "react-native";
-import { useRouter } from "expo-router";
-import { useSession } from "@/lib/session";
+import { useIsLoggedIn } from "@/lib/session";
+import { Redirect } from "expo-router";
+import FullPageSpinner from "@/components/ui/FullPageSpinner";
 
 export default function App() {
-  const router = useRouter();
-  const { isLoggedIn } = useSession();
-  useEffect(() => {
+  const isLoggedIn = useIsLoggedIn();
+
     if (isLoggedIn === undefined) {
       // Wait until it's loaded
+      return <FullPageSpinner />;
     } else if (isLoggedIn) {
-      router.replace("dashboard");
+      return <Redirect href="dashboard" />
     } else {
-      router.replace("signin");
+      return <Redirect href="signin" />
     }
-  }, [isLoggedIn]);
-  return <View />;
 }
diff --git a/apps/mobile/app/signin.tsx b/apps/mobile/app/signin.tsx
index 07ab8e08..ceb4c8d1 100644
--- a/apps/mobile/app/signin.tsx
+++ b/apps/mobile/app/signin.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import {
   Keyboard,
   KeyboardAvoidingView,
@@ -7,7 +7,7 @@ import {
   TouchableWithoutFeedback,
   View,
 } from "react-native";
-import { useRouter } from "expo-router";
+import { Redirect } from "expo-router";
 import Logo from "@/components/Logo";
 import { Button } from "@/components/ui/Button";
 import { Input } from "@/components/ui/Input";
@@ -15,8 +15,6 @@ import useAppSettings from "@/lib/settings";
 import { api } from "@/lib/trpc";
 
 export default function Signin() {
-  const router = useRouter();
-
   const { settings, setSettings } = useAppSettings();
 
   const [error, setError] = useState<string | undefined>();
@@ -24,7 +22,6 @@ export default function Signin() {
   const { mutate: login, isPending } = api.apiKeys.exchange.useMutation({
     onSuccess: (resp) => {
       setSettings({ ...settings, apiKey: resp.key });
-      router.replace("dashboard");
     },
     onError: (e) => {
       if (e.data?.code === "UNAUTHORIZED") {
@@ -43,11 +40,9 @@ export default function Signin() {
     password: "",
   });
 
-  useEffect(() => {
-    if (settings.apiKey) {
-      router.navigate("dashboard");
-    }
-  }, [settings]);
+  if (settings.apiKey) {
+    return <Redirect href="dashboard" />;
+  }
 
   const onSignin = () => {
     const randStr = (Math.random() + 1).toString(36).substring(5);
-- 
cgit v1.2.3-70-g09d2