wallet refresh

public/assets/images/site.webmanifest

@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

src/components/Helpers/Inputs/InputCom/index.jsx

@@ -91,8 +91,8 @@ export default function InputCom({
           placeholder={placeholder}
           value={value}
           onChange={inputHandler}
-          className={`input-field placeholder:text-base text-dark-gray w-full h-full tracking-wide ${
-            inputBg ? inputBg : "bg-[#FAFAFA]"
+          className={`input-field placeholder:text-base text-dark-gray w-full h-full ${
+            inputBg ? inputBg : "bg-[#FAFAFA] tracking-wide"
           } dark:bg-[#11131F] focus:ring-0 focus:outline-none ${fieldClass}`}
           type={type}
           id={name}

src/components/MyWallet/Popup/ConfirmAddFund.jsx

@@ -1,6 +1,6 @@
 import { FlutterWaveButton, closePaymentModal } from "flutterwave-react-v3";
 import React, { useState } from "react";
-import { useDispatch } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
 import { toast } from "react-toastify";
 import usersService from "../../../services/UsersService";
@@ -99,6 +99,9 @@ function ConfirmAddFund({
       : __confirmData.card;
 
   const apiURL = new usersService();
+
+  const { userDetails } = useSelector((state) => state?.userDetails);
+
   const navigate = useNavigate();
   const dispatch = useDispatch();
 
@@ -112,7 +115,13 @@ function ConfirmAddFund({
     public_key: process.env.REACT_APP_FLUTTERWAVE_APIKEY,
     tx_ref: Date.now(),
     currency: "NGN",
+    amount: Number(__confirmData.amount),
     payment_options: "card,mobilemoney,ussd",
+    customer: {
+      email: userDetails.email,
+      phone_number: userDetails.phone,
+      name: `${userDetails.lastname} ${userDetails.firstname}`,
+    },
     customizations: {
       title: "WrenchBoard",
       description: "Topup Payment",
@@ -132,7 +141,7 @@ function ConfirmAddFund({
 
   const onSuccessPayment = () => {
     setRequestStatus({ message: "", loading: true, status: false });
-    const reqData = { amount: __confirmData?.account, currency: "NGN" };
+    const reqData = { amount: Number(__confirmData?.amount), currency: "NGN" };
 
     apiURL
       .startTopUp(reqData)
@@ -151,9 +160,12 @@ function ConfirmAddFund({
             status: true,
           });
           toast.success("Account Topup was successful");
-          setTimeout(() => {
-            navigate("/my-wallet", { replace: true });
-          }, 1000);
+          onClose()
+          dispatch(tableReload({ type: "WALLETTABLE" }));
+          navigate("/my-wallet", { replace: true });
+          // setTimeout(() => {
+          //   navigate("/my-wallet", { replace: true });
+          // }, 1000);
         }
       })
       .catch((err) => {
@@ -205,6 +217,7 @@ function ConfirmAddFund({
           },
           data: _response,
         }));
+        dispatch(tableReload({ type: "WALLETTABLE" }));
       }, 1500);
     } catch (error) {
       setConfirmCredit((prev) => ({
@@ -256,7 +269,6 @@ function ConfirmAddFund({
       }
       
       setTimeout(() => {
-        dispatch(tableReload({ type: "WALLETTABLE" }));
         setConfirmCredit((prev) => ({
           ...prev,
           show: {
@@ -265,6 +277,7 @@ function ConfirmAddFund({
           },
           data: _response,
         }));
+        dispatch(tableReload({ type: "WALLETTABLE" }));
       }, 1500);
     } catch (error) {
       setConfirmCredit((prev) => ({
@@ -278,8 +291,6 @@ function ConfirmAddFund({
     }
   };
 
-  // console.log(confirmCredit?.data);
-
   return (
     <div className="content-wrapper w-full h-[32rem]">
       <div className="w-full mb-10">

src/components/MyWallet/Popup/ConfirmNairaWithdraw.jsx

@@ -1,15 +1,20 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { toast } from "react-toastify";
+import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import ModalCom from "../../Helpers/ModalCom";
 import LoadingSpinner from "../../Spinners/LoadingSpinner";
 
-import usersService from "../../../services/UsersService";
-
-function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
+function ConfirmNairaWithdraw({
+  payment,
+  wallet,
+  action,
+  situation,
+  state,
+  setShowNairaWithdraw,
+}) {
   const apiURL = new usersService();
-
   const navigate = useNavigate();
 
   let [requestStatus, setRequestStatus] = useState({
@@ -25,19 +30,56 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
     let reqData = {
       amount: Number(state.amount * 100),
       Fee: Number(state.fee),
-      recipient_uid: Number(state.details?.recipient_uid),
       wallet_uid: wallet.wallet_uid,
     };
+
+    if (state?.choice === "prev") {
+      reqData.recipient_uid = state.details?.recipient_uid;
+    }
+
+    if (state?.choice === "new") {
+      reqData.account_no = state?.accountNumber;
+      reqData.account_type = state?.accountType;
+      reqData.bank_uid = state?.bank_uid;
+      reqData.country = state?.country;
+      reqData.state = state?.state;
+      reqData.city = state?.city;
+    }
+
     apiURL
       .sendMoney(reqData)
       .then((res) => {
         if (res.data.internal_return < 0) {
-          setRequestStatus({
-            message: "Could not perform transaction",
-            loading: false,
-            status: false,
-          });
-          return;
+          if (res.data?.status_message?.toLowerCase().includes("limit")) {
+            setRequestStatus({
+              message: "You have exceeded the transfer limit",
+              loading: false,
+              status: false,
+            });
+          } else if (
+            res.data?.status_message?.toLowerCase().includes("not_found")
+          ) {
+            setRequestStatus({
+              message: "Sorry, wallet not found",
+              loading: false,
+              status: false,
+            });
+          } else {
+            setRequestStatus({
+              message: "Could not perform transaction",
+              loading: false,
+              status: false,
+            });
+          }
+          return setTimeout(
+            () =>
+              setRequestStatus({
+                message: "",
+                loading: false,
+                status: false,
+              }),
+            1500
+          );
         }
         setRequestStatus({
           message: "transfer successful",
@@ -59,7 +101,13 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
       });
   };
 
-  console.log(state)
+  const getBack = () => {
+    action();
+    setShowNairaWithdraw({
+      show: true,
+      data: state,
+    });
+  };
 
   return (
     <ModalCom action={action} situation={situation} className="edit-popup">
@@ -115,17 +163,40 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
                 />
               </div>
 
-              {/* RECIPIENT ACC: */}
-              <div className="field w-full mb-3">
-                <InputCom
-                  fieldClass="px-6"
-                  label="Recipient Acc:"
-                  type="text"
-                  name="recipient"
-                  value={state?.details.recipient || ""}
-                  disable={true}
-                />
-              </div>
+              {state?.choice === "prev" && (
+                <>
+                  {/* RECIPIENT ACC: */}
+                  <div className="field w-full mb-3">
+                    <InputCom
+                      fieldClass="px-6"
+                      label="Recipient Acc:"
+                      type="text"
+                      name="recipient"
+                      value={state?.details?.recipient || ""}
+                      disable={true}
+                    />
+                  </div>
+                </>
+              )}
+
+              {state?.choice === "new" && (
+                <>
+                  {/* RECIPIENT ACC: */}
+                  <div className="field w-full mb-3">
+                    <InputCom
+                      fieldClass="px-6"
+                      label="Bank Acc:"
+                      type="text"
+                      name="bank"
+                      value={
+                        `${state?.details?.name} ${state?.details?.country}` ||
+                        ""
+                      }
+                      disable={true}
+                    />
+                  </div>
+                </>
+              )}
 
               {/* PROCESSING FEE: */}
               <div className="field w-full mb-3">
@@ -165,33 +236,31 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
             </div>
 
             <hr />
-            {requestStatus.message && (
-              <p
-                className={`text-base ${
-                  requestStatus.status ? "text-green-500" : "text-red-500"
-                } px-4 md:px-8 py-4`}
-              >
-                {requestStatus.message}
-              </p>
-            )}
+            <p
+              className={`text-base ${
+                requestStatus.status ? "text-green-500" : "text-red-500"
+              } px-4 md:px-8 py-4 h-5`}
+            >
+              {requestStatus.message && requestStatus.message}
+            </p>
             <div className="px-4 md:px-8 py-4 add-fund-btn flex justify-end items-center gap-2">
               <button
                 type="button"
-                onClick={action}
+                onClick={state?.choice === "prev" ? getBack : action}
                 className="border-gradient text-base tracking-wide px-4 py-2 rounded-full"
               >
-                <span className="text-gradient">Cancel</span>
+                <span className="text-gradient">{state?.choice === "prev" ? "Back" : "Cancel"}</span>
+              </button>
+              <button
+                onClick={handleSubmit}
+                className="btn-gradient text-base tracking-wide px-4 py-2 rounded-full text-white cursor-pointer min-w-[100px]"
+              >
+                {requestStatus.loading ? (
+                  <LoadingSpinner size="6" color="sky-blue" />
+                ) : (
+                  "Transfer"
+                )}
               </button>
-              {requestStatus.loading ? (
-                <LoadingSpinner size="8" color="sky-blue" />
-              ) : (
-                <button
-                  onClick={handleSubmit}
-                  className="btn-gradient text-base tracking-wide px-4 py-2 rounded-full text-white cursor-pointer"
-                >
-                  Transfer
-                </button>
-              )}
             </div>
           </div>
         </div>

src/components/MyWallet/Popup/NairaWithdraw.jsx

@@ -6,32 +6,33 @@ import InputCom from "../../Helpers/Inputs/InputCom";
 import ModalCom from "../../Helpers/ModalCom";
 import LoadingSpinner from "../../Spinners/LoadingSpinner";
 
-const initialValues = {
-  amount: "",
-  comment: "",
-  previousAccount: {
-    recipientID: "",
-  },
-  newAccount: {
-    country: "",
-    bank: "",
-    accountNumber: "",
-    accountType: "",
-    state: "",
-    city: "",
-  },
-};
-
 function NairaWithdraw({
   wallet,
   action,
   situation,
+  state,
   setShowConfirmNairaWithdraw,
 }) {
-  const apiCall = new usersService(); // API CLASS CALL
-  const navigate = useNavigate();
+  const apiCall = new usersService(); 
   const [tab, setTab] = useState("previous");
   let [requestStatus, setRequestStatus] = useState(false);
+
+  const initialValues = {
+    amount: state?.amount || "",
+    comment: state?.comment || "",
+    previousAccount: {
+      recipientID: state?.previousAccount?.recipientID || "",
+    },
+    newAccount: {
+      country: state?.newAccount?.amount || "",
+      bank: state?.newAccount?.amount || "",
+      accountNumber: state?.newAccount?.amount || "",
+      accountType: state?.newAccount?.amount || "",
+      state: state?.newAccount?.amount || "",
+      city: state?.newAccount?.amount || "",
+    },
+  };
+
   const [errorMsgs, setErrorMsgs] = useState(initialValues);
 
   let [sendMoneyFee, setSendMoneyFee] = useState({
@@ -65,7 +66,7 @@ function NairaWithdraw({
 
   // Handling card change
   const handleBankOptions = (event) => {
-    const { name, value } = event.target;
+    const { value } = event.target;
     setBankName((prev) => ({ loading: true, data: [] }));
     apiCall
       .getCountryBank({ country: value })
@@ -167,13 +168,9 @@ function NairaWithdraw({
   //FUNCTION TO HANDLE SUBMIT
   const handleSubmit = async (values, helpers) => {
     try {
-      // Validate the form using Yup validation schema
-      // await validationSchema.validate(values, { abortEarly: false });
-      // If validation passes, proceed with form submission
-      console.log("Form data is valid!", values);
       if (!values?.amount) {
-        setErrorMsgs({ amount: "Please enter an amount" });
-        setTimeout(() => setErrorMsgs({ amount: "" }), 1000);
+        setErrorMsgs({ amount: "amount required" });
+        setTimeout(() => setErrorMsgs({ amount: "" }), 3000);
         return;
       }
       if (values?.comment?.length >= 50) {
@@ -210,12 +207,13 @@ function NairaWithdraw({
         const stateData = {
           amount: values.amount,
           comment: values.comment,
-          wallet_uid: wallet.wallet_uid,  
+          choice: "prev",
+          wallet_uid: wallet.wallet_uid,
           ...sendMoneyFee,
           details: { ...recipientDetails[0] },
         };
 
-        setTimeout(() => {
+        return setTimeout(() => {
           setRequestStatus(false);
           // navigate("confirm-withdraw-naira", { state: stateData });
           action();
@@ -226,11 +224,52 @@ function NairaWithdraw({
       if (tab === "new") {
         const { accountNumber, accountType, bank, city, country, state } =
           values?.newAccount;
+
+        if (
+          !accountNumber ||
+          !accountType ||
+          !bank ||
+          !city ||
+          !country ||
+          !state
+        ) {
+          return;
+        }
+
+        setRequestStatus(true);
+
+        // Ensure bankDetails is an array and not undefined
+        const bankDetails = bankName.data?.filter(
+          (item) => item.bank_uid === bank
+        );
+
+        console.log(bankDetails);
+
+        // Ensure bankDetails is not empty
+        if (!bankDetails || bankDetails.length === 0) {
+          // Handle the case when bankDetails is empty or undefined
+          setRequestStatus(false);
+          return;
+        }
+
+        const stateData = {
+          amount: values.amount,
+          comment: values.comment,
+          choice: "new",
+          wallet_uid: wallet.wallet_uid,
+          ...sendMoneyFee,
+          details: { ...bankDetails[0], ...values?.newAccount },
+        };
+
+        return setTimeout(() => {
+          setRequestStatus(false);
+          action();
+          setShowConfirmNairaWithdraw({ show: true, state: stateData });
+        }, 1000);
       }
     } catch (errors) {
       // If validation fails, handle the validation errors
       throw new Error("Validation errors:", errors);
-      //
     }
   };
 
@@ -275,11 +314,7 @@ function NairaWithdraw({
             </button>
           </div>
           <div className="add-fund w-full md:p-8 p-4 bg-white dark:bg-dark-white h-full rounded-2xl">
-            <Formik
-              initialValues={initialValues}
-              // validationSchema={validationSchema}
-              onSubmit={handleSubmit}
-            >
+            <Formik initialValues={initialValues} onSubmit={handleSubmit}>
               {(props) => {
                 return (
                   <Form className="transfer-fund-info">
@@ -289,8 +324,8 @@ function NairaWithdraw({
                         <InputCom
                           fieldClass="px-4"
                           parentClass="flex items-center gap-1 justify-between"
-                          labelClass="flex-[0.2] mb-0"
-                          inputClass="flex-[0.8] max-w-[12rem]"
+                          labelClass="flex-[0.3] mb-0"
+                          inputClass="flex-[0.7] max-w-[12rem]"
                           label="Amount:"
                           type="number"
                           name="amount"
@@ -301,12 +336,8 @@ function NairaWithdraw({
                           blurHandler={(e) => {
                             getSendMoneyFee(e);
                           }}
+                          error={errorMsgs.amount && errorMsgs.amount}
                         />
-                        {errorMsgs?.amount && (
-                          <p className="sm:text-sm text-[12px] text-red-500 sm:text-left text-right sm:translate-y-0 translate-y-1">
-                            {errorMsgs.amount}
-                          </p>
-                        )}
                       </div>
 
                       <div className="field w-full">
@@ -485,7 +516,7 @@ function NairaWithdraw({
                               </div>
                             </div>
                           </div>
-                          <div className="h-[7.6rem]"></div>
+                          <div className="h-[7.8rem]"></div>
                         </>
                       )}
 
@@ -503,12 +534,13 @@ function NairaWithdraw({
                                   <span className="text-red-500">*</span>
                                 </label>
                                 <select
-                                  className="w-full text-base p-2 text-dark-gray dark:text-white border border-slate-300 outline-0 flex-[0.6] rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding"
+                                  className="w-full text-base p-2 text-dark-gray dark:text-white border border-slate-300 outline-0 flex-[0.6] rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding tracking-[1.5px]"
                                   name="newAccount.country"
                                   value={props.values.newAccount?.country}
-                                  onChange={
-                                    props.handleChange || handleBankOptions
-                                  }
+                                  onChange={(e) => {
+                                    props.handleChange(e);
+                                    handleBankOptions(e);
+                                  }}
                                 >
                                   {allCountries.loading ? (
                                     <option
@@ -558,7 +590,7 @@ function NairaWithdraw({
                               <div className="add-recipient w-full flex items-center flex-1">
                                 <label
                                   htmlFor="newAccount.bank"
-                                  className="input-label text-[#181c32] dark:text-white text-base font-semibold inline-flex flex-[0.4]"
+                                  className="input-label text-[#181c32] dark:text-white text-base font-semibold inline-flex flex-[0.4] tracking-[1.5px]"
                                 >
                                   Bank Name{" "}
                                   <span className="text-red-500">*</span>
@@ -589,7 +621,7 @@ function NairaWithdraw({
                                         <option
                                           key={index}
                                           className="text-slate-500 text-lg"
-                                          value={item.code}
+                                          value={item.bank_uid}
                                         >
                                           {item.name}
                                         </option>
@@ -623,11 +655,12 @@ function NairaWithdraw({
                                   <span className="text-red-500">*</span>
                                 </label>
                                 <InputCom
-                                  fieldClass="px-6"
+                                  fieldClass="px-6 tracking-[1.5px]"
                                   inputClass="flex items-center max-w-[15rem]"
                                   type="text"
                                   name="newAccount.accountNumber"
                                   placeholder="Account No"
+                                  maxLength={10}
                                   value={props.values.newAccount?.accountNumber}
                                   inputHandler={props.handleChange}
                                   blurHandler={props.handleBlur}
@@ -649,7 +682,7 @@ function NairaWithdraw({
                                   Type <span className="text-red-500">*</span>
                                 </label>
                                 <select
-                                  className="w-full text-base p-2 text-dark-gray dark:text-white border border-slate-300 outline-0 flex-[0.6] rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding flex-grow"
+                                  className="w-full text-base p-2 text-dark-gray dark:text-white border border-slate-300 outline-0 flex-[0.6] rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding flex-grow tracking-[1.5px]"
                                   name="newAccount.accountType"
                                   value={props.values.newAccount?.accountType}
                                   onChange={props.handleChange}
@@ -708,7 +741,7 @@ function NairaWithdraw({
                                   State <span className="text-red-500">*</span>
                                 </label>
                                 <InputCom
-                                  fieldClass="px-6"
+                                  fieldClass="px-6 tracking-[1.5px]"
                                   inputClass="max-w-[10rem]"
                                   type="text"
                                   name="newAccount.state"
@@ -733,7 +766,7 @@ function NairaWithdraw({
                                   City <span className="text-red-500">*</span>
                                 </label>
                                 <InputCom
-                                  fieldClass="px-6"
+                                  fieldClass="px-6 tracking-[1.5px]"
                                   type="text"
                                   inputClass="max-w-[10rem]"
                                   name="newAccount.city"

src/components/MyWallet/Wallet.jsx

@@ -13,7 +13,7 @@ import LoadingSpinner from "../Spinners/LoadingSpinner";
 const WalletBox = lazy(() => import("./WalletBox"));
 
 const WalletRoutes = () => {
-  const apiCall = useMemo(() => new usersService(), []);
+  const apiCall = new usersService();
   const { walletTable } = useSelector((state) => state.tableReload);
   const [walletList, setWalletList] = useState({
     loading: true,
@@ -25,29 +25,23 @@ const WalletRoutes = () => {
     data: [],
   });
 
-  const getWalletList = useCallback(() => {
-    return apiCall
+  const getWalletList = () => {
+    apiCall
       .getUserWallets()
       .then((res) => {
         if (res.data.internal_return < 0) {
           setWalletList({ loading: false, data: [] });
         } else {
-          setWalletList({ loading: true, data: [] });
-
-          setTimeout(
-            () =>
-              setWalletList({ loading: false, data: res.data?.result_list }),
-            500
-          );
+          setWalletList({ loading: false, data: res.data?.result_list });
         }
       })
       .catch(() => {
         setWalletList({ loading: false, data: [] });
       });
-  }, [apiCall]);
+  }
 
-  const getPaymentHistory = useCallback(() => {
-    return apiCall
+  const getPaymentHistory = () => {
+    apiCall
       .getPaymentHx()
       .then((res) => {
         if (res.data.internal_return < 0) {
@@ -59,19 +53,23 @@ const WalletRoutes = () => {
       .catch(() => {
         setPaymentHistory({ loading: false, data: [] });
       });
-  }, [apiCall]);
+  }
 
   useEffect(() => {
-    const fetchData = async () => {
-      await Promise.all([getWalletList(), getPaymentHistory()]);
-    };
+    // const fetchData = async () => {
+    //   await Promise.all([getWalletList(), getPaymentHistory()]);
+    // };
 
-    if (walletList.loading) {
-      fetchData();
-    }
-  }, [walletTable, walletList.loading]);
+    // if (walletList.loading) {
+    //   fetchData();
+    // }
+    getWalletList()
+    getPaymentHistory()
+  }, [walletTable]);
 
-  console.log(walletTable);
+
+
+  console.log('TESTING',walletTable);
   return (
     <Layout>
       <Suspense fallback={<LoadingSpinner size="16" color="sky-blue" />}>

src/components/MyWallet/WalletAction.jsx

@@ -1,10 +1,13 @@
 import React, { useCallback, useState } from "react";
+import usersService from "../../services/UsersService";
 import ConfirmNairaWithdraw from "./Popup/ConfirmNairaWithdraw";
 import NairaWithdraw from "./Popup/NairaWithdraw";
-import usersService from "../../services/UsersService";
 
 function WalletAction({ walletItem, payment, openPopUp }) {
-  const [showNairaWithdraw, setShowNairaWithdraw] = useState(false); // DETERMINES WHEN NAIRA WITHDRAWAL POPS UP
+  const [showNairaWithdraw, setShowNairaWithdraw] = useState({
+    show: false,
+    state: {},
+  }); // DETERMINES WHEN NAIRA WITHDRAWAL POPS UP
   const [countries, setCountries] = useState([]);
   const [showConfirmNairaWithdraw, setShowConfirmNairaWithdraw] = useState({
     show: false,
@@ -34,7 +37,7 @@ function WalletAction({ walletItem, payment, openPopUp }) {
       <div className="w-1/2 flex justify-center items-center">
         <button
           onClick={() => {
-            setShowNairaWithdraw(true);
+            setShowNairaWithdraw((prev) => ({ ...prev, show: true }));
           }}
           className={`${
             walletItem.code != "NAIRA" && "invisible"
@@ -57,13 +60,17 @@ function WalletAction({ walletItem, payment, openPopUp }) {
         </button>
       </div>
 
-      {showNairaWithdraw && (
+      {showNairaWithdraw.show && (
         <NairaWithdraw
           wallet={walletItem}
           action={() => {
-            setShowNairaWithdraw((prev) => !prev);
+            setShowNairaWithdraw((prev) => ({
+              ...prev,
+              show: !prev.show,
+            }));
           }}
-          situation={showNairaWithdraw}
+          situation={showNairaWithdraw.show}
+          state={showNairaWithdraw.state}
           setShowConfirmNairaWithdraw={setShowConfirmNairaWithdraw}
         />
       )}
@@ -78,6 +85,7 @@ function WalletAction({ walletItem, payment, openPopUp }) {
               show: !prev.show,
             }));
           }}
+          setShowNairaWithdraw={setShowNairaWithdraw}
           situation={showConfirmNairaWithdraw.show}
         />
       )}

src/components/Notification/index.jsx

@@ -35,7 +35,6 @@ export default function Notification() {
   const indexOfLastItem = Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE);
   const currentNotifications = notificationData?.slice(indexOfFirstItem, indexOfLastItem);
   
-  console.log('TESTING', currentNotifications)
   const filterHandler = (value) => {
     setValue(value);
     switch(value){

src/components/Partials/Header.jsx

@@ -1,5 +1,5 @@
 import React, { useContext, useEffect, useMemo, useState } from "react";
-import { Link, useLocation } from "react-router-dom";
+import { Link, useLocation, useNavigate } from "react-router-dom";
 import bank1 from "../../assets/images/bank-1.png";
 import bank2 from "../../assets/images/bank-2.png";
 import bank3 from "../../assets/images/bank-3.png";
@@ -26,9 +26,11 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
   const [moneyPopup, setPopup] = useToggle(false);
   const darkMode = useContext(DarkModeContext);
   const { userDetails } = useSelector((state) => state?.userDetails);
+  const { walletTable } = useSelector((state) => state.tableReload); // DETERMINES WHEN WALLET RELOADS
   const [myWalletList, setMyWalletList] = useState([]);
   const api = useMemo(() => new usersService(), []);
   const dispatch = useDispatch();
+  const navigate = useNavigate()
 
   const { notifications } = useSelector((state) => state?.notifications); // NOTIFICATION STORE
 
@@ -43,7 +45,7 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
   };
   useEffect(() => {
     getMyWalletList();
-  }, []);
+  }, [walletTable]);
 
   const handlerBalance = () => {
     setbalanceValue.toggle();
@@ -317,9 +319,14 @@ export default function Header({ logoutModalHandler, sidebarHandler }) {
                     <Link
                       to="/notification"
                       className="text-purple text-sm font-medium"
+                      onClick={handlerNotification}
                     >
                       See all Notification
                     </Link>
+                    {/* <button className="text-purple text-sm font-medium" onClick={()=>{
+                      handlerNotification()
+                      navigate('/notification', {replace: true})
+                    }}>See all Notification</button> */}
                   </div>
                 </div>
               </div>

src/lib/checkAndSetError.js

@@ -0,0 +1,21 @@
+const checkAndSetError = (field, value, setErrorFunc, errorMessage) => {
+  const isNotEmpty = () => {
+    if (!value) {
+      setErrorFunc({ [field]: errorMessage });
+      setTimeout(() => setErrorFunc({ [field]: "" }), 1000);
+      return false;
+    }
+  };
+
+  const textCount = () => {
+    if (!value) {
+      setErrorFunc({ [field]: errorMessage });
+      setTimeout(() => setErrorFunc({ [field]: "" }), 1000);
+      return false;
+    }
+  };
+
+  return { isNotEmpty, textCount };
+};
+
+export default checkAndSetError;

src/lib/index.js

@@ -1,5 +1,13 @@
 import ClearCookies from "./ClearCookies";
+import checkAndSetError from "./checkAndSetError";
+import formattedDate from "./fomattedDate";
 import getTimeAgo from "./getTimeAgo";
 import localImgLoad from "./localImgLoad";
 
-export {ClearCookies, getTimeAgo, localImgLoad}
+export {
+  ClearCookies,
+  checkAndSetError,
+  formattedDate,
+  getTimeAgo,
+  localImgLoad,
+};