home banner reload mechanism added

src/components/Home/index.jsx

@@ -2,49 +2,53 @@ import React, { useState, useEffect } from "react";
 import datas from "../../data/product_data.json";
 import Layout from "../Partials/Layout";
 import usersService from "../../services/UsersService";
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
 import FamilyDash from "./FamilyDash";
 import FullAccountDash from "./FullAccountDash";
 import LoadingSpinner from '../../components/Spinners/LoadingSpinner'
+import { tableReload } from '../../store/TableReloads';
 
 export default function Home(props) {
- // console.log("PROPS IN HOME->", props);
- // const userApi = new usersService();
+
+  const dispatch = useDispatch()
+
   const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
   const { userDetails } = useSelector((state) => state?.userDetails);
 
+  useEffect(()=>{
+    if(!commonHeadBanner.loading && (!commonHeadBanner?.data || Object.keys(commonHeadBanner?.data).length < 1)){
+      dispatch(tableReload({ type: "HOMEBANNERS" })); // reloads home banner in case it fails to load or encounters error while loading
+    }
+  },[])
+
   return (
     <Layout>
-        <div className="w-full">
-          {userDetails && userDetails?.account_type == "FAMILY" ? (
-            <FamilyDash
-              account={userDetails}
-              commonHeadData={props.bannerList}
-              // familyOffers={MyOffersList?.data}
-              serverImg = {userDetails?.session_image_server}
-              // MyActiveJobList={MyActiveJobList?.data}
-            />
-          ) : userDetails && userDetails?.account_type == "FULL" ? (
-            <>
-              {Object.keys(commonHeadBanner).length < 1 ?
-              <LoadingSpinner height='h-48' size='16' />
-              :
-              <FullAccountDash
-                bannerList={props.bannerList}
-                dashTypes={props.dashTypes}
-                // offersList={MyOffersList}
-                // MyActiveJobList={MyActiveJobList}
-                offersList={props.offersList}
-                imageServer={props.imageServer}
-              />
-              }
-            </>
-          ) : (
-            <div>
-              You are not logged in or your account type is not supported.
-            </div>
-          )}
-        </div>
+      <div className="w-full">
+        {commonHeadBanner.loading ?
+        <LoadingSpinner height='h-48' size='16' />
+        :
+        <>
+        {userDetails && userDetails?.account_type == "FAMILY" ? (
+          <FamilyDash
+            account={userDetails}
+            commonHeadData={commonHeadBanner?.data?.result_list}
+            serverImg = {userDetails?.session_image_server}
+          />
+        ) : userDetails && userDetails?.account_type == "FULL" ? (
+          <FullAccountDash
+            bannerList={commonHeadBanner?.data?.result_list}
+            dashTypes={commonHeadBanner?.data?.home_dash_type}
+            offersList={commonHeadBanner?.data?.offers_list}
+            imageServer={commonHeadBanner?.data?.session_image_server}
+          />
+        ) : (
+          <div>
+            You are not logged in or your account type is not supported.
+          </div>
+        )}
+        </>
+        }
+      </div>
     </Layout>
   );
 }