made active task to display if no offer

src/components/Home/FullAccountDash.jsx

@@ -9,6 +9,8 @@ import { useSelector } from "react-redux";
 //import UpdateTable from "./UpdateTable";
 import HomeActivities from "./HomeActivities";
 import MyOffersTable from "../MyTasks/MyOffersTable";
+import MyJobTable from "../MyTasks/MyJobTable";
+import LoadingSpinner from "../Spinners/LoadingSpinner";
 
 export default function FullAccountDash(props) {
   console.log("PROPS IN HOME->", props);
@@ -24,16 +26,31 @@ export default function FullAccountDash(props) {
           bannerList={props.bannerList}
           nextDueTask={props.nextDueTask}
         />
-        {props.offersList?.data?.result_list?.length ?
+        { props.offersList?.data?.result_list?.length ?
           <MyOffersTable
             MyActiveOffersList={props.offersList?.data}
             className="mb-10"
           />
-        : !props.offersList?.loading ?
+        : props.MyActiveJobList?.data?.length ?
+          <>
+            <div className="w-full mb-5 flex justify-between items-center gap-1">
+              <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+                <span>
+                  My Tasks
+                </span>
+              </h1>
+            </div>
+            <MyJobTable ActiveJobList={props.MyActiveJobList} Account={userDetails} />
+          </>
+         
+        : !props.offersList?.loading && !props.MyActiveJobList?.loading?
           <HomeActivities className="mb-10" />
         :
-        null
+          <div className="w-full h-[220px] flex items-center justify-center">
+            <LoadingSpinner size="16" color="sky-blue" />
+          </div>
         }
+        
         {/*<UpdateTable className="mb-10"/>*/}
         {/*<SellHistoryMarketVisitorAnalytic className="mb-10"/>*/}
         {/*<TopSellerTopBuyerSliderSection className="mb-10" />*/}

src/components/Home/index.jsx

@@ -16,19 +16,21 @@ export default function Home(props) {
 
   const { userDetails } = useSelector((state) => state?.userDetails);
 
-  const [MyActiveJobList, setMyActiveJobList] = useState([]); // STATE TO HOLD ACTIVE/CURRENT TASKS
+  const [MyActiveJobList, setMyActiveJobList] = useState({loading:true, data:[]}); // STATE TO HOLD ACTIVE/CURRENT TASKS
+  // const [MyActiveJobList, setMyActiveJobList] = useState([]); // STATE TO HOLD ACTIVE/CURRENT TASKS
 
   const getMyActiveJobList = async () => { // FUNCTION TO POPULATE ACTIVE/CURRENT TASK LIST
     try {
       const res = await userApi.getMyActiveTaskList();
-      setMyActiveJobList(res?.data?.result_list);
+      setMyActiveJobList({loading:false, data:res?.data?.result_list});
+      // setMyActiveJobList(res?.data?.result_list);
     } catch (error) {
-      setMyActiveJobList([]);
+      setMyActiveJobList({loading:false, data:[]});
+      // setMyActiveJobList([]);
       console.log("Error getting tasks");
     }
   };
 
-
   // FUNCTION TO GET DASH DATA TO DETERMINE CURRENT TASK DUE TIME
   const getHomeDate = () => {
     userApi
@@ -65,7 +67,7 @@ export default function Home(props) {
   useEffect(() => {
     getMyActiveJobList();
   }, []);
-
+console.log('MyActiveJobList',MyActiveJobList)
   return (
     <Layout>
       <div className="home-page-wrapper">
@@ -74,13 +76,14 @@ export default function Home(props) {
             account={userDetails}
             commonHeadData={props.bannerList}
             familyOffers={MyOffersList?.data?.result_list}
-            MyActiveJobList={MyActiveJobList}
+            MyActiveJobList={MyActiveJobList?.data}
           />
         ) : userDetails && userDetails?.account_type == "FULL" ? (
           <FullAccountDash
             nextDueTask={nextDueTask}
             bannerList={props.bannerList}
             offersList={MyOffersList}
+            MyActiveJobList={MyActiveJobList}
           />
         ) : (
           <div>

src/components/MyTasks/MyJobTable.jsx

@@ -55,15 +55,14 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
       {!ActiveJobList?.data.length && accountType && (
         <div className="absolute inset-0 bg-black opacity-30"></div>
       )}
-      {ActiveJobList?.data.length > 0 && ActiveJobList.loading && (
+      {ActiveJobList.loading ? 
         <div className="w-full h-[520px] flex items-center justify-center">
           <LoadingSpinner size="16" color="sky-blue" />
         </div>
-      )}
-
+      :
       <div className="relative w-full sm:rounded-lg">
         <div className="h-auto w-full">
-          {ActiveJobList?.data?.length > 0 &&
+          {ActiveJobList?.data?.length > 0 ?
             currentTask?.map((task, idx) => {
               // find due date
               const dueDate = task?.delivery_date.split(" ")[0];
@@ -136,9 +135,8 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
                   </div>
                 </div>
               );
-            })}
-
-          {ActiveJobList?.data?.length <= 0 && (
+            })
+          :
             <div
               className={`flex flex-col ${
                 accountType ? "items-center" : "items-end"
@@ -175,12 +173,12 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
                 </button>
               </div>
             </div>
-          )}
-          {ActiveJobList?.internal_return < 0 && (
+          }
+          {/* {ActiveJobList?.internal_return < 0 && (
             <div className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
               <p className="p-2">Error Occurred! Unable to display Tasks!</p>
             </div>
-          )}
+          )} */}
         </div>
 
         {/* PAGINATION BUTTON */}
@@ -199,6 +197,7 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
         />
         {/* END OF PAGINATION BUTTON */}
       </div>
+      }
     </div>
   );
 }