diff --git a/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx b/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx
new file mode 100644
index 0000000..1014f8b
--- /dev/null
+++ b/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx
@@ -0,0 +1,287 @@
+import React, { useEffect, useState } from 'react'
+import LoadingSpinner from '../../Spinners/LoadingSpinner'
+import { NewTasks } from './forms'
+import { PriceFormatter } from '../../Helpers/PriceFormatter'
+import { useSelector } from 'react-redux';
+import { InputCom } from '../../AddJob/settings';
+
+export default function AssignMediaTask({
+ commonMedia,
+ requestStatus,
+ assignFamilyTask,
+ activeMedia,
+ handleActiveMedia,
+ closeModal
+}) {
+
+ const {userDetails} = useSelector((state) => state?.userDetails); // CHECKS IF USER Details are avaliable, to determine if user is active
+
+ const { walletDetails } = useSelector((state) => state?.walletDetails); // WALLET STORE
+
+ let imageSrc = (localStorage.getItem("session_token")
+ ? `${userDetails?.session_image_server}${localStorage.getItem("session_token")}/job/${activeMedia.uid}` : ""); // FOR GETTING JOB IMAGE
+
+// const handleInputChange = (event) => {
+// const { name, value } = event.target;
+// setFormState((prevState) => ({
+// ...prevState,
+// [name]: value,
+// }));
+// };
+
+ return (
+ <>
+ {commonMedia?.loading ? (
+
+
+
+ ) : (
+ <>
+
+
+
+ {commonMedia?.data?.length ? (
+ commonMedia?.data?.map((item, index) => (
+
handleActiveMedia(item)}
+ >
+
+ handleActiveMedia(item)
+ }
+ className="w-[15px] h-[15px] cursor-pointer"
+ />
+
+ {item?.title}
+
+
+ ))
+ ) : (
+
+ No Media found!
+
+ )}
+
+
+
+ {/*Right Hand Side for details && Task Type === select */}
+ <>
+ {commonMedia?.data?.length > 0 ? (
+
+
+
+
+
+ {activeMedia?.description}
+
+
+
+
+
+
+
+
+
+ {/* Price */}
+
+
+
+
+
+ {/* Currency */}
+
+
+
+
+
+
+ {/* Duration */}
+
+
+
+
+
+ {/* Delivery Detail */}
+
+
+
+
+
+
+ ) : (
+ <>
+ )}
+
+
+ {/* error or success display */}
+
+ {requestStatus.message != "" &&
+ (!requestStatus.status ? (
+
+ {requestStatus.message}
+
+ ) : (
+ requestStatus.status && (
+
+ {requestStatus.message}
+
+ )
+ ))}
+
+
+ {/* End of error or success display */}
+
+
+
+ {requestStatus.loading ? (
+
+ ) : (
+
+ )
+ }
+
+
+
+
+
+ ) : (
+ <>
+
+
+
+ {/* Task Type === select */}
+ {taskType == "select" && (
+
+ {familyTask?.data?.length ? (
+ familyTask?.data?.map((item, index) => (
+
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}
+
+ {/*
+
+
*/}
+
+
+
+ {activeTask?.data?.description}
+
+
+
+
+
+
+
+ {PriceFormatter(
+ activeTask?.data?.price * 0.01,
+ activeTask?.data?.currency,
+ activeTask?.data?.curreny_code
+ )}
+
+
+
+
+
+
{`${activeTask?.data?.timeline_days} day(s)`}
+
+
+
+
+
+
+
+
+
+ {/* Dummy, no value found for created! thus commented*/}
+ {/*
+
+
*/}
+
+
+
+
+
+
+
+ ) : (
+ <>
+ )}
+
+ )}
+
+ {/* error or success display */}
+
+ {requestStatus.message != "" &&
+ (!requestStatus.status ? (
+
+ {requestStatus.message}
+
+ ) : (
+ requestStatus.status && (
+
+ {requestStatus.message}
+
+ )
+ ))}
+
+
+ {/* End of error or success display */}
+
+
+
+ {requestStatus.loading ? (
+
+ ) : (
+
+ )
+ // : (
+ //
+ // )
+ }
+
+
+
-
-
- ) : (
- <>
-
+
+
-
- {/* BTN */}
-
- {/* error or success display */}
-
- {requestStatus.message != "" &&
- (!requestStatus.status ? (
-
- {requestStatus.message}
-
- ) : (
- requestStatus.status && (
-
- {requestStatus.message}
-
- )
- ))}
-
-
- {/* End of error or success display */}
-
-
-
- {requestStatus.loading ? (
-
- ) : (
-
- )
- // : (
- //
- // )
- }
-
-
-
-
- )}
+ Task
+
+
+
+ {assignType == 'task' ?
+
+ :
+
+ }
+
+
+
+ ) : (
+ <>
+
+
+
+ {/* Task Type === select */}
+ {taskType == "select" && (
+
+ {familyTask?.data?.length ? (
+ familyTask?.data?.map((item, index) => (
+
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}
+
+ {/*
+
+
*/}
+
+
+
+ {activeTask?.data?.description}
+
+
+
+
+
+
+
+ {PriceFormatter(
+ activeTask?.data?.price * 0.01,
+ activeTask?.data?.currency,
+ activeTask?.data?.curreny_code
+ )}
+
+
+
+
+
+
{`${activeTask?.data?.timeline_days} day(s)`}
+
+
+
+
+
+
+
+
+
+ {/* Dummy, no value found for created! thus commented*/}
+ {/*
+
+
*/}
+
+
+
+
+
+
+
+ ) : (
+ <>
+ )}
+
+ )}
+
+ {/* error or success display */}
+
+ {requestStatus.message != "" &&
+ (!requestStatus.status ? (
+
+ {requestStatus.message}
+
+ ) : (
+ requestStatus.status && (
+
+ {requestStatus.message}
+
+ )
+ ))}
+
+
+ {/* End of error or success display */}
+
+
+
+ {requestStatus.loading ? (
+
+ ) : (
+
+ )
+ // : (
+ //
+ // )
+ }
+
+
+