From 5043540abb3f540e92cd6430a4c17827bea2fae1 Mon Sep 17 00:00:00 2001
From: Chief Bube <ebube.ojinta@chiefsoft.com>
Date: Tue, 7 Nov 2023 09:24:28 -0800
Subject: [PATCH] Added conditionals to the paths to avoid breakage and
 resolved some images in family account

---
 src/components/Cards/AvailableJobsCard.jsx    | 10 +++--
 src/components/Cards/OfferCard.jsx            | 40 +++++++------------
 src/components/Home/FamilyDash.jsx            | 10 +++--
 src/components/Home/index.jsx                 |  2 +-
 src/components/MyJobs/MyJobTable.jsx          |  8 ++--
 .../MyTasks/MyOffersFamilyTable.jsx           |  3 +-
 src/components/Partials/Header.jsx            |  8 ++--
 .../Settings/Tabs/PersonalInfoTab.jsx         | 10 +++--
 .../jobPopout/FamilyOfferJobPopout.jsx        |  4 +-
 9 files changed, 50 insertions(+), 45 deletions(-)

diff --git a/src/components/Cards/AvailableJobsCard.jsx b/src/components/Cards/AvailableJobsCard.jsx
index 1e4a181..d536a12 100644
--- a/src/components/Cards/AvailableJobsCard.jsx
+++ b/src/components/Cards/AvailableJobsCard.jsx
@@ -24,10 +24,12 @@ export default function AvailableJobsCard({
     setImageUrl(imagePath);
   }, []);
 
-  const image = `${image_server}${localStorage.getItem(
-    "session_token"
-  )}/job/${datas.job_uid}`;
-  
+  const image = localStorage.getItem("session_token")
+    ? `${image_server}${localStorage.getItem("session_token")}/job/${
+        datas.job_uid
+      }`
+    : "";
+
   return (
     <>
       {contentDisplay == "grid" ? (
diff --git a/src/components/Cards/OfferCard.jsx b/src/components/Cards/OfferCard.jsx
index 9dbd34a..59e517b 100644
--- a/src/components/Cards/OfferCard.jsx
+++ b/src/components/Cards/OfferCard.jsx
@@ -2,13 +2,24 @@ import localImgLoad from "../../lib/localImgLoad";
 import CountDown from "../Helpers/CountDown";
 import { PriceFormatter } from "../Helpers/PriceFormatter";
 
-export default function OfferCard({ datas, hidden = false, setOfferPopout }) {
+export default function OfferCard({
+  datas,
+  hidden = false,
+  setOfferPopout,
+  image_server,
+}) {
   let thePrice = PriceFormatter(
     datas?.price * 0.01,
     datas?.currency_code,
     datas?.currency
   );
 
+  let image = localStorage.getItem("session_token")
+    ? `${image_server}${localStorage.getItem("session_token")}/job/${
+        datas.job_uid
+      }`
+    : "";
+
   return (
     <div className="card-style-one flex flex-col justify-between w-full h-[387px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
       <div className="content">
@@ -18,9 +29,7 @@ export default function OfferCard({ datas, hidden = false, setOfferPopout }) {
           <div
             className="thumbnail w-full h-full rounded-xl overflow-hidden px-4 pt-4"
             style={{
-              background: `url(${localImgLoad(
-                `images/taskbanners/${datas?.banner || "default.jpg"}`
-              )}) center / contain no-repeat`,
+              background: `url(${image}) center / contain no-repeat`,
             }}
           >
             {hidden && <div className="flex justify-center"></div>}
@@ -31,26 +40,7 @@ export default function OfferCard({ datas, hidden = false, setOfferPopout }) {
           <h1 className="text-xl font-bold text-dark-gray dark:text-white mb-2 capitalize line-clamp-1">
             {datas.title}
           </h1>
-          {/* countdown */}
-          {/* <div className="w-full h-[54px] flex justify-evenly items-center p-2 rounded-lg border border-[#E3E4FE] dark:border-[#a7a9b533] ">
-                        <div className="flex flex-col justify-between">
-                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
-                                Task Code
-                            </p>
-                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
-                                {datas.contract}
-                            </p>
-                        </div>
-                        <div className="w-[1px] h-full bg-[#E3E4FE] dark:bg-[#a7a9b533] "></div>
-                        <div className="flex flex-col justify-between">
-                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
-                                Remaining Time
-                            </p>
-                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
-                                <CountDown lastDate={datas.expire} />
-                            </p>
-                        </div>
-                    </div> */}
+
           <div className="w-full p-2 rounded-lg border border-[#E3E4FE] dark:border-[#a7a9b533] ">
             <div className="grid grid-cols-2 gap-2">
               <div className="flex flex-col justify-between items-center border-r-2">
@@ -96,7 +86,7 @@ export default function OfferCard({ datas, hidden = false, setOfferPopout }) {
         <button
           type="button"
           onClick={() =>
-            setOfferPopout({ show: true, data: { ...datas, thePrice } })
+            setOfferPopout({ show: true, data: { ...datas, thePrice, image } })
           }
           className="btn-shine w-[98px] h-[33px] text-white rounded-full text-sm bg-pink flex justify-center items-center"
         >
diff --git a/src/components/Home/FamilyDash.jsx b/src/components/Home/FamilyDash.jsx
index dc52bea..a536cf1 100644
--- a/src/components/Home/FamilyDash.jsx
+++ b/src/components/Home/FamilyDash.jsx
@@ -4,15 +4,19 @@ import MyOffersFamilyTable from "../MyTasks/MyOffersFamilyTable";
 import FamilyActiveLSlde from "./FamilyActiveLSlde";
 
 export default function FamilyDash({ familyOffers, MyActiveJobList }) {
-  console.log("PROPS IN FAMILY DASH->", familyOffers);
+  // console.log("PROPS IN FAMILY DASH->", familyOffers?.result_list);
 
   const trending = MyActiveJobList;
   return (
     <div>
       <div className="home-page-wrapper">
         {/* <CommonHead commonHeadData={props.commonHeadData} /> */}
-        {familyOffers && familyOffers.length > 0 && (
-          <MyOffersFamilyTable familyOffers={familyOffers} className="mb-10" />
+        {familyOffers?.result_list && familyOffers?.result_list.length > 0 && (
+          <MyOffersFamilyTable
+            familyOffers={familyOffers?.result_list}
+            image_server={familyOffers?.session_image_server}
+            className="mb-10"
+          />
         )}
         {trending && trending.length > 0 && (
           <FamilyActiveLSlde trending={trending} className="mb-10" />
diff --git a/src/components/Home/index.jsx b/src/components/Home/index.jsx
index 9e9046e..20a0176 100644
--- a/src/components/Home/index.jsx
+++ b/src/components/Home/index.jsx
@@ -75,7 +75,7 @@ export default function Home(props) {
           <FamilyDash
             account={userDetails}
             commonHeadData={props.bannerList}
-            familyOffers={MyOffersList?.data?.result_list}
+            familyOffers={MyOffersList?.data}
             MyActiveJobList={MyActiveJobList?.data}
           />
         ) : userDetails && userDetails?.account_type == "FULL" ? (
diff --git a/src/components/MyJobs/MyJobTable.jsx b/src/components/MyJobs/MyJobTable.jsx
index ead2736..235b984 100644
--- a/src/components/MyJobs/MyJobTable.jsx
+++ b/src/components/MyJobs/MyJobTable.jsx
@@ -108,9 +108,11 @@ export default function MyJobTable({ MyJobList, reloadJobList, className }) {
       value?.currency
     );
 
-    const image = `${image_server}${localStorage.getItem(
-      "session_token"
-    )}/job/${value.job_uid}`;
+    const image = localStorage.getItem("session_token")
+      ? `${image_server}${localStorage.getItem("session_token")}/job/${
+          value.job_uid
+        }`
+      : "";
 
     return (
       <tr
diff --git a/src/components/MyTasks/MyOffersFamilyTable.jsx b/src/components/MyTasks/MyOffersFamilyTable.jsx
index 1395dc2..f763a59 100644
--- a/src/components/MyTasks/MyOffersFamilyTable.jsx
+++ b/src/components/MyTasks/MyOffersFamilyTable.jsx
@@ -4,7 +4,7 @@ import Icons from "../Helpers/Icons";
 import SliderCom from "../Helpers/SliderCom";
 import FamilyOfferJobPopout from "../jobPopout/FamilyOfferJobPopout";
 
-export default function MyOffersFamilyTable({ className, familyOffers }) {
+export default function MyOffersFamilyTable({ className, familyOffers, image_server }) {
   let [offerPopout, setOfferPopout] = useState({ show: false, data: {} }); // STATE TO HOLD THE VALUE OF THE ALERT DETAILS AND DETERMINE WHEN TO SHOW
   const settings = {
     arrows: false,
@@ -117,6 +117,7 @@ export default function MyOffersFamilyTable({ className, familyOffers }) {
                       key={item.id}
                       datas={item}
                       setOfferPopout={setOfferPopout}
+                      image_server={image_server}
                     />
                   );
                 })}
diff --git a/src/components/Partials/Header.jsx b/src/components/Partials/Header.jsx
index e9be0b3..12acd09 100644
--- a/src/components/Partials/Header.jsx
+++ b/src/components/Partials/Header.jsx
@@ -36,9 +36,11 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
   const { notifications } = useSelector((state) => state?.notifications); // NOTIFICATION STORE
   const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
 
-  const image = `${userDetails.session_image_server}${localStorage.getItem(
-    "session_token"
-  )}/profile/${userDetails.uid}`;
+  const image = localStorage.getItem("session_token")
+    ? `${userDetails.session_image_server}${localStorage.getItem(
+        "session_token"
+      )}/profile/${userDetails.uid}`
+    : "";
 
   const handlerBalance = () => {
     setbalanceValue.toggle();
diff --git a/src/components/Settings/Tabs/PersonalInfoTab.jsx b/src/components/Settings/Tabs/PersonalInfoTab.jsx
index 002ae67..d581d28 100644
--- a/src/components/Settings/Tabs/PersonalInfoTab.jsx
+++ b/src/components/Settings/Tabs/PersonalInfoTab.jsx
@@ -49,9 +49,11 @@ export default function PersonalInfoTab({
 }) {
   let { userDetails } = useSelector((state) => state.userDetails);
 
-  const image = `${userDetails.session_image_server}${localStorage.getItem(
-    "session_token"
-  )}/profile/${userDetails.uid}`;
+  const image = localStorage.getItem("session_token")
+    ? `${userDetails.session_image_server}${localStorage.getItem(
+        "session_token"
+      )}/profile/${userDetails.uid}`
+    : "";
 
   const apiCall = new usersService();
 
@@ -147,7 +149,7 @@ export default function PersonalInfoTab({
           msg_type: "FILE",
           action: 11300,
         };
-        
+
         setUploadStatus({
           loading: true,
           status: false,
diff --git a/src/components/jobPopout/FamilyOfferJobPopout.jsx b/src/components/jobPopout/FamilyOfferJobPopout.jsx
index 47c8089..3b90f45 100644
--- a/src/components/jobPopout/FamilyOfferJobPopout.jsx
+++ b/src/components/jobPopout/FamilyOfferJobPopout.jsx
@@ -101,6 +101,8 @@ function FamilyOfferJobPopout({ details, onClose, situation }) {
       });
   };
 
+  console.log(details)
+
   return (
     <ModalCom action={onClose} situation={situation}>
       <div className="logout-modal-wrapper lw-[90%] md:w-[768px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
@@ -138,7 +140,7 @@ function FamilyOfferJobPopout({ details, onClose, situation }) {
           <div className="p-4 w-full md:w-3/4 md:border-r-2">
             <div className="flex gap-2">
                 <div className="image-wrapper w-32">
-                    <img className="w-full h-auto" src={localImgLoad(`images/taskbanners/${details.banner}`)} alt='Banner-Image' />
+                    <img className="w-full h-auto" src={details?.image} alt='banner' />
                 </div>
                 <div className="details-wrapper">
                     <p className="text-lg my-5 font-semibold text-slate-900 tracking-wide">
-- 
2.34.1