side menu display bug fixed

src/components/MyTasks/MyOffersTable.jsx

@@ -50,9 +50,9 @@ export default function MyOffersTable({ className, MyActiveOffersList}) {
         // }
     };
 
-//    if ( !MyActiveOffersList || MyActiveOffersList?.result_list?.length == 0 ){
-//        return(''); // want blank or no appear when no items
-//    }
+   if ( !MyActiveOffersList || MyActiveOffersList?.result_list?.length == 0 ){
+       return(''); // want blank or no appear when no items
+   }
 
     return (
         <>
@@ -113,11 +113,9 @@ export default function MyOffersTable({ className, MyActiveOffersList}) {
                             </div>
                             <div className="slider-content">
                                 <SliderCom settings={settings} selector={sellSlider}>
-                                {   MyActiveOffersList.loading ?
-                                        <LoadingSpinner size={16} color='sky-blue' />
-                                    :
-                                    MyActiveOffersList?.data?.length > 0 ?
-                                        MyActiveOffersList.data.map((value, index) => (
+                                {
+                                    MyActiveOffersList && MyActiveOffersList?.result_list?.length > 0 &&
+                                    MyActiveOffersList?.result_list?.map((value, index) => (
                                             <div className="item" key={index}>
                                                 <div className="offer-slide-item flex flex-col justify-between items-center">
                                                     {/* title */}
@@ -155,23 +153,6 @@ export default function MyOffersTable({ className, MyActiveOffersList}) {
 
                                             </div>
                                         ))
-                                    :
-                                    MyActiveOffersList.status ?
-                                        (
-                                            <div className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
-                                                <div className="p-2">
-                                                    No Tasks!
-                                                </div>
-                                            </div>
-                                        )
-                                    :
-                                        (
-                                            <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>
-                                        )
                                 }
 
 

src/components/Partials/Layout.jsx

@@ -36,7 +36,7 @@ export default function Layout({ children }) {
   //---------------------------------------
   /* LET U DEAL WITH JOB LIST - we need to centralize this list  */
   const {jobListTable} = useSelector((state) => state.tableReload)
-  const [MyJobList, setMyJobList] = useState({loading: true, data:[]});
+  const [myJobList, setMyJobList] = useState({loading: true, data:[]});
   const api = new usersService();
 
   const getMyJobList = async () => {
@@ -75,6 +75,7 @@ export default function Layout({ children }) {
               logoutModalHandler={logoutModalHandler}
               sidebar={drawer}
               action={() => dispatch(drawerToggle())}
+              myJobList={myJobList}
             />
           </div>
           {MobileSideBar && (
@@ -92,6 +93,7 @@ export default function Layout({ children }) {
               logoutModalHandler={logoutModalHandler}
               sidebar={MobileSideBar}
               action={() => setMobileSidebar.toggle()}
+              myJobList={myJobList}
             />
           </div>
           {/* end sidebar */}

src/components/Partials/MobileSideBar.jsx

@@ -8,7 +8,7 @@ import {
 import DarkModeContext from "../Contexts/DarkModeContext";
 import Icons from "../Helpers/Icons";
 
-export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
+export default function MobileSidebar({ sidebar, action, logoutModalHandler, myJobList }) {
   let { userDetails } = useSelector((state) => state.userDetails);
   const darkMode = useContext(DarkModeContext);
 
@@ -180,7 +180,7 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
                   </div>
                 </div>
               </div>
-            ) : jobLists?.result_list?.length ? (
+            ) : myJobList?.data?.result_list?.length ? (
               <div className="setting-item">
                 <div className="heading mb-5">
                   <h1 className="title text-xl font-bold text-purple">
@@ -213,7 +213,7 @@ export default function MobileSidebar({ sidebar, action, logoutModalHandler }) {
                   </ul>
                 </div>
               </div>
-            ) : (
+            ) : !myJobList?.loading && (
               <div className="setting-item">
                 <div className="heading mb-5">
                   <h1 className="title text-xl font-bold text-purple">

src/components/Partials/Sidebar.jsx

@@ -8,7 +8,7 @@ import {
 import DarkModeContext from "../Contexts/DarkModeContext";
 import Icons from "../Helpers/Icons";
 
-export default function Sidebar({ sidebar, action, logoutModalHandler }) {
+export default function Sidebar({ sidebar, action, logoutModalHandler, myJobList }) {
   const darkMode = useContext(DarkModeContext);
 
   let { userDetails } = useSelector((state) => state.userDetails);
@@ -200,7 +200,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
                   </div>
                 </div>
               </div>
-            ) : jobLists?.result_list?.length ? (
+            ) : myJobList?.data?.result_list?.length ? (
               <>
                 <div className="setting-item">
                   <div className="heading mb-5">
@@ -239,7 +239,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
                   </div>
                 </div>
               </>
-            ) : (
+            ) : !myJobList?.loading && (
               <div className="setting-item">
                 <div className="heading mb-5">
                   <h1 className="title text-xl font-bold text-purple">

src/views/MyTaskPage.jsx

@@ -9,7 +9,7 @@ export default function MyTaskPage() {
     const {jobListTable} = useSelector((state) => state.tableReload)
 
     const [MyActiveJobList, setMyActiveJobList] = useState({loading: true, status:false, data:[]});
-    const [MyActiveOffersList, setMyActiveOffersList] = useState({loading: true, status:false, data:[]});
+    const [MyActiveOffersList, setMyActiveOffersList] = useState([]);
     const api = new usersService();
     const commonHeadData =()=>{
         console.log("COMMON HEAD DATA ----------------=====---------------------");
@@ -26,12 +26,12 @@ export default function MyTaskPage() {
         }
     };
     const getMyActiveOffersList = async () => {
-        setMyActiveOffersList({loading: true, status:false, data:[]});
+        // setMyActiveOffersList({loading: true, status:false, data:[]});
         try {
             const res = await api.getOffersList();
-            setMyActiveOffersList({loading: false, status:true, data:res.data.result_list});
+            setMyActiveOffersList(res.data);
         } catch (error) {
-            setMyActiveOffersList({loading: false, status:false, data:[]});
+            // setMyActiveOffersList({loading: false, status:false, data:[]});
             console.log("Error getting offers");
         }
     };