fix: blank screen on offline support if user id is lazily set (#2003)

* fix: blank screen on offline support if user id is lazily set * chore: change the initial state value of initialisedDb
GetStream · Mar 13, 2023 · 2cc2d4a · 2cc2d4a
1 parent 36eb866
commit 2cc2d4a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 10 deletions.
diff --git a/package/src/components/Chat/Chat.tsx b/package/src/components/Chat/Chat.tsx
@@ -167,7 +167,7 @@ const ChatWithContext = <
     closeConnectionOnBackground,
   );
 
-  const [initialisingDatabase, setInitialisingDatabase] = useState(enableOfflineSupport);
+  const [initialisedDatabase, setInitialisedDatabase] = useState(false);
 
   /**
    * Setup muted user listener
@@ -194,20 +194,20 @@ const ChatWithContext = <
           data: client.user,
         });
     }
-  }, [client]);
+  }, [client, enableOfflineSupport]);
 
   const setActiveChannel = (newChannel?: Channel<StreamChatGenerics>) => setChannel(newChannel);
 
   useEffect(() => {
     if (client.user?.id && enableOfflineSupport) {
-      setInitialisingDatabase(true);
+      setInitialisedDatabase(false);
       QuickSqliteClient.initializeDatabase();
       DBSyncManager.init(client as unknown as StreamChat);
-      setInitialisingDatabase(false);
+      setInitialisedDatabase(true);
     }
   }, [client?.user?.id, enableOfflineSupport]);
 
-  const appSettings = useAppSettings(client, isOnline, enableOfflineSupport, initialisingDatabase);
+  const appSettings = useAppSettings(client, isOnline, enableOfflineSupport, initialisedDatabase);
 
   const chatContext = useCreateChatContext({
     appSettings,
@@ -226,7 +226,7 @@ const ChatWithContext = <
     enableOfflineSupport,
   });
 
-  if (loadingTranslators || initialisingDatabase) return null;
+  if (loadingTranslators) return null;
 
   return (
     <ChatProvider<StreamChatGenerics> value={chatContext}>

diff --git a/package/src/components/Chat/hooks/useAppSettings.ts b/package/src/components/Chat/hooks/useAppSettings.ts
@@ -10,17 +10,16 @@ export const useAppSettings = <
   client: StreamChat<StreamChatGenerics>,
   isOnline: boolean | null,
   enableOfflineSupport: boolean,
-  initialisingDatabase: boolean,
+  initialisedDatabase: boolean,
 ): AppSettingsAPIResponse | null => {
   const [appSettings, setAppSettings] = useState<AppSettingsAPIResponse | null>(null);
   const isMounted = useRef(true);
 
   useEffect(() => {
     async function enforeAppSettings() {
-      if (initialisingDatabase) return;
       if (!client.userID) return;
 
-      if (!isOnline && enableOfflineSupport) {
+      if (!isOnline && enableOfflineSupport && initialisedDatabase) {
         const appSettings = dbApi.getAppSettings({ currentUserId: client.userID });
         setAppSettings(appSettings);
         return;
@@ -48,7 +47,7 @@ export const useAppSettings = <
     return () => {
       isMounted.current = false;
     };
-  }, [client, isOnline, initialisingDatabase]);
+  }, [client, isOnline, initialisedDatabase]);
 
   return appSettings;
 };