diff --git a/src/components/Cards/AvailableJobsCard.jsx b/src/components/Cards/AvailableJobsCard.jsx index 9ae4bc4..d0547f0 100644 --- a/src/components/Cards/AvailableJobsCard.jsx +++ b/src/components/Cards/AvailableJobsCard.jsx @@ -1,8 +1,9 @@ -import React, { useState } from "react"; -import { Link } from "react-router-dom"; +import React, { useEffect, useState } from "react"; +import { Link, useNavigate, } from "react-router-dom"; import { toast } from "react-toastify"; import localImgLoad from "../../lib/localImgLoad"; import Icons from "../Helpers/Icons"; +import MarketPopUp from "../MarketPlace/PopUp/MarketPopUp"; export default function AvailableJobsCard({ className, @@ -11,7 +12,10 @@ export default function AvailableJobsCard({ }) { //debugger; const [addFavorite, setValue] = useState(datas.whishlisted); - const [options, setOption] = useState(false); + const [marketPopUp, setMarketPopUp] = useState({ show: false, data: {} }); + + const navigate = useNavigate(); + const favoriteHandler = () => { if (!addFavorite) { setValue(true); @@ -21,98 +25,118 @@ export default function AvailableJobsCard({ toast.warn("Remove to Favorite List"); } }; + + useEffect(() => { + if (!datas) { + navigate("/market", { replace: true }); + } + }, []) return ( -
-
- -

- {datas.title} -

- + <> +
+
+ +

+ {datas.title} +

+ -
-
-
-

Added

-

- {datas.offer_added} -

-
-
-
-
-
-

- Expires -

-

- {datas.expire} -

-
-
-
-
-
-
{datas.description}
-
-
-
-
- {/*
*/} - {/* {datas.isActive && (*/} - {/* */} - {/* Active*/} - {/**/} - {/* )}*/} - {/*
*/} - - {/*
*/} - {/* */} - {/* */} - {/* */} - {/*
*/} -
- -
-
+
+
-

- {datas.price * 0.01} - {datas.currency} | {datas.timeline_days} day(s) -

-

- ( {datas.offer_code}) +

Added

+

+ {datas.offer_added}

-
- +
+
+
+

+ Expires +

+

+ {datas.expire} +

+
+
+
+
+
+
{datas.description}
+
+
+
+
+ {/*
*/} + {/* {datas.isActive && (*/} + {/* */} + {/* Active*/} + {/**/} + {/* )}*/} + {/*
*/} + + {/*
*/} + {/* */} + {/* */} + {/* */} + {/*
*/} +
+ +
+
+
+

+ {datas.price * 0.01} + {datas.currency} | {datas.timeline_days} day(s) +

+

+ ( {datas.offer_code}) +

+
+
+
+ +
-
+ {marketPopUp.show && ( + { + setMarketPopUp({ show: false, data: {} }); + }} + situation={marketPopUp.show} + /> + )} + ); } diff --git a/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx b/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx index 9ebd3fb..c81fcbc 100644 --- a/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx +++ b/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx @@ -79,9 +79,11 @@ export default function FamilyManageTabs({ let { family_uid } = accountDetails; let reqData = { family_uid }; + // the family response const familyRes = await apiCall.ManageFamily(reqData); const familyData = familyRes.data; + // the tasks response const tasksRes = await apiCall.ManageTasks(reqData); const tasksData = tasksRes.data; diff --git a/src/components/MarketPlace/PopUp/MarketPopUp.jsx b/src/components/MarketPlace/PopUp/MarketPopUp.jsx new file mode 100644 index 0000000..dfe541c --- /dev/null +++ b/src/components/MarketPlace/PopUp/MarketPopUp.jsx @@ -0,0 +1,133 @@ +import React from "react"; +import ModalCom from "../../Helpers/ModalCom"; +import { Form, Formik } from "formik"; + +const MarketPopUp = ({ details, onClose, situation }) => { + console.log("maker pop data", details); + return ( + // className="job-popup" + +
+
+ +
+ +
+
+
+

+ {details.offer_code} +

+

+ {`Timeline: ${details.timeline_days} day(s) -- `} + {`Budget: ${details.price} naira`} +

+
+ + {/* INPUT SECTION */} + {[ + { name: "Title", content: details.title }, + { name: "Description", content: details.description }, + { + name: "Detail", + content: details.job_description, + danger: true, + }, + ].map(({ name, content, danger }, idx) => ( +
+ + {danger ? ( +

+ ) : ( +

+ {content !== "Detail" ? content : null} +

+ )} +
+ ))} +
+
+
+ +