diff --git a/src/components/FamilyAcc/FamilyPopout/AssignTaskPopout.jsx b/src/components/FamilyAcc/FamilyPopout/AssignTaskPopout.jsx index 9685f25..b4c2e23 100644 --- a/src/components/FamilyAcc/FamilyPopout/AssignTaskPopout.jsx +++ b/src/components/FamilyAcc/FamilyPopout/AssignTaskPopout.jsx @@ -9,457 +9,471 @@ import LoadingSpinner from "../../Spinners/LoadingSpinner"; import Detail from "../../jobPopout/popoutcomponent/Detail"; import { NewTasks } from "./forms"; -const AssignTaskPopout = React.memo( - ({ - action, - details, - situation, - familyDetailsData, - familyTask, - activeTask, - setActiveTask, - setUpdatePage, - assignTaskChecker, - }) => { - const apiCall = new usersService(); - let { pathname, state } = useLocation(); +const AssignTaskPopout = ({ + action, + details, + situation, + familyDetailsData, + familyTask, + activeTask, + setActiveTask, + setUpdatePage, + assignTaskChecker, + +}) => { + const apiCall = new usersService(); + let { pathname, state } = useLocation(); - const [selectedFamilyUid, setSelectedFamilyUid] = useState(null); + const [selectedFamilyUid, setSelectedFamilyUid] = useState(null); - const handleFamChange = (event) => { - setSelectedFamilyUid(event.target.value); - }; + const handleFamChange = (event) => { + setSelectedFamilyUid(event.target.value); + }; - const dispatch = useDispatch(); + const dispatch = useDispatch(); - const getFamilySession = JSON.parse(sessionStorage.getItem("family_list")); + const getFamilySession = JSON.parse(sessionStorage.getItem("family_list")); - const familyList = getFamilySession?.map((member) => ( - - )); + const familyList = getFamilySession?.map((member) => ( + + )); - let [requestStatus, setRequestStatus] = useState({ - loading: false, - status: false, - message: "", - }); // HOLDS RESPONSE FOR SENDING API REQUEST + let [requestStatus, setRequestStatus] = useState({ + loading: false, + status: false, + message: "", + }); // HOLDS RESPONSE FOR SENDING API REQUEST - let [taskType, setTaskType] = useState(details ? "new" : "select"); // SWITCHES BTW SELECT TASK AND NEW TASK + let [taskType, setTaskType] = useState(details ? "new" : "select"); // SWITCHES BTW SELECT TASK AND NEW TASK - const switchTaskType = ({ target: { value } }) => { - // FUNCTION TO CHANGE SELECTED ACTIVE TASK - setTaskType(value); - }; + const switchTaskType = ({ target: { value } }) => { + // FUNCTION TO CHANGE SELECTED ACTIVE TASK + setTaskType(value); + }; - const handleActiveTask = (id = 0, data = {}) => { - // FUNCTION TO CHANGE SELECTED ACTIVE TASK - setActiveTask({ id, data }); - }; + const handleActiveTask = (id = 0, data = {}) => { + // FUNCTION TO CHANGE SELECTED ACTIVE TASK + setActiveTask({ id, data }); + }; - // New Task - const [formState, setFormState] = useState({ - // Initialize form state with desired fields - banner: details?.banner || "default.jpg", - country: details?.country || "", - price: details?.price || "", - title: details?.title || "", - description: details?.description || "", - job_detail: details?.job_detail || "", - timeline_days: details?.timeline_days || "", - category: details?.category || "", - }); + // New Task + const [formState, setFormState] = useState({ + // Initialize form state with desired fields + banner: details?.banner || "default.jpg", + country: details?.country || "", + price: details?.price || "", + title: details?.title || "", + description: details?.description || "", + job_detail: details?.job_detail || "", + timeline_days: details?.timeline_days || "", + category: details?.category || "", + }); - const assignFamilyTask = () => { - setRequestStatus({ loading: true, status: false, message: "" }); - let reqData = {}; - if (taskType == "select") { - // RUNS HERE IF TASK TYPE IS SELECT - if (!Object.keys(activeTask.data).length) { + const assignFamilyTask = () => { + setRequestStatus({ loading: true, status: false, message: "" }); + let reqData = {}; + if (taskType == "select") { + // RUNS HERE IF TASK TYPE IS SELECT + if (!Object.keys(activeTask.data).length) { + setRequestStatus({ + loading: false, + status: false, + message: "No Task is seleted", + }); + return setTimeout(() => { + setRequestStatus({ loading: false, status: false, message: "" }); + }, 3000); + } + reqData = { + // API PAYLOADS + job_id: activeTask.data?.job_id, + job_uid: activeTask.data?.job_uid, + family_uid: selectedFamilyUid + ? selectedFamilyUid + : familyDetailsData?.uid || details?.family_uid, + job_description: activeTask.data?.description, + assign_mode: 110011, + }; + } + + if (taskType === "new") { + const { + banner, + category, + country, + description, + job_detail, + price, + timeline_days, + title, + } = formState; + + const requiredFields = { + banner, + // category, + currency: country, + description, + "job detail": job_detail, + price, + timeline: timeline_days, + title, + }; + + for (let field in requiredFields) { + if (requiredFields[field] == "") { + // let currencyErrMsg = field == "country" && "currency" setRequestStatus({ loading: false, status: false, - message: "No Task is seleted", + message: `${ + field[0].toUpperCase() + field.slice(1).toLowerCase() + } is empty`, }); return setTimeout(() => { setRequestStatus({ loading: false, status: false, message: "" }); }, 3000); } - reqData = { - // API PAYLOADS - job_id: activeTask.data?.job_id, - job_uid: activeTask.data?.job_uid, - family_uid: selectedFamilyUid - ? selectedFamilyUid - : familyDetailsData?.uid || details?.family_uid, - job_description: activeTask.data?.description, - assign_mode: 110011, - }; } - if (taskType === "new") { - const { - banner, - category, - country, - description, - job_detail, - price, - timeline_days, - title, - } = formState; + reqData = { + banner, + category, + country, + description, + job_detail, + price: price * 100, + timeline_days, + title, + assign_mode: 110055, + family_uid: details?.family_uid || familyDetailsData?.uid, + }; + } - const requiredFields = { - banner, - // category, - currency: country, - description, - "job detail": job_detail, - price, - timeline: timeline_days, - title, - }; + apiCall + .assignFamilyTask(reqData) + .then((res) => { + console.log("Assign task 1", res); + if (res.status != 200 || res.data.internal_return < 0) { + console.log("Assign task 2"); + setRequestStatus({ + loading: false, + status: false, + message: "failed to assign task", + }); + console.log("Assign task 3"); - for (let field in requiredFields) { - if (requiredFields[field] == "") { - // let currencyErrMsg = field == "country" && "currency" - setRequestStatus({ - loading: false, - status: false, - message: `${ - field[0].toUpperCase() + field.slice(1).toLowerCase() - } is empty`, - }); - return setTimeout(() => { - setRequestStatus({ loading: false, status: false, message: "" }); - }, 3000); - } + return setTimeout(() => { + setRequestStatus({ loading: false, status: false, message: "" }); + }, 5000); } + if (res.status === 200) { + console.log("Assign task 4"); - reqData = { - banner, - category, - country, - description, - job_detail, - price: price * 100, - timeline_days, - title, - assign_mode: 110055, - family_uid: details?.family_uid || familyDetailsData?.uid, - }; - } - - apiCall - .assignFamilyTask(reqData) - .then((res) => { - if (res.status != 200 || res.data.internal_return < 0) { - setRequestStatus({ - loading: false, - status: false, - message: "failed to assign task", - }); - return setTimeout(() => { - setRequestStatus({ loading: false, status: false, message: "" }); - }, 5000); - } setRequestStatus({ loading: false, status: true, message: "action successful", }); - setUpdatePage((prev) => !prev); // Updates family task page by calling the useeffect hook + console.log("Assign task 5"); + + // setUpdatePage(prev => !prev); // Updates family task page by calling the useeffect hook + console.log("Assign task 6"); + dispatch(tableReload({ type: "WALLETTABLE" })); // RELOADS USER WALLET + console.log("Assign task 7"); + setTimeout(() => { setRequestStatus({ loading: false, status: false, message: "" }); action(); // FUNCTION THAT CLOSES THE MODAL BOX }, 5000); - }) - .catch((err) => { - setRequestStatus({ - loading: false, - status: false, - message: "An Error occured, try again", - }); - setTimeout(() => { - setRequestStatus({ loading: false, status: false, message: "" }); - }, 5000); + console.log("Assign task 8"); + } + }) + .catch((err) => { + setRequestStatus({ + loading: false, + status: false, + message: "An Error occured, try again", }); - }; - return ( - <> - -
-
-

- {details ? ( - ` Assign ${details?.firstname}'s Task` - ) : familyDetailsData ? ( - ` Assign ${familyDetailsData.firstname}'s Task` - ) : ( -
- Assign task to{" "} -
- + console.log("This is a test error " + err); + setTimeout(() => { + setRequestStatus({ loading: false, status: false, message: "" }); + }, 5000); + }); + }; + + return ( + <> + +
+
+

+ {details ? ( + ` Assign ${details?.firstname}'s Task` + ) : familyDetailsData ? ( + ` Assign ${familyDetailsData.firstname}'s Task` + ) : ( +
+ Assign task to{" "} +
+ +
+
+ )} +

+ +
+ {familyTask?.loading ? ( +
+ +
+ ) : ( + <> +
+
+
+
+ + Select Task +
+
+ + New Task
- )} -

- -
- {familyTask?.loading ? ( -
- -
- ) : ( - <> -
-
-
-
- - Select Task -
-
- - New Task -
-
- {/* Task Type === select */} - {taskType == "select" && ( -
- {familyTask?.data?.length ? ( - familyTask?.data?.map((item, index) => ( -
+ {/* Task Type === select */} + {taskType == "select" && ( +
+ {familyTask?.data?.length ? ( + familyTask?.data?.map((item, index) => ( +
handleActiveTask(item.job_uid, item)} + > + handleActiveTask(item.job_uid, item) } - > - - handleActiveTask(item.job_uid, item) - } - className="w-[15px] h-[15px] cursor-pointer" - /> -

- {item?.title} -

-
- )) - ) : ( -

- No Task found! -

- )} -
- )} - {taskType == "new" && ( -
- -
- )} -
- - {/*Right Hand Side for details && Task Type === select */} - {taskType == "select" && ( - <> - {familyTask?.data?.length > 0 ? ( -
-
-

- {activeTask?.data?.title} + className="w-[15px] h-[15px] cursor-pointer" + /> +

+ {item?.title}

-
- -
-
-
- -

- {PriceFormatter( - activeTask?.data?.price * 0.01, - activeTask?.data?.currency, - activeTask?.data?.curreny_code - )} -

-
- -
- -

{`${activeTask?.data?.timeline_days} day(s)`}

-
-
- -
- -
- -
- -