fw-5179, fix refresh error (#185)

* Move NavBar home buttons into loading container * Ensure siteLoading is false until siteStore is ready
First-Peoples-Cultural-Council · Nov 7, 2023 · 60c3bd6 · 60c3bd6
1 parent 51452a5
commit 60c3bd6
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 26 deletions.
diff --git a/src/components/NavBar/NavBarPresentation.js b/src/components/NavBar/NavBarPresentation.js
@@ -37,31 +37,31 @@ function NavBarPresentation({
     <nav id="NavBar" className="relative z-10" role="navigation">
       <div className="bg-fv-charcoal max-w-screen-2xl mx-auto px-2 lg:px-6 xl:px-16">
         <div className="h-16 flex justify-between items-center py-1 space-x-2 lg:space-x-4">
-          {/* Home Links */}
-          <div className="flex items-center">
-            <div
-              className={`${
-                isHome ? '' : 'hidden'
-              } md:flex items-center text-white`}
-            >
-              <span className="sr-only">FirstVoices Logo</span>
-              <Link to="/">{fvlogo}</Link>
-            </div>
-            <div className="w-16 text-white text-sm leading-tight text-center mr-2">
-              Beta Version
-            </div>
-            {!isHome && (
-              <Link
-                className="h-9 text-white flex items-center group bg-fv-charcoal rounded-lg text-lg font-medium hover:text-gray-100"
-                to={`/${site?.sitename}/`}
-              >
-                <span className="sr-only">{site?.title}</span>
-                {getIcon('Home', 'fill-current h-full w-auto')}
-              </Link>
-            )}
-          </div>
           {!siteLoading && (
             <>
+              {/* Home Links */}
+              <div className="flex items-center">
+                <div
+                  className={`${
+                    isHome ? '' : 'hidden'
+                  } md:flex items-center text-white`}
+                >
+                  <span className="sr-only">FirstVoices Logo</span>
+                  <Link to="/">{fvlogo}</Link>
+                </div>
+                <div className="w-16 text-white text-sm leading-tight text-center mr-2">
+                  Beta Version
+                </div>
+                {!isHome && (
+                  <Link
+                    className="h-9 text-white flex items-center group bg-fv-charcoal rounded-lg text-lg font-medium hover:text-gray-100"
+                    to={`/${site?.sitename}/`}
+                  >
+                    <span className="sr-only">{site?.title}</span>
+                    {getIcon('Home', 'fill-current h-full w-auto')}
+                  </Link>
+                )}
+              </div>
               {/* Menus */}
               <div id="NavMenus" className="hidden lg:flex xl:space-x-6 ">
                 {menuData?.dictionary && generateMenu(menuData?.dictionary)}

diff --git a/src/components/Site/SiteData.js b/src/components/Site/SiteData.js
@@ -5,7 +5,7 @@ import i18next from 'i18next'
 // FPCC
 import { useImmersion } from 'common/dataHooks/useImmersion'
 import { useSite } from 'common/dataHooks/useSites'
-import { useSiteDispatch } from 'context/SiteContext'
+import { useSiteDispatch, useSiteStore } from 'context/SiteContext'
 
 function SiteData() {
   const navigate = useNavigate()
@@ -15,7 +15,8 @@ function SiteData() {
   // --------------------------------
   // Get Language Site data
   // --------------------------------
-  const { isLoading, error, data } = useSite()
+  const { isLoading, error, data } = useSite() // site data request, to put in the site store
+  const { site } = useSiteStore() // site store, to validate when it is ready for use
 
   useEffect(() => {
     if (isLoading === false && error === null) {
@@ -61,7 +62,7 @@ function SiteData() {
   }, [immersionIsLoading, immersionError, immersionData])
 
   return {
-    siteLoading: isLoading || data?.id?.length < 1,
+    siteLoading: isLoading || site?.id?.length < 1,
   }
 }