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/AuthPages/Login/index.jsx

@@ -245,6 +245,9 @@ export default function Login() {
           </div>
           <div className="content-wrapper login shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5">
             <div className="w-full">
+              
+              {/* HIDES THIS IF USER SESSION HAS EXPIRED */}
+              {sessionExpired != 'true' &&
               <div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
                 {/* <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
                   Sign In to WrenchBoard
@@ -259,11 +262,12 @@ export default function Login() {
                   </Link>
                 </span>
               </div>
+              }
               
               {/* SHOWS THIS IF USER SESSION HAS EXPIRED */}
               {sessionExpired == 'true' &&
-              <div className="w-full p-1">
+              <div className="w-full p-1 mb-7">
-                <p className="text-red-500 text-sm text-center">Your session expired and will need to login again</p>
+                <p className="text-red-500 text-base text-center">Your session expired and will need to login again</p>
               </div>
               }
 

src/components/FamilyAcc/FamilyTable.jsx

@@ -147,8 +147,8 @@ export default function FamilyTable({
               <path
                 fill-rule="evenodd"
                 d="M.366 19.708c.405.39 1.06.39 1.464 0l8.563-8.264a1.95 1.95 0 0 0 0-2.827L1.768.292A1.063 1.063 0 0 0 .314.282a.976.976 0 0 0-.011 1.425l7.894 7.617a.975.975 0 0 1 0 1.414L.366 18.295a.974.974 0 0 0 0 1.413"
-                fill="#4687ba"
+                // fill=""
-                className="color000000 svgShape"
+                className="color000000 svgShape fill-[#fff]"
               ></path>
             </svg>
           </button>

src/components/History/RewardsTable.jsx

@@ -50,7 +50,7 @@ function RewardsTable() {
     <div className='flex flex-col justify-between min-h-[500px]'>
     {familyRewardHistory.loading ? 
     <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
-    :
+    : familyRewardHistory.data.length ?
     <table className="wallet-activity w-full table-auto border-collapse text-left">
         <thead className='border-b-2'>
             <tr className='text-slate-600'>
@@ -60,8 +60,6 @@ function RewardsTable() {
             <th className="p-2">Confirmation</th>
             </tr>
         </thead>
-        {familyRewardHistory.data.length ?
-        (
         <tbody>
             {currentReward.map((item, index) => {
                 let date = new Date(item.added).toLocaleDateString()
@@ -84,24 +82,15 @@ function RewardsTable() {
             }
             )}
         </tbody>
-        )
-        :
-        familyRewardHistory.error ? 
-        (
-        <tbody>
-            <tr className='text-slate-500'>
-                <td className="p-2" colSpan={4}>Opps! an error occurred. Please try again!</td>
-            </tr>
-        </tbody>
-        )
-        :
-        <tbody>
-            <tr className='text-slate-500'>
-                <td className="p-2" colSpan={4}>No Rewards History Found!</td>
-            </tr>
-        </tbody>
-        }
     </table>
+    :familyRewardHistory.error ?
+    <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
+        <span>Opps! an error occurred. Please try again!</span>
+    </div>
+    :
+    <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
+        <span>No Rewards History Found!</span>
+    </div>
     }
 
     {/* PAGINATION BUTTON */}

src/components/History/index.jsx

@@ -255,9 +255,9 @@ export default function History() {
                     {/* PURCHASE SECTION */}
                     {tab == 'purchases' &&
                         <div className="wallet w-full border-t">
-                            <h1 className="p-2 text-xl font-bold text-dark-gray dark:text-white tracking-wide">Purchases</h1>
+                            {/* <h1 className="p-2 text-xl font-bold text-dark-gray dark:text-white tracking-wide">Purchases</h1> */}
                             {purchaseHistory.loading ? 
-                            <LoadingSpinner size='16' color='sky-blue' />
+                            <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
                             :
                             <PurchasesTable purchase={purchaseHistory} />
                             }
@@ -268,10 +268,10 @@ export default function History() {
                     {/* RECENT ACTIVITY SECTION */}
                     {tab == 'recent' &&
                         <div className="wallet w-full border-t">
-                            <h1 className="p-2 text-xl font-bold text-dark-gray dark:text-white tracking-wide">Recent Activity</h1>
+                            {/* <h1 className="p-2 text-xl font-bold text-dark-gray dark:text-white tracking-wide">Recent Activity</h1> */}
                             {/* <p className='text-base text-slate-500 dark:text-white'>Activity Report</p> */}
                             {paymentHistory.loading ? 
-                            <LoadingSpinner size='16' color='sky-blue' />
+                            <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
                             :
                             <RecentActivityTable payment={paymentHistory} />
                         }

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/MyWallet/WalletComponent/PurchasesTable.jsx

@@ -16,45 +16,36 @@ function PurchasesTable({purchase}) {
 
   return (
     <div className='flex flex-col justify-between min-h-[500px]'>
-    <table className="wallet-activity w-full table-auto border-collapse text-left">
-        <thead className='border-b-2'>
-            <tr className='text-slate-600'>
-            <th className="p-2">Trx.</th>
-            <th className="p-2">Amount</th>
-            <th className="p-2">Fee</th>
-            </tr>
-        </thead>
         {purchase.data.length ?
-        (
+        <table className="wallet-activity w-full table-auto border-collapse text-left">
-        <tbody>
+            <thead className='border-b-2'>
-            {currentPurchase.map((item, index) => (
+                <tr className='text-slate-600'>
-            <tr key={index} className='text-slate-500'>
+                <th className="p-2">Trx.</th>
-                <td className="p-2">{item.added_date}<br />
+                <th className="p-2">Amount</th>
-                   <b>{item.confirmation} </b>
+                <th className="p-2">Fee</th>
-                </td>
+                </tr>
-                <td className="p-2">{item.amount}</td>
+            </thead>
-                <td className="p-2">{item.fee}</td>
+            <tbody>
-            </tr>
+                {currentPurchase.map((item, index) => (
-            ))}
+                <tr key={index} className='text-slate-500'>
-        </tbody>
+                    <td className="p-2">{item.added_date}<br />
-        )
+                    <b>{item.confirmation} </b>
+                    </td>
+                    <td className="p-2">{item.amount}</td>
+                    <td className="p-2">{item.fee}</td>
+                </tr>
+                ))}
+            </tbody>
+        </table>
+        :purchase.error ?
+        <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
+            <span>Opps! an error occurred. Please try again!</span>
+        </div>
         :
-        purchase.error ? 
+        <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
-        (
+            <span>No Purchase History Found!</span>
-        <tbody>
+        </div> 
-            <tr className='text-slate-500'>
-                <td className="p-2" colSpan={4}>Opps! an error occurred. Please try again!</td>
-            </tr>
-        </tbody>
-        )
-        :
-        <tbody>
-            <tr className='text-slate-500'>
-                <td className="p-2" colSpan={4}>No Purchase History Found!</td>
-            </tr>
-        </tbody>
         }
-    </table>
 
     {/* PAGINATION BUTTON */}
     <PaginatedList onClick={handlePagination} prev={currentPage == 0 ? true : false} next={currentPage+Number(process.env.REACT_APP_ITEM_PER_PAGE) >= purchase?.data?.length ? true : false} data={purchase?.data} start={indexOfFirstItem} stop={indexOfLastItem} />

src/components/MyWallet/WalletComponent/RecentActivityTable.jsx

@@ -19,16 +19,16 @@ function RecentActivityTable({ payment }) {
 
   return (
     <div className="flex flex-col justify-between min-h-[500px]">
-      <table className="wallet-activity w-full table-auto border-collapse text-left">
+      {payment?.data?.length > 0 ? 
-        <thead className="border-b-2">
+        <table className="wallet-activity w-full table-auto border-collapse text-left">
-          <tr className="text-slate-600">
+          <thead className="border-b-2">
-            <th className="p-2">Date</th>
+            <tr className="text-slate-600">
-            <th className="p-4">Trx.</th>
+              <th className="p-2">Date</th>
-            <th className="p-2">Amnt./Fee</th>
+              <th className="p-4">Trx.</th>
-            <th className="p-2">Status</th>
+              <th className="p-2">Amnt./Fee</th>
-          </tr>
+              <th className="p-2">Status</th>
-        </thead>
+            </tr>
-        {payment?.data?.length > 0 ? (
+          </thead>
           <tbody>
             {currentActivity.map((item, index) => (
               <tr key={index} className="text-slate-500">
@@ -46,24 +46,16 @@ function RecentActivityTable({ payment }) {
               </tr>
             ))}
           </tbody>
-        ) : payment?.error ? (
+        </table>
-          <tbody>
+      :payment.error ?
-            <tr className="text-slate-500">
+        <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
-              <td className="p-2" colSpan={4}>
+            <span>Opps! an error occurred. Please try again!</span>
-                Opps! an error occurred. Please try again!
+        </div>
-              </td>
+        :
-            </tr>
+        <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
-          </tbody>
+            <span>No Payment History Found!</span>
-        ) : (
+        </div> 
-          <tbody>
+      }
-            <tr className="text-slate-500">
-              <td className="p-2" colSpan={4}>
-                No Payment History Found!
-              </td>
-            </tr>
-          </tbody>
-        )}
-      </table>
 
       {/* PAGINATION BUTTON */}
       <PaginatedList

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