From ac8ef83fcf6edc812b910ea57f074ae4409d90b2 Mon Sep 17 00:00:00 2001
From: Abhinav <abhinavk.grd@gmail.com>
Date: Sat, 29 Jan 2022 08:59:47 +0530
Subject: [PATCH] fix first load loading

---
 src/pages/shared-albums/index.tsx | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/pages/shared-albums/index.tsx b/src/pages/shared-albums/index.tsx
index 3006165e8..e57db52da 100644
--- a/src/pages/shared-albums/index.tsx
+++ b/src/pages/shared-albums/index.tsx
@@ -32,7 +32,7 @@ export default function PublicCollectionGallery() {
     const token = useRef<string>(null);
     const collectionKey = useRef<string>(null);
     const url = useRef<string>(null);
-    const [publicFiles, setPublicFiles] = useState<EnteFile[]>(null);
+    const [publicFiles, setPublicFiles] = useState<EnteFile[]>([]);
     const [publicCollection, setPublicCollection] = useState<Collection>(null);
     const appContext = useContext(AppContext);
     const [abuseReportFormView, setAbuseReportFormView] = useState(false);
@@ -42,14 +42,23 @@ export default function PublicCollectionGallery() {
     const openReportForm = () => setAbuseReportFormView(true);
     const closeReportForm = () => setAbuseReportFormView(false);
     const loadingBar = useRef(null);
+    const [isLoadingBarRunning, setIsLoadingBarRunning] = useState(false);
 
     const openMessageDialog = () => setMessageDialogView(true);
     const closeMessageDialog = () => setMessageDialogView(false);
 
-    const startLoading = () => loadingBar.current?.continuousStart();
-    const finishLoading = () => loadingBar.current?.complete();
+    const startLoading = () => {
+        !isLoadingBarRunning && loadingBar.current?.continuousStart();
+        setIsLoadingBarRunning(true);
+    };
+    const finishLoading = () => {
+        loadingBar.current?.complete();
+        setIsLoadingBarRunning(false);
+    };
 
     useEffect(() => {
+        appContext.showNavBar(true);
+        setLoading(false);
         const currentURL = new URL(window.location.href);
         if (currentURL.pathname !== PAGES.ROOT) {
             router.push(
@@ -88,10 +97,8 @@ export default function PublicCollectionGallery() {
                     mergeMetadata(await getLocalPublicFiles(localCollection))
                 );
                 setPublicFiles(localPublicFiles);
-                setLoading(false);
             }
             syncWithRemote();
-            appContext.showNavBar(true);
         };
         main();
     }, []);
@@ -117,7 +124,6 @@ export default function PublicCollectionGallery() {
                 setPublicFiles(null);
             }
         } finally {
-            setLoading(false);
             finishLoading();
         }
     };
@@ -130,7 +136,7 @@ export default function PublicCollectionGallery() {
             </Container>
         );
     }
-    if (!publicFiles) {
+    if (!isLoadingBarRunning && !publicFiles) {
         return <Container>{constants.NOT_FOUND}</Container>;
     }
     return (