diff --git a/src/components/MyTasks/MyJobTable.jsx b/src/components/MyTasks/MyJobTable.jsx
index 775a694..fb4e74f 100644
--- a/src/components/MyTasks/MyJobTable.jsx
+++ b/src/components/MyTasks/MyJobTable.jsx
@@ -7,6 +7,7 @@ import { useNavigate, useLocation } from "react-router-dom";
import { PriceFormatter } from "../Helpers/PriceFormatter";
const noTasksBg = require("../../assets/images/no-task-background.jpg");
+const noFamilyTasksBg = require("../../assets/images/family-no-task-background.jpg");
export default function MyJobTable({ className, ActiveJobList, Account }) {
let navigate = useNavigate();
@@ -25,14 +26,17 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
handlePagingFunc(e, setCurrentPage);
};
+ let accountType = Account?.account_type == "FULL"
+
// To navigate to task
const [btnLoader, setBtnLoader] = useState(false);
const navigateMarket = () => {
setBtnLoader(true);
- setTimeout(() => {
- navigate(Account == "FULL" ? "/market" : "/", { replace: true });
+ const timeoutId = setTimeout(() => {
+ navigate(accountType ? "/market" : "/", { replace: true });
setBtnLoader(false);
}, 2500);
+ return () => clearTimeout(timeoutId);
};
return (
@@ -42,12 +46,12 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
} bg-cover bg-center`}
style={{
backgroundImage: !ActiveJobList?.data.length
- ? `url('${noTasksBg}')`
+ ? `url('${accountType ? noTasksBg : noFamilyTasksBg}')`
: "none",
}}
>
{/* Adding this dark overlay in order to see the texts properly */}
- {!ActiveJobList?.data.length && (
+ {!ActiveJobList?.data.length && accountType && (
)}
{ActiveJobList?.data.length > 0 && ActiveJobList.loading && (
@@ -134,20 +138,41 @@ export default function MyJobTable({ className, ActiveJobList, Account }) {
})}
{ActiveJobList?.data?.length <= 0 && (
-
-
- You currently have "0" task
-
-
)}
{ActiveJobList?.internal_return < 0 && (
diff --git a/src/components/MyTasks/MyOffersFamilyTable.jsx b/src/components/MyTasks/MyOffersFamilyTable.jsx
new file mode 100644
index 0000000..7c7c2b0
--- /dev/null
+++ b/src/components/MyTasks/MyOffersFamilyTable.jsx
@@ -0,0 +1,175 @@
+import { useRef, useState } from "react";
+import Icons from "../Helpers/Icons";
+import SliderCom from "../Helpers/SliderCom";
+
+import OfferJobPopout from "../jobPopout/OfferJobPopout";
+import LoadingSpinner from "../Spinners/LoadingSpinner";
+import { PriceFormatter } from "../Helpers/PriceFormatter";
+
+export default function MyOffersFamilyTable({ className, MyActiveOffersList }) {
+ 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,
+ dots: false,
+ infinite: MyActiveOffersList?.result_list?.length > 4,
+ autoplay: true,
+ slidesToShow: 4,
+ slidesToScroll: 1,
+ responsive: [
+ {
+ breakpoint: 426,
+ settings: {
+ slidesToShow: 2,
+ slidesToScroll: 1,
+ infinite: MyActiveOffersList?.result_list?.length > 2,
+ },
+ },
+ ],
+ };
+
+ console.log("YES WE SEE OFFERS", MyActiveOffersList);
+ const sellSlider = useRef(null);
+ //const buySlider = useRef(null);
+ const prevHandler = (value) => {
+ if (value === "sell") {
+ sellSlider.current.slickPrev();
+ }
+ // if (value === "buy") {
+ // buySlider.current.slickPrev();
+ // }
+ };
+ const nextHandler = (value) => {
+ if (value === "sell") {
+ sellSlider.current.slickNext();
+ }
+ // if (value === "buy") {
+ // buySlider.current.slickNext();
+ // }
+ };
+
+ if (!MyActiveOffersList || MyActiveOffersList?.result_list?.length == 0) {
+ return ""; // want blank or no appear when no items
+ }
+
+ return (
+ <>
+
+
+
+
+
+
+ You Have Task(s) Waiting For You
+
+
+
nextHandler("sell")}
+ type="button"
+ className="transform rotate-180 text-dark-gray dark:text-white dark:opacity-25"
+ >
+
+
+
prevHandler("sell")}
+ type="button"
+ className="transform rotate-180"
+ >
+
+
+
+
+
+
+ {MyActiveOffersList &&
+ MyActiveOffersList?.result_list?.length > 0 &&
+ MyActiveOffersList?.result_list?.map((value, index) => {
+ let thePrice = PriceFormatter(
+ value?.price * 0.01,
+ value?.currency_code,
+ value?.currency
+ );
+ return (
+
+
+ {/* title */}
+
+ {/* username */}
+
+
+ {value.timeline_days} Days
+
+
+ {thePrice}
+
+
+
{
+ setOfferPopout({
+ show: true,
+ data: {...value, thePrice },
+ });
+ }}
+ className="w-20 h-11 self-center btn-gradient text-base rounded-full text-white"
+ >
+ Start Task
+
+
+
+ );
+ })}
+
+
+
+
+
+
+ {/* Offer Job Popout */}
+ {offerPopout.show && (
+
{
+ setOfferPopout({ show: false, data: {} });
+ }}
+ situation={offerPopout.show}
+ />
+ )}
+ {/* End of Offer Job Popout */}
+
+ >
+ );
+}
diff --git a/src/components/MyTasks/index.jsx b/src/components/MyTasks/index.jsx
index ddcba34..a6b6940 100644
--- a/src/components/MyTasks/index.jsx
+++ b/src/components/MyTasks/index.jsx
@@ -11,7 +11,7 @@ export default function MyTasks({
ActiveJobList,
commonHeadData,
}) {
- const { userDetails: account_type } = useSelector(
+ const { userDetails } = useSelector(
(state) => state?.userDetails
);
@@ -19,6 +19,11 @@ export default function MyTasks({
const filterHandler = (value) => {
setValue(value);
};
+
+ let accountType = userDetails?.account_type == "FULL"
+
+ console.log("Active something >>", MyActiveOffersList)
+
return (
@@ -42,14 +47,14 @@ export default function MyTasks({
>
- {MyActiveOffersList &&
+ {MyActiveOffersList && accountType &&
MyActiveOffersList?.result_list?.length >= 0 && (