Commit e86f6a9c
| SHA | e86f6a9cf0eb271abfc7cf53ec10ef372d52f0bd |
|---|---|
| Author | MohamedBassem <me at mbassem dot com> |
| Author Date | 2024-03-17 12:58 +0000 |
| Committer | MohamedBassem <me at mbassem dot com> |
| Commit Date | 2024-03-17 12:58 +0000 |
| Parent(s) | c2bd6d6b33dc (diff) |
| Tree | 222aaa1ae92e |
fix(mobile): Fix premature rendering of the app if the setting is not loaded
| File | + | - | Graph | |
|---|---|---|---|---|
| M | apps/mobile/app/signin.tsx | +2 | -2 |
|
| M | apps/mobile/lib/providers.tsx | +24 | -2 |
|
2 file(s) changed, 26 insertions(+), 4 deletions(-)
apps/mobile/app/signin.tsx
diff --git a/apps/mobile/app/signin.tsx b/apps/mobile/app/signin.tsx index da7e2fea..07ab8e08 100644 --- a/apps/mobile/app/signin.tsx +++ b/apps/mobile/app/signin.tsx @@ -74,8 +74,8 @@ export default function Signin() { value={settings.address} autoCapitalize="none" keyboardType="url" - onEndEditing={(e) => - setSettings({ ...settings, address: e.nativeEvent.text }) + onChangeText={(e) => + setSettings({ ...settings, address: e }) } /> </View>
apps/mobile/lib/providers.tsx
diff --git a/apps/mobile/lib/providers.tsx b/apps/mobile/lib/providers.tsx index 036e8ae2..38eaa99e 100644 --- a/apps/mobile/lib/providers.tsx +++ b/apps/mobile/lib/providers.tsx @@ -1,9 +1,11 @@ import { useEffect, useState } from "react"; +import FullPageSpinner from "@/components/ui/FullPageSpinner"; import { ToastProvider } from "@/components/ui/Toast"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { httpBatchLink } from "@trpc/client"; import superjson from "superjson"; +import type { Settings } from "./settings"; import useAppSettings, { getAppSettings } from "./settings"; import { api } from "./trpc"; @@ -26,8 +28,13 @@ function getTRPCClient(address: string) { }); } -export function Providers({ children }: { children: React.ReactNode }) { - const { settings } = useAppSettings(); +function TrpcProvider({ + children, + settings, +}: { + settings: Settings; + children: React.ReactNode; +}) { const [queryClient] = useState(() => new QueryClient()); const [trpcClient, setTrpcClient] = useState< @@ -50,3 +57,18 @@ export function Providers({ children }: { children: React.ReactNode }) { </api.Provider> ); } + +export function Providers({ children }: { children: React.ReactNode }) { + const { settings, isLoading } = useAppSettings(); + + if (isLoading) { + // Don't render anything if the settings still hasn't been loaded + return <FullPageSpinner />; + } + + return ( + <TrpcProvider settings={settings}> + <ToastProvider>{children}</ToastProvider> + </TrpcProvider> + ); +}