displays offerlist if it exist on home page

src/components/FamilyAcc/index.jsx

@@ -14,7 +14,9 @@ import FamilyTable from "./FamilyTable";
 
 export default function FamilyAcc() {
   const [selectTab, setValue] = useState("today");
-  const [selectedAge, setSelectedAge] = useState(undefined);
+  // State to store the selected year and month
+  const [selectedYear, setSelectedYear] = useState("");
+  const [selectedMonth, setSelectedMonth] = useState("");
   const [familyList, setFamilyList] = useState([]);
   const [loader, setLoader] = useState(false);
   const [popUp, setPopUp] = useState(false);
@@ -35,17 +37,14 @@ export default function FamilyAcc() {
     setValue(value);
   };
 
-  const ageRange = useMemo(() => {
-    const startAge = 5;
-    const endAge = 16;
-    return Array.from(
-      { length: endAge - startAge + 1 },
-      (_, index) => startAge + index
-    );
-  }, []);
+  // Handle year selection
+  const handleYearChange = (e) => {
+    setSelectedYear(e.target.value);
+  };
 
-  const handleAgeSelect = (event) => {
-    setSelectedAge(parseInt(event.target.value));
+  // Handle month selection
+  const handleMonthChange = (e) => {
+    setSelectedMonth(e.target.value);
   };
 
   const handleInputChange = (event) => {
@@ -53,6 +52,13 @@ export default function FamilyAcc() {
     setFormData((prevFormData) => ({ ...prevFormData, [name]: value }));
   };
 
+  // use the useEffect hook to clear the selected month if the year changes (to ensure consistency)
+  useEffect(() => {
+    if (selectedYear === "" && selectedMonth !== "") {
+      setSelectedMonth("");
+    }
+  }, [selectedYear]);
+
   const addMember = async () => {
     const { first_name, last_name } = formData;
     setLoader(true);
@@ -61,7 +67,8 @@ export default function FamilyAcc() {
         const reqData = {
           firstname: first_name,
           lastname: last_name,
-          age: selectedAge,
+          year: +selectedYear,
+          month: +selectedMonth,
         };
 
         const res = await apiCall.addFamily(reqData);
@@ -91,7 +98,8 @@ export default function FamilyAcc() {
         first_name: "",
         last_name: "",
       });
-      setSelectedAge("");
+      setSelectedMonth("");
+      setSelectedYear("");
     }
   };
 
@@ -129,8 +137,6 @@ export default function FamilyAcc() {
     };
   }, [listReload, memberList]);
 
-  console.log("Family List ====>", familyList.length);
-
   return (
     <Layout>
       {/*<CommonHead />*/}
@@ -145,16 +151,16 @@ export default function FamilyAcc() {
                 >
                   Family Accounts
                 </span>
-                {(familyList.length <
-                  process.env.REACT_APP_MAX_FAMILY_MEMBERS && !loader) && (
-                  <button
-                    onClick={popUpHandler}
-                    type="button"
-                    className="text-white btn-gradient text-lg tracking-wide px-5 py-2 rounded-full"
-                  >
-                    Add
-                  </button>
-                )}
+                {familyList.length < process.env.REACT_APP_MAX_FAMILY_MEMBERS &&
+                  !loader && (
+                    <button
+                      onClick={popUpHandler}
+                      type="button"
+                      className="text-white btn-gradient text-lg tracking-wide px-5 py-2 rounded-full"
+                    >
+                      Add
+                    </button>
+                  )}
               </h1>
             </div>
             <div className="slider-btns flex space-x-4">
@@ -178,9 +184,10 @@ export default function FamilyAcc() {
           <FamilyForm
             popUpHandler={popUpHandler}
             value={formData}
-            ageHandler={handleAgeSelect}
-            ageRange={ageRange}
-            ageValue={selectedAge}
+            selectedYear={selectedYear}
+            selectedMonth={selectedMonth}
+            monthHandler={handleMonthChange}
+            yearHandler={handleYearChange}
             inputHandler={handleInputChange}
             msgErr={msgErr}
             onClick={addMember}
@@ -196,8 +203,10 @@ const FamilyForm = ({
   value: { first_name, last_name },
   ageValue,
   inputHandler,
-  ageHandler,
-  ageRange,
+  selectedMonth,
+  selectedYear,
+  monthHandler,
+  yearHandler,
   msgErr,
   loader,
   onClick,
@@ -242,33 +251,22 @@ const FamilyForm = ({
           value={last_name}
           inputHandler={inputHandler}
         />
-        <div className="input-com mb-7 flex gap-1 items-center w-full justify-between">
+        <div className="input-com mb-7 flex flex-col gap-1 w-full">
           {/* Age dropdown */}
-          <div className="flex items-center justify-between flex-[0.3]">
+          <div className="">
             <label
               className="input-label text-[#181c32] dark:text-white text-[15px] font-semibold"
               htmlFor="age-selection"
             >
-              Select your age:
+              Birthday: (Year/Month)
             </label>
           </div>
-          <div className=" flex-[0.7] max-w-[150px]">
-            <select
-              name="age-selection"
-              id="age-selection"
-              className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-[35px] h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent px-4"
-              onChange={ageHandler}
-              value={ageValue}
-            >
-              <option value={""}>Select age</option>
-              {ageRange?.length > 0 &&
-                ageRange?.map((age) => (
-                  <option value={age} key={age}>
-                    {age}
-                  </option>
-                ))}
-            </select>
-          </div>
+          <YearMonthDropdowns
+            handleMonthChange={monthHandler}
+            handleYearChange={yearHandler}
+            selectedMonth={selectedMonth}
+            selectedYear={selectedYear}
+          />
         </div>
         {msgErr && (
           <div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-xs font-light leading-[19.5px]">
@@ -317,3 +315,66 @@ const CloseIcon = () => (
     />
   </svg>
 );
+
+function YearMonthDropdowns({
+  selectedMonth,
+  selectedYear,
+  handleMonthChange,
+  handleYearChange,
+}) {
+  // Get the current year
+  const currentYear = new Date().getFullYear();
+
+  // Generate an array of years from the current year to (currentYear - 19)
+  const years = Array.from({ length: 17 }, (_, index) => currentYear - index);
+
+  // Array of month names
+  const months = [
+    "January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December",
+  ];
+
+  return (
+    <div className="flex max-w-[330px] w-full self-end gap-4">
+      <select
+        id="yearDropdown"
+        value={selectedYear}
+        onChange={handleYearChange}
+        className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-56 rounded-[35px] h-10 overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent px-4"
+        // size="5"
+      >
+        <option value="">Select a Year</option>
+        {years.map((year) => (
+          <option key={year} value={year}>
+            {year}
+          </option>
+        ))}
+      </select>
+
+      <select
+        id="monthDropdown"
+        value={selectedMonth}
+        onChange={handleMonthChange}
+        className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-56 rounded-[35px] h-10 overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent px-4"
+        // size="5"
+      >
+        <option value="">Select a Month</option>
+        {months.map((month, index) => (
+          <option key={month} value={index + 1}>
+            {month}
+          </option>
+        ))}
+      </select>
+    </div>
+  );
+}

src/components/Home/FullAccountDash.jsx

@@ -8,9 +8,11 @@ import { useSelector } from "react-redux";
 // import TopSellerTopBuyerSliderSection from "./TopSellerTopBuyerSliderSection";
 //import UpdateTable from "./UpdateTable";
 import HomeActivities from "./HomeActivities";
+import MyOffersTable from "../MyTasks/MyOffersTable";
 
 export default function FullAccountDash(props) {
   console.log("PROPS IN HOME->", props);
+
   const { userDetails } = useSelector((state) => state?.userDetails);
 
   return (
@@ -22,7 +24,16 @@ export default function FullAccountDash(props) {
           bannerList={props.bannerList}
           nextDueTask={props.nextDueTask}
         />
-        <HomeActivities className="mb-10" />
+        {props.offersList?.data?.result_list?.length ?
+          <MyOffersTable
+            MyActiveOffersList={props.offersList?.data}
+            className="mb-10"
+          />
+        : !props.offersList?.loading ?
+          <HomeActivities className="mb-10" />
+        :
+        null
+        }
         {/*<UpdateTable className="mb-10"/>*/}
         {/*<SellHistoryMarketVisitorAnalytic className="mb-10"/>*/}
         {/*<TopSellerTopBuyerSliderSection className="mb-10" />*/}

src/components/Home/index.jsx

@@ -12,7 +12,7 @@ export default function Home(props) {
   const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
 
   let [nextDueTask, setNextDueTask] = useState({});
-  const [MyOffersList, setMyOffersList] = useState([]);
+  const [MyOffersList, setMyOffersList] = useState({loading: true, data: []});
 
   const { userDetails } = useSelector((state) => state?.userDetails);
 
@@ -47,8 +47,9 @@ export default function Home(props) {
   const getMyOffersList = async () => {
     try {
       const res = await userApi.getOffersList();
-      setMyOffersList(res.data?.result_list);
+      setMyOffersList({loading:false, data:res.data});
     } catch (error) {
+      setMyOffersList({loading:false, data:[]});
       console.log("Error getting offers", error);
     }
   };
@@ -72,13 +73,14 @@ export default function Home(props) {
           <FamilyDash
             account={userDetails}
             commonHeadData={props.bannerList}
-            familyOffers={MyOffersList}
+            familyOffers={MyOffersList?.data?.result_list}
             MyActiveJobList={MyActiveJobList}
           />
         ) : userDetails && userDetails?.account_type == "FULL" ? (
           <FullAccountDash
             nextDueTask={nextDueTask}
             bannerList={props.bannerList}
+            offersList={MyOffersList}
           />
         ) : (
           <div>

src/components/MyPendingJobs/DeleteTaskModal.jsx

@@ -6,7 +6,7 @@ import LoadingSpinner from "../Spinners/LoadingSpinner";
 import { useDispatch } from "react-redux";
 
 
-function DeleteTaskModal({ details, onClose, situation }) {
+function DeleteTaskModal({ details, onClose, situation, setReloadList }) {
   let dispatch = useDispatch();
   const navigate = useNavigate();
   const ApiCall = new usersService();
@@ -19,10 +19,33 @@ function DeleteTaskModal({ details, onClose, situation }) {
 
   // FUNCTION TO DELETE TASK
   const deleteTask = () => {
-    setRequestStatus(prev => ({...prev, loading:true, message: 'No API Yet'}))
-    setTimeout(()=>{
-        setRequestStatus(prev => ({...prev, loading:false, message: ''}))
-    },3000)
+    setRequestStatus({loading:true, status:false, message: ''})
+
+    let reqData = { // REQUEST PAYLOAD
+      suggest_uid: details.uid,
+      suggest_action: 555,
+      offset: 0
+    }
+    ApiCall.suggestStatus(reqData).then((response)=>{ // API CALL TO DELETE SUGGESTED TASK
+      let {data} = response
+      if(data.internal_return < 0){
+        setRequestStatus({loading:false, status:false, message: 'Unable to delete, Try again'})
+        return setTimeout(()=>{
+            setRequestStatus({loading:false, status:false, message: ''})
+        },3000)
+      }
+      setRequestStatus({loading:false, status:true, message: 'Family Suggest Deleted'})
+      setReloadList(prev => !prev) // RELOADS THE FAMILY SUGGEST LIST TABLE
+      setTimeout(()=>{
+          setRequestStatus({loading:false, status:false, message: ''})
+          onClose()
+      },3000)
+    }).catch(error => {
+      setRequestStatus({loading:false, status:false, message: 'Unable to delete, Try again'})
+      setTimeout(()=>{
+          setRequestStatus({loading:false, status:false, message: ''})
+      },3000)
+    })
   }
 
   return (
@@ -91,7 +114,7 @@ function DeleteTaskModal({ details, onClose, situation }) {
             >
               <span className="text-gradient">Cancel</span>
             </button>
-            {requestStatus.laoding ? (
+            {requestStatus.loading ? (
               <LoadingSpinner size="8" color="sky-blue" />
             ) : (
               <button

src/components/MyPendingJobs/ParentWaitingTable.jsx

@@ -36,6 +36,8 @@ export default function ParentWaitingTable() {
 
     const apiCall = new usersService()
 
+    let [reloadList, setReloadList] = useState(false) // STATE TO DETERMINE WHEN TO RELOAD THE FAMILY SUGGEST LIST
+
     let [deleteTaskPopout, setDeleteTaskPopout] = useState({show:false, data:{}}) // HOLDS THE INFO OF DELETE TASK POPOUT
     let [sendReminderPopout, setSendReminderPopout] = useState({show:false, data:{}}) // HOLDS THE INFO OF SEND REMINDER POPOUT
 
@@ -58,7 +60,7 @@ export default function ParentWaitingTable() {
             setFamilySuggestList({loading: false, data:[]})
             console.log('ERROR==>Familysuggestlist', err)
         })
-    },[])
+    },[reloadList])
 
     return (
         <div className="rounded-2xl bg-white dark:bg-dark-white flex flex-col justify-between">
@@ -112,7 +114,7 @@ export default function ParentWaitingTable() {
                                             </p>
                                         </div>
                                     </div>
-                                    <div className="flex justify-start items-end px-2 gap-1">
+                                    <div className="min-w-[120px] flex justify-start items-end px-2 gap-1">
                                         <button
                                             type="button"
                                             className="p-1 border-2 border-red-400 rounded-md"
@@ -159,6 +161,7 @@ export default function ParentWaitingTable() {
                         setDeleteTaskPopout({ show: false, data: {} });
                     }}
                     situation={deleteTaskPopout.show}
+                    setReloadList={setReloadList}
                     />
                 )}
                 {/* END of Delete Task Popout */}
@@ -171,6 +174,7 @@ export default function ParentWaitingTable() {
                         setSendReminderPopout({ show: false, data: {} });
                     }}
                     situation={sendReminderPopout.show}
+                    setReloadList={setReloadList}
                     />
                 )}
                 {/* END of Send Reminder Popout */}

src/components/MyPendingJobs/SendReminderModal.jsx

@@ -6,8 +6,7 @@ import LoadingSpinner from "../Spinners/LoadingSpinner";
 import { useDispatch } from "react-redux";
 
 
-function SendReminderModal({ details, onClose, situation }) {
-
+function SendReminderModal({ details, onClose, situation, setReloadList }) {
   let dispatch = useDispatch();
   const navigate = useNavigate();
   const ApiCall = new usersService();
@@ -20,10 +19,33 @@ function SendReminderModal({ details, onClose, situation }) {
 
   // FUNCTION TO SEND REMINDER
   const sendReminder = () => {
-    setRequestStatus(prev => ({...prev, loading:true, message: 'No API Yet'}))
-    setTimeout(()=>{
-        setRequestStatus(prev => ({...prev, loading:false, message: ''}))
-    },3000)
+    setRequestStatus({loading:true, status:false, message: ''})
+
+    let reqData = { // REQUEST PAYLOAD
+      suggest_uid: details.uid,
+      suggest_action: 222,
+      offset: 0
+    }
+    ApiCall.suggestStatus(reqData).then((response)=>{ // API CALL TO DELETE SUGGESTED TASK
+      let {data} = response
+      if(data.internal_return < 0){
+        setRequestStatus({loading:false, status:false, message: 'Unable to send reminder, Try again1111'})
+        return setTimeout(()=>{
+            setRequestStatus({loading:false, status:false, message: ''})
+        },3000)
+      }
+      setRequestStatus({loading:false, status:true, message: 'Reminder Sent'})
+      setReloadList(prev => !prev) // RELOADS THE FAMILY SUGGEST LIST TABLE
+      setTimeout(()=>{
+          setRequestStatus({loading:false, status:false, message: ''})
+          onClose()
+      },3000)
+    }).catch(error => {
+      setRequestStatus({loading:false, status:false, message: 'Unable to send reminder, Try againNETWORK'})
+      setTimeout(()=>{
+          setRequestStatus({loading:false, status:false, message: ''})
+      },3000)
+    })
   }
 
   return (
@@ -61,7 +83,7 @@ function SendReminderModal({ details, onClose, situation }) {
         </div>
         <div className="logout-modal-body w-full flex flex-col items-center p-8">
 
-        <div className="mb-6 w-full flex gap-4 items-start">
+        <div className="mb-6 w-full flex gap-4 items-center">
             <div className="icon max-w-[150px] min-w-[150px] max-h-[150px] min-h-[150px] flex justify-center items-center">
                 <img src={require(`../../assets/images/family/${details.banner || "default.jpg"}`)} alt="" className="w-full h-full" />
             </div>
@@ -73,27 +95,30 @@ function SendReminderModal({ details, onClose, situation }) {
                 <p className="text-sm mb-2 text-thin-light-gray font-medium">
                     {details.description}
                 </p>
+                {
+                  details.remind && 
                 <p className="text-xl font-bold text-dark-gray dark:text-white mb-2 capitalize line-clamp-1">
-                    Last Remind: 10-10-2025
+                    Last Remind: {new Date(details.remind).toLocaleString().split(',')[0]}
                 </p>
+                }
             </div>
         </div>
 
-          <div className="flex justify-between gap-4">
-            <button
+          <div className="w-full flex justify-end">
+            {/* <button
               onClick={onClose}
               type="button"
               className=" border-gradient text-18 tracking-wide px-4 py-3 rounded-full"
             >
               <span className="text-gradient">Cancel</span>
-            </button>
-            {requestStatus.laoding ? (
+            </button> */}
+            {requestStatus.loading ? (
               <LoadingSpinner size="8" color="sky-blue" />
             ) : (
               <button
                 onClick={() => sendReminder(details)}
                 type="button"
-                className="text-white primary-gradient text-18 tracking-wide px-4 py-3 rounded-full"
+                className="text-white bg-sky-blue text-18 tracking-wide px-4 py-3 rounded-full"
               >
                 Send Reminder
               </button>

src/services/UsersService.js

@@ -1064,6 +1064,19 @@ class usersService {
     return this.postAuxEnd("/blogdata", postData);
   }
 
+
+    // FUNCTION TO CANCEL TASK OR SEND REMINDER BY FAMILY MEMBER
+    suggestStatus(reqData) {
+      var postData = {
+        uid: localStorage.getItem("uid"),
+        member_id: localStorage.getItem("member_id"),
+        sessionid: localStorage.getItem("session_token"),
+        action: 22026,
+        ...reqData,
+      };
+      return this.postAuxEnd("/suggeststatus", postData);
+    }
+
   /*
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(username)
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(password)