changed payment to purchase

src/components/AuthPages/Login/index.jsx

@@ -17,10 +17,6 @@ import { updateUserDetails } from "../../../store/UserDetails";
 import ReCAPTCHA from "react-google-recaptcha";
 
 export default function Login() {
-
-  const queryParams = new URLSearchParams(location?.search);
-  const sessionExpired = queryParams.get("sessionExpired")
-
   const dispatch = useDispatch();
   const { state } = useLocation();
 
@@ -260,13 +256,6 @@ export default function Login() {
                 </span>
               </div>
 
-              {/* SHOWS THIS IF USER SESSION HAS EXPIRED */}
-              {sessionExpired == 'true' &&
-              <div className="w-full p-1">
-                <p className="text-red-500 text-sm text-center">Your session expired and will need to login again</p>
-              </div>
-              }
-
               {/* switch login component */}
               <div className="ml-7 flex justify-start items-center gap-3">
                 <button

src/components/FamilyAcc/index.jsx

@@ -5,7 +5,7 @@ import React, {
   useMemo,
   useState,
 } from "react";
-import usersService from "../../services/UsersService";
+import SiteService from "../../services/SiteService";
 import InputCom from "../Helpers/Inputs/InputCom";
 import ModalCom from "../Helpers/ModalCom";
 import Layout from "../Partials/Layout";
@@ -27,7 +27,7 @@ export default function FamilyAcc() {
     last_name: "",
   });
 
-  const apiCall = useMemo(() => new usersService(), []);
+  const apiCall = useMemo(() => new SiteService(), []);
 
   const popUpHandler = () => {
     setPopUp((prev) => !prev);

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

@@ -16,6 +16,7 @@ function PurchasesTable({purchase}) {
 
   return (
     <div className='flex flex-col justify-between min-h-[500px]'>
+        {purchase.data.length ?
         <table className="wallet-activity w-full table-auto border-collapse text-left">
             <thead className='border-b-2'>
                 <tr className='text-slate-600'>
@@ -24,8 +25,6 @@ function PurchasesTable({purchase}) {
                 <th className="p-2">Fee</th>
                 </tr>
             </thead>
-        {purchase.data.length ?
-        (
             <tbody>
                 {currentPurchase.map((item, index) => (
                 <tr key={index} className='text-slate-500'>
@@ -37,24 +36,16 @@ function PurchasesTable({purchase}) {
                 </tr>
                 ))}
             </tbody>
-        )
-        :
-        purchase.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 Purchase History Found!</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>
+        :
+        <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
+            <span>No Purchase History Found!</span>
+        </div> 
+        }
 
     {/* 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,6 +19,7 @@ function RecentActivityTable({ payment }) {
 
   return (
     <div className="flex flex-col justify-between min-h-[500px]">
+      {payment?.data?.length > 0 ? 
         <table className="wallet-activity w-full table-auto border-collapse text-left">
           <thead className="border-b-2">
             <tr className="text-slate-600">
@@ -28,7 +29,6 @@ function RecentActivityTable({ payment }) {
               <th className="p-2">Status</th>
             </tr>
           </thead>
-        {payment?.data?.length > 0 ? (
           <tbody>
             {currentActivity.map((item, index) => (
               <tr key={index} className="text-slate-500">
@@ -46,24 +46,16 @@ function RecentActivityTable({ payment }) {
               </tr>
             ))}
           </tbody>
-        ) : payment?.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 Payment History Found!
-              </td>
-            </tr>
-          </tbody>
-        )}
         </table>
+      :payment.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 Payment History Found!</span>
+        </div> 
+      }
 
       {/* PAGINATION BUTTON */}
       <PaginatedList

src/components/jobPopout/JobListPopout.jsx

@@ -1,7 +1,7 @@
 import { Field, Form, Formik } from "formik";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import * as Yup from "yup";
-import usersService from "../../services/UsersService";
+import SiteService from "../../services/SiteService";
 import InputCom from "../Helpers/Inputs/InputCom/index";
 import ModalCom from "../Helpers/ModalCom";
 import LoadingSpinner from "../Spinners/LoadingSpinner";
@@ -36,7 +36,7 @@ const dispatch = useDispatch()
     },
   });
 
-  const apiCall = useMemo(() => new usersService(), []);
+  const apiCall = useMemo(() => new SiteService(), []);
 
   // member listing
   const memberList = useCallback(async () => {

src/services/UsersService.js

@@ -1237,10 +1237,6 @@ class usersService {
         console.log(response);
         // res = response;
         console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
-        if(response.data.internal_return == '-9999'){
-          localStorage.clear()
-          window.location.href=`/login?sessionExpired=true`
-        }
         return response;
       })
       .catch((error) => {