fix loading order in start page issue#396

bahnzumberg · Aug 19, 2024 · a8188ee · a8188ee
1 parent 5d3b162
commit a8188ee
Showing 1 changed file with 39 additions and 21 deletions.
diff --git a/src/views/Start/Header.js b/src/views/Start/Header.js
@@ -16,7 +16,6 @@ const LINEAR_GRADIENT =
 
 export default function Header({
   totalTours,
-  // getCity,
   allCities,
   showMobileMenu,
   setShowMobileMenu,
@@ -27,6 +26,7 @@ export default function Header({
 
   const [capCity, setCapCity] = useState(city);
   const [totalToursFromCity, setTotalToursFromCity] = React.useState(0);
+  const [loading, setLoading] = useState(false);
 
   let tld = "";
   let domain = window.location.hostname;
@@ -57,16 +57,20 @@ export default function Header({
   }
 
   useEffect(() => {
-    getCity();
-    if (!!city) {
+    let _city = getCity();
+    console.log("L62 _city :", _city)
+    if (!!_city) {
+      setLoading(true);
       getTotalCityTours(city).then((data) => {
         setTotalToursFromCity(data.tours_city);
+        if(!!data.tours_city && data.tours_city > 0) setLoading(false);
       });
     }
+
   }, [city]);
 
   useEffect(() => {
-    city = searchParams.get("city");
+    // city = searchParams.get("city");
     if (!!city && !!allCities && allCities.length > 0) {
       const cityObj = allCities.find((e) => e.value == city); // find the city object in array "allCities"
       if (!!cityObj) {
@@ -89,12 +93,9 @@ export default function Header({
   }, [_isMobile, tld]);
 
   const getCity = () => {
-    city = localStorage.getItem("city");
-    if (!!city) {
-      return city;
-    } else {
-      return "XXX";
-    }
+    let _city = searchParams.get("city") ? searchParams.get("city") : localStorage.getItem("city") ? localStorage.getItem("city") : null;
+
+    return _city;
   };
 
   if (totalTours === 0) {
@@ -140,17 +141,34 @@ export default function Header({
           <LanguageMenu />
         </Box>
         <Box className={"header-text"}>
-          <Typography variant={"h1"} height={"162px"}>
-            {!!totalToursFromCity && totalToursFromCity !== 0
-              ? totalToursFromCity.toLocaleString() +
-                " " +
-                t("start.tourenanzahl_untertitel_city", { capCity })
-              : !!totalTours &&
-                totalTours !== 0 &&
-                totalTours.toLocaleString() +
-                  " " +
-                  t("start.tourenanzahl_untertitel")}
-          </Typography>
+          <>
+          {console.log("L149 totalTours", totalTours)}
+          {console.log("L150 totalToursFromCity", totalToursFromCity)}
+          {
+            !loading && !!totalTours && (totalToursFromCity === 0 ) && (
+              <Typography variant={"h1"} height={"162px"}>
+                {!!totalTours &&
+                    totalTours !== 0 &&
+                    totalTours.toLocaleString() +
+                      " " +
+                    t("start.tourenanzahl_untertitel")}
+              </Typography>
+            )
+          }
+          {console.log("L159 totalToursFromCity", totalToursFromCity)}
+          {console.log("L160 loading", loading)}
+          {
+            !loading && !!totalToursFromCity && (
+              <Typography variant={"h1"} height={"162px"}>
+                {!!totalToursFromCity && totalToursFromCity !== 0
+                  && totalToursFromCity.toLocaleString() +
+                    " " +
+                    t("start.tourenanzahl_untertitel_city", { capCity })
+                }
+              </Typography>
+            )
+          }
+          </>
         </Box>
         {!!allCities && allCities.length > 0 && (
           <Box