Merge master into edit-job-add-image

src/Routers.jsx

@@ -49,6 +49,7 @@ import MyWaitingJobsPage from "./views/MyWaitingJobsPage";
 import FamilyMarketPage from "./views/FamilyMarketPage";
 import FacebookRedirect from "./views/FacebookRedirect";
 import AppleRedirectPage from "./views/AppleRedirectPage";
+import LndPage from "./views/LndPage";
 
 export default function Routers() {
   return (
@@ -76,6 +77,7 @@ export default function Routers() {
         <Route path="/vemail" element={<VerifyLinkPages />} />
         <Route path="/complereset" element={<VerifyPasswordPages />} />
         <Route exact path="/outmessage" element={<VerifyYouPages />} />
+        <Route exact path="/lnd/*" element={<LndPage />} />
 
         {/* private route */}
         <Route element={<AuthRoute />}>

src/components/Lnd/Lnd.jsx

@@ -0,0 +1,27 @@
+import React, { useEffect, useState } from 'react'
+import Layout from '../Partials/Layout'
+
+import LoadingSpinner from '../Spinners/LoadingSpinner'
+
+function Lnd() {
+
+  const [reqStatus, setReqStatus] = useState({loading:true, data: []})
+
+  useEffect(()=>{
+    const timer = setTimeout(()=>{
+      setReqStatus({loading:false, data: []})
+    },2000)
+    return () => clearTimeout(timer)
+  }, [])
+  return (
+    <>
+      {reqStatus.loading ?
+        <LoadingSpinner color='sky-blue' size='32' height='min-h-screen' />
+      :
+        <div className='min-h-screen flex flex-col justify-center items-center'>Empty Dummy Page</div>
+      }
+    </>
+  )
+}
+
+export default Lnd

src/components/jobPopout/EditJobPopout.jsx

@@ -52,6 +52,18 @@ const EditJobPopOut = ({
 }) => {
   const dispatch = useDispatch();
 
+  const [taskImage, setTaskImage] = useState('')
+
+  const changeTaskImage = (e) => {
+    if (e.target.value !== "") {
+      const imgReader = new FileReader();
+      imgReader.onload = (event) => {
+        setTaskImage(event.target.result);
+      };
+      imgReader.readAsDataURL(e.target.files[0]);
+    }
+  }
+
   let [requestStatus, setRequestStatus] = useState({
     loading: false,
     status: false,
@@ -138,7 +150,7 @@ const EditJobPopOut = ({
             </svg>
           </button>
         </div>
-        <div className="logout-modal-body w-full flex flex-col items-center px-10 py-8">
+        <div className="logout-modal-body w-full flex flex-col items-center px-10 pb-8 pt-2">
           <Formik
             initialValues={initialValues}
             validationSchema={validationSchema}
@@ -279,43 +291,67 @@ const EditJobPopOut = ({
                         </div>
                       </div>
                     </div>
-
+                    <div className="w-full flex items-center gap-2 mb-2">
-                    <div className="field w-full mb-6">
+                      {/* FOR TASK IMAGE */}
-                      <div
+                      <div className="w-1/2 relative max-h-[130px] min-h-[130px]">
-                        className={`flex items-center justify-between mb-2.5`}
+                        <input 
-                      >
+                          id="task_image"
+                          className="hidden" 
+                          type="file" 
+                          accept="image/*" 
+                          onChange={changeTaskImage}
+                        />
+                        {taskImage ?
+                        <div className="w-full absolute -top-5">
+                          <img src={taskImage} className="max-h-[150px] min-h-[150px] w-full object-cover" alt="uplaoded task image" />
+                          <span onClick={()=>setTaskImage('')} className="p-2 absolute text-sm top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-white/20 hover:bg-white/70 hover:shadow-md transition-all duration-500 cursor-pointer text-slate-800">Remove Image</span>
+                        </div>
+                        :
                         <label 
-                          className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
+                          className="absolute -top-5 h-[150px] w-full flex flex-col justify-center items-center bg-slate-100 dark:bg-[#11131F] cursor-pointer input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold" htmlFor='task_image'>
-                          htmlFor="timeline_days"
+                            Select Task Image
-                        >
-                          Timeline
-                          <span className="text-green-700 text-sm tracking-wide">
-                            - Expected duration of this task
-                          </span>
                         </label>
+                        }
                       </div>
+                      {/* END OF TASK IMAGE */}
 
-                      <Field
+                      <div className="field w-1/2">
-                        component="select"
+                        <div
-                        name="timeline_days"
+                          className={`flex items-center justify-between`}
-                        className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none ${
+                        >
-                          props.errors.timeline_days &&
+                          <label
-                          props.touched.timeline_days
+                            className="w-full input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex flex-col"
-                            ? "border-[#ff0a0a63] shadow-red-500 border-[0.5px] animate-shake"
+                            htmlFor="timeline_days"
-                            : "border border-[#f5f8fa] dark:border-[#5e6278]"
-                        }`}
-                        value={props.values.timeline_days}
-                      >
-                        <option value="">Select Duration</option>
-                        {publicArray.map(({ name, duration }, idx) => (
-                          <option
-                            className="text-slate-500 text-lg"
-                            value={duration}
                           >
-                            {name}
+                            Timeline -
-                          </option>
+                            <span className="w-full text-center text-green-700 text-sm tracking-wide">
-                        ))}
+                              Expected duration of this task
-                      </Field>
+                            </span>
+                          </label>
+                        </div>
+
+                        <Field
+                          component="select"
+                          name="timeline_days"
+                          className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none ${
+                            props.errors.timeline_days &&
+                            props.touched.timeline_days
+                              ? "border-[#ff0a0a63] shadow-red-500 border-[0.5px] animate-shake"
+                              : "border border-[#f5f8fa] dark:border-[#5e6278]"
+                          }`}
+                          value={props.values.timeline_days}
+                        >
+                          <option value="">Select Duration</option>
+                          {publicArray.map(({ name, duration }, idx) => (
+                            <option
+                              className="text-slate-500 text-lg"
+                              value={duration}
+                            >
+                              {name}
+                            </option>
+                          ))}
+                        </Field>
+                      </div>
                     </div>
                     {/* inputs ends here */}
                   </div>

src/components/jobPopout/PendingJobsPopout.jsx

@@ -24,6 +24,7 @@ function PendingJobsPopout({ details, onClose, situation }) {
   const [pendingJobLoader, setPendingJobLoader] = useState({
     extend: false,
     offer: false,
+    cancel: false,
   });
 
   let [requestMessage, setRequestMessage] = useState({
@@ -81,6 +82,28 @@ function PendingJobsPopout({ details, onClose, situation }) {
             setRequestMessage({ status: false, message: "" });
           }, 3000);
         });
+    } else if (name == "cancel") {
+      // RUNS THIS IF JOB OFFER IS CANCELLED
+      reqData = { ...pendingData, reason: "cancel", offer_result: 3333 };
+      setPendingJobLoader({ cancel: true });
+      apiCall
+        .pendingCancelOffer(reqData)
+        .then((res) => {
+          setRequestMessage({ status: true, message: res.data.status });
+          setTimeout(() => {
+            setPendingJobLoader({ cancel: false });
+            setRequestMessage({ status: false, message: "" });
+            onClose();
+            dispatch(tableReload({ type: "PENDINGTABLE" }));
+          }, 4000);
+        })
+        .catch((error) => {
+          setRequestMessage("Try Again");
+          setTimeout(() => {
+            setPendingJobLoader({ cancel: false });
+            setRequestMessage({ status: false, message: "" });
+          }, 3000);
+        });
     } else return;
     // try {
     //   if (name === "extend") {
@@ -274,9 +297,16 @@ function PendingJobsPopout({ details, onClose, situation }) {
             <div className="mt-10 md:mt-32 md:flex md:justify-center">
               <button
                 className="px-2 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
-                onClick={onClose}
+                onClick={handlePendingJobsBtn}
+                name="cancel"
               >
-                Cancel Offer
+                {pendingJobLoader.cancel ? (
+                  <div className="w-[96px] flex justify-center items-center h-full">
+                    <LoadingSpinner size={5} color="sky-blue" />
+                  </div>
+                ) : (
+                  "Cancel Offer"
+                )}
               </button>
             </div>
           </div>

src/services/UsersService.js

@@ -19,6 +19,16 @@ class usersService {
     return this.postAuxEnd("/completesignuplink", reqData);
   }
 
+  assignJobTask(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      ...reqData,
+    };
+    return this.postAuxEnd("/assigntask", postData);
+  }
+
   // FUNCTION TO GET USER CURRENT TASK DUE TIME
   getHomeDate() {
     var postData = {
@@ -30,12 +40,12 @@ class usersService {
     return this.postAuxEnd("/dashdata", postData);
   }
 
-  getRecentActivities(){
+  getRecentActivities() {
     var postData = {
       uid: localStorage.getItem("uid"),
       member_id: localStorage.getItem("member_id"),
       sessionid: localStorage.getItem("session_token"),
-      action: 11202
+      action: 11202,
     };
     return this.postAuxEnd("/recentactivities", postData);
   }
@@ -368,7 +378,7 @@ class usersService {
       page: 0,
       offset: 0,
       limit: 100,
-      allstatus: 0
+      allstatus: 0,
     };
     return this.postAuxEnd("/activetaskslist", postData);
   }
@@ -598,7 +608,7 @@ class usersService {
       sessionid: localStorage.getItem("session_token"),
       page: 0,
       limit: 100,
-      ...reqdata
+      ...reqdata,
     };
     return this.postAuxEnd("/familyupdate", postData);
   }
@@ -782,6 +792,17 @@ class usersService {
     return this.postAuxEnd("/pendingjobsendtome", postData);
   }
 
+  pendingCancelOffer(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 13043,
+      ...reqData,
+    };
+    return this.postAuxEnd("/pendingjobcancel", postData);
+  }
+
   // FUNCTION TO GET ACTIVE JOB MESSAGE LIST
   activeJobMesList(reqData) {
     var postData = {
@@ -1078,52 +1099,51 @@ 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);
+  }
 
-    // FUNCTION TO CANCEL TASK OR SEND REMINDER BY FAMILY MEMBER
+  // FUNCTION TO GET FAMILY WALLET
-    suggestStatus(reqData) {
+  getFamilyWallet(reqData) {
-      var postData = {
+    var postData = {
-        uid: localStorage.getItem("uid"),
+      uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
+      member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
+      sessionid: localStorage.getItem("session_token"),
-        action: 22026,
+      action: 22012,
-        ...reqData,
+      ...reqData,
-      };
+    };
-      return this.postAuxEnd("/suggeststatus", postData);
+    return this.postAuxEnd("/familywallet", postData);
-    }
+  }
 
-    // FUNCTION TO GET FAMILY WALLET
+  // FUNCTION TO START FAMILY TRANSFER
-    getFamilyWallet(reqData) {
+  familyTransferStart(reqData) {
-      var postData = {
+    var postData = {
-        uid: localStorage.getItem("uid"),
+      uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
+      member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
+      sessionid: localStorage.getItem("session_token"),
-        action: 22012,
+      ...reqData,
-        ...reqData,
+    };
-      };
+    return this.postAuxEnd("/familytransferstart", postData);
-      return this.postAuxEnd("/familywallet", postData);
+  }
-    }
 
-    // FUNCTION TO START FAMILY TRANSFER
+  // FUNCTION TO PERFORM FAMILY TRANSFER
-    familyTransferStart(reqData) {
+  familyTransfer(reqData) {
-      var postData = {
+    var postData = {
-        uid: localStorage.getItem("uid"),
+      uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
+      member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
+      sessionid: localStorage.getItem("session_token"),
-        ...reqData,
+      ...reqData,
-      };
+    };
-      return this.postAuxEnd("/familytransferstart", postData);
+    return this.postAuxEnd("/familytransfer", postData);
-    }
+  }
-
-    // FUNCTION TO PERFORM FAMILY TRANSFER
-    familyTransfer(reqData) {
-      var postData = {
-        uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
-        ...reqData,
-      };
-      return this.postAuxEnd("/familytransfer", postData);
-    }
 
   /*
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(username)
@@ -1237,9 +1257,9 @@ class usersService {
         console.log(response);
         // res = response;
         console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
-        if(response.data.internal_return == '-9999'){
+        if (response.data.internal_return == "-9999") {
-          localStorage.clear()
+          localStorage.clear();
-          window.location.href=`/login?sessionExpired=true`
+          window.location.href = `/login?sessionExpired=true`;
         }
         return response;
       })

src/views/LndPage.jsx

@@ -0,0 +1,13 @@
+import React from 'react'
+
+import Lnd from '../components/Lnd/Lnd'
+
+function LndPage() {
+  return (
+    <>
+        <Lnd />
+    </>
+  )
+}
+
+export default LndPage