disabled assign btn after task is assigned

src/components/AddJob/AddJob.jsx

@@ -92,13 +92,13 @@ function AddJob({ popUpHandler, categories }) {
       >
         {(props) => {
           return (
-            <Form>
+            <Form className='contents'>
-              <div className="add-job p-5 w-full bg-white dark:bg-dark-white dark:text-white rounded-md flex flex-col justify-between">
+              <div className="add-job p-5 w-full h-full rounded-md flex flex-col justify-between overflow-y-auto">
                 <div className="flex flex-col-reverse sm:flex-row">
                   <div className="fields w-full">
                     {/* inputs starts here */}
                     <div className="xl:flex xl:space-x-7 mb-[5px]">
-                      <div className="field w-full mb-6 xl:mb-0">
+                      <div className="field w-full mb-[5px] xl:mb-0">
                         <label
                           htmlFor="country"
                           className="job-label job-label-flex"
@@ -159,7 +159,7 @@ function AddJob({ popUpHandler, categories }) {
                       </div>
 
                       {/* Price */}
-                      <div className="field w-full">
+                      <div className="field w-full mb-[5px] xl:mb-0">
                         <InputCom
                           fieldClass="px-6 text-right flex"
                           label="Price"
@@ -179,7 +179,7 @@ function AddJob({ popUpHandler, categories }) {
                       </div>
 
                       {/* Timeline */}
-                      <div className="field w-full">
+                      <div className="field w-full mb-[5px] xl:mb-0">
                         <label
                             className="job-label job-label-flex"
                             htmlFor="timeline_days"

src/components/AuthPages/AuthLayout2.jsx

@@ -18,13 +18,13 @@ export default function LoginLayout({ slogan, children }) {
         backgroundImage: `url(${countryMode == "NG" ? bgImgNig : bgImgCom})`,
       }}
     >
-      <div className={`w-full grid grid-cols-1 lg:grid-cols-2`}>
+      <div className={`w-full grid grid-cols-1 xl:grid-cols-2`}>
         {/* <div 
-            className={`auth-bg hidden lg:block bg-blue-50 relative bg-cover bg-no-repeat border-0 after:content-[''] after:absolute after:inset-0`} 
+            className={`auth-bg hidden xl:block bg-blue-50 relative bg-cover bg-no-repeat border-0 after:content-[''] after:absolute after:inset-0`} 
             style={{backgroundImage: `url(${bgImg})`}}
         >
         </div> */}
-        <div className="p-5 sm:p-7 flex place-content-center lg:col-start-2">
+        <div className="p-5 sm:p-7 flex place-content-center xl:col-start-2">
           <div className="py-5 w-full sm:w-11/12 max-w-[550px] shadow-md bg-slate-50 dark:bg-dark-white rounded-[0.475rem]">
             <div className="w-full flex justify-center items-center">
               {children && children}

src/components/Dashboards/AccountDashboard.jsx

@@ -45,7 +45,7 @@ const AccountDashboard = ({ className, bannerList }) => {
         {getLowerBanner?.map((props, idx) => {
           let image = getImage(props);
 
-          let { short_title, short_description, short_button_text, link_path } =
+          let { short_title, short_description, short_button_text, link_path, card_type, blog_id } =
             props;
 
           return (
@@ -56,6 +56,8 @@ const AccountDashboard = ({ className, bannerList }) => {
                 title={short_title}
                 desc={short_description}
                 link_path={link_path}
+                card_type={card_type}
+                blog_id={blog_id}
               />
             </div>
           );
@@ -102,7 +104,9 @@ const TopBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
   );
 };
 
-const LowerBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
+const LowerBanner = ({ image, title = "", desc = "", btn, link_path, card_type, blog_id, key }) => {
+  const newLinkPath = card_type == 'BLOG' ? `${link_path}?blog_id=${blog_id}` : link_path
+
   return (
     <div
       key={key}
@@ -111,15 +115,15 @@ const LowerBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
       <div className="w-full xxs:flex justify-between items-center border-b border-slate-300 p-2">
         <div className="min-h-[150px] sm:min-h-[130px] flex justify-between items-center">
           <div className="px-2 flex flex-col gap-2 dark:text-white">
-            <Link to={link_path} className="text-lg font-bold">
+            <Link to={newLinkPath} className="text-lg font-bold">
               {title}
             </Link>
-            <p to={link_path} className="text-sm">
+            <p to={newLinkPath} className="text-sm">
               {desc}
             </p>
           </div>
         </div>
-        <Link to={link_path} className="w-[150px] h-[100px]">
+        <Link to={newLinkPath} className="w-[150px] h-[100px]">
           <img
             src={image}
             alt="banner-img"
@@ -129,7 +133,7 @@ const LowerBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
         </Link>
       </div>
       <div className="flex justify-between w-full px-2 items-center">
-        <Link to={link_path} className="text-slate-300 font-semibold text-sm">
+        <Link to={newLinkPath} className="text-slate-300 font-semibold text-sm">
           {btn}
         </Link>
         <button className="flex items-center justify-center gap-2">

src/components/FamilyAcc/FamilyManageTabs.jsx

@@ -176,6 +176,9 @@ export default function FamilyManageTabs({
         familyData={familyWaitList}
         accountDetails={accountDetails}
         setUpdatePage={setUpdatePage}
+        jobList={jobList}
+        setActiveTask={setActiveTask}
+        activeTask={activeTask}
       />
     ),
     Pending: (

src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx

@@ -85,10 +85,10 @@ export default function AssignMediaTask({
               >
                 {(props) => {
                   return (
-                        <Form>
+                        <Form className='contents'>
                             <>
                                 <div
-                                className={`job-action-modal-body w-full h-[500px] overflow-y-auto md:grid md:grid-cols-2`}
+                                className={`job-action-modal-body w-full h-full overflow-y-auto md:grid md:grid-cols-2`}
                                 >
                                 <div className="p-4 pt-0">
                                     <div className="p-4 w-full h-[450px] overflow-y-auto bg-slate-100 rounded-md dark:bg-[#11131f] dark:text-white">
@@ -124,7 +124,7 @@ export default function AssignMediaTask({
                                 {/*Right Hand Side for details && Task Type === select */}
                                     <>
                                     {commonMedia?.data?.length > 0 ? (
-                                        <div className="p-4 py-0 h-full">
+                                        <div className="p-4 py-0 h-auto">
                                         <div className="w-full">
                                             <div className="mb-3 w-full">
                                             <label className="job-label">

src/components/FamilyAcc/FamilyPopout/AssignPrevNewTask.jsx

@@ -22,7 +22,7 @@ export default function AssignPrevNewTask({
 
 
   let imageSrc = (localStorage.getItem("session_token")
-  ? `${userDetails?.session_image_server}${localStorage.getItem("session_token")}/job/${activeTask.data.job_uid}` : ""); // FOR GETTING JOB IMAGE
+  ? `${userDetails?.session_image_server}${localStorage.getItem("session_token")}/job/${activeTask?.data?.job_uid}` : ""); // FOR GETTING JOB IMAGE
 
   return (
     <>
@@ -33,7 +33,7 @@ export default function AssignPrevNewTask({
             ) : (
               <>
                 <div
-                  className={`job-action-modal-body w-full h-[500px] overflow-y-auto md:grid ${
+                  className={`job-action-modal-body w-full h-full overflow-y-auto md:grid ${
                     taskType !== "new" ? "md:grid-cols-2" : "md:grid-cols-1"
                   }`}
                 >
@@ -230,9 +230,9 @@ export default function AssignPrevNewTask({
                       ) : (
                         <button
                           type="button"
-                          disabled={requestStatus.loading}
+                          disabled={requestStatus.loading || requestStatus.status}
                           onClick={assignFamilyTask}
-                          className="custom-btn btn-gradient text-white"
+                          className={`custom-btn btn-gradient text-white ${requestStatus.status && 'opacity-50'}`}
                         >
                           Assign
                         </button>

src/components/FamilyAcc/FamilyPopout/AssignTaskPopout.jsx

@@ -311,7 +311,7 @@ const AssignTaskPopout = ({
   return (
     <>
       <ModalCom action={action} situation={situation}>
-        <div className="w-11/12 lg:w-[700px] bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
+        <div className="modal-container">
           <div className="modal-header-con">
             <h1 className="modal-title">
               {details ? (
@@ -364,7 +364,7 @@ const AssignTaskPopout = ({
               </svg>
             </button>
           </div>
-          <div className="modal-body">
+          <div className="modal-body-wrapper p-[0!important]">
             <div className="px-4 py-2 w-full flex items-center gap-4">
               <button
                 name='task'
@@ -383,7 +383,7 @@ const AssignTaskPopout = ({
               Media
               </button>
             </div>
-            <div className="">
+            <div className="contents">
               {assignType == 'task' ?
                 <AssignPrevNewTask 
                   jobList={jobList}

src/components/FamilyAcc/Tabs/FamilyWaitlist.jsx

@@ -5,7 +5,7 @@ import LoadingSpinner from "../../Spinners/LoadingSpinner";
 import AssignTaskPopout from "../FamilyPopout/AssignTaskPopout";
 
 const FamilyWaitlist = memo(
-  ({ familyData, className, accountDetails, setUpdatePage }) => {
+  ({ familyData, className, accountDetails, setUpdatePage, jobList, setActiveTask, activeTask }) => {
     const [popUp, setPopUp] = useState({ show: false, data: {} });
     const [continueTaskPopup, setContinueTaskPopup] = useState({
       show: false,
@@ -144,6 +144,9 @@ const FamilyWaitlist = memo(
             action={closeContinueTaskPopup}
             situation={continueTaskPopup.show}
             setUpdatePage={setUpdatePage}
+            jobList={jobList}
+            setActiveTask={setActiveTask}
+            activeTask={activeTask}
           />
         )}
       </div>

src/components/Helpers/ModalCom.jsx

@@ -14,9 +14,9 @@ export default function ModalCom({ action, children, situation, isOpen, classNam
     <div className="modal-com">
       <div
         onClick={action || isOpen}
-        className="fixed top-0 left-0 w-full lg:h-[100vh] h-full bg-black bg-opacity-40 backdrop-filter backdrop-blur-sm z-50"
+        className="fixed top-0 left-0 bottom-0 w-full bg-black bg-opacity-40 backdrop-filter backdrop-blur-sm z-50"
       ></div>
-      <div className={`fixed lg:h-100vh h-full z-[99999999999999] w-full lg:w-auto inset-0 flex flex-col justify-center items-center ${className}`}>
+      <div className={`fixed h-full z-[99999999999999] w-full lg:w-auto inset-0 flex flex-col justify-center items-center ${className}`}>
         {children && children}
       </div>
     </div>

src/components/jobPopout/DeleteJobPopout.jsx

@@ -145,7 +145,7 @@ function DeleteJobPopout({ details, onClose, situation }) {
           {/* End of error or success display */}
         </div>
         <div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
-          <div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
+          <div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center gap-4">
             <button
               onClick={onClose}
               type="button"

src/components/jobPopout/EditJobPopoutNew.jsx

@@ -254,7 +254,7 @@ const EditJobPopoutNew = ({
                         <div className="flex flex-col-reverse sm:flex-row">
                             <div className="fields w-full">
                             <div className="sm:flex sm:space-x-7 mb-[0.5rem]">
-                                <div className="field w-full mb-6 sm:mb-0">
+                                <div className="field w-full mb-[0.5rem] sm:mb-0">
                                 <InputCom
                                     fieldClass="px-6 cursor-default"
                                     label="Currency"
@@ -271,7 +271,7 @@ const EditJobPopoutNew = ({
                                 </div>
 
                                 {/* Price */}
-                                <div className="field w-full mb-6 sm:mb-0">
+                                <div className="field w-full mb-[0.5rem] sm:mb-0">
                                 <InputCom
                                     fieldClass="px-6 text-right"
                                     label="Price"
@@ -289,7 +289,7 @@ const EditJobPopoutNew = ({
                                 />
                                 </div>
 
-                                <div className="field w-full">
+                                <div className="field w-full mb-[0.5rem] sm:mb-0">
                                 <label
                                     className="job-label"
                                     htmlFor="timeline_days"

src/components/jobPopout/JobListPopout.jsx

@@ -560,7 +560,7 @@ const JobFieldInput = ({
               <Field
                 component="select"
                 name={inputName}
-                className={`input-field placeholder:text-base text-dark-gray w-full h-full bg-white outline-none px-2`}
+                className={`options-default`}
                 value={value}
               >
                 {/* <option value="">{optionText}</option> */}

src/index.css

@@ -160,9 +160,9 @@
     @apply flex items-center gap-2
   }
 
-  /* STYLES FOR MODAL 'NOTE => VIEW JOB EDIT MODAL FOR SAMPLE USAGE'*/
+  /* STYLES FOR MODAL 'NOTE => VIEW JOB EDIT MODAL/ADD JOB MODAL FOR SAMPLE USAGE'*/
   .modal-container {
-    @apply w-11/12 md:w-[700px] mx-auto h-full flex flex-col bg-white dark:bg-dark-white lg:rounded-2xl overflow-hidden
+    @apply w-11/12 md:w-[700px] mx-auto h-auto max-h-full flex flex-col bg-white dark:bg-dark-white lg:rounded-2xl overflow-hidden
   }
 
   /* Modal Header section*/
@@ -183,7 +183,7 @@
 
   /* modal footer */
   .modal-footer-wrapper{
-    @apply p-4 border-t-2 flex justify-between items-center
+    @apply p-4 border-t-2 flex justify-between items-center w-full
   }
   /* END OF STYLES FOR MODAL BOX */
 
@@ -194,6 +194,9 @@
   .logout-btn {
     @apply px-4 min-w-[80px] h-[52px] flex justify-center items-center text-xl font-bold rounded-full cursor-pointer
   }
+  .options-default {
+    @apply px-2 placeholder:text-sm w-full h-full bg-white outline-none text-sm text-slate-900 dark:text-white
+  }
 }
 
 /* =====================  EXTRA ===================== */

src/views/AddJobPage.jsx

@@ -5,7 +5,7 @@ import ModalCom from "../components/Helpers/ModalCom";
 function AddJobPage({ action, situation, categories }) {
   return (
     <ModalCom action={action} situation={situation}>
-      <div className="lg:w-[600px] w-11/12 lg:overflow-hidden lg:rounded-2xl bg-white dark:bg-dark-white dark:text-white">
+      <div className="modal-container">
         <div className="modal-header-con">
           <h1 className="modal-title">
             New Job