resource ask question implemented

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

@@ -1,38 +1,67 @@
-import React, { useState } from "react";
-import { Link } from "react-router-dom";
+import React, { useEffect, useState } from "react";
+import { Link, useNavigate } from "react-router-dom";
 import Layout from "../Partials/Layout";
 import CommonHead from "../UserHeader/CommonHead";
+import usersService from "../../services/UsersService";
+import LoadingSpinner from "../Spinners/LoadingSpinner";
 
 export default function BlogItem(props) {
+
+    const apiCall = new usersService()
+    const navigate = useNavigate()
+
+    const [blogdata, setBlogdata] = useState({loading: true, data:{}})
+
     const [selectTab, setValue] = useState("today");
     const filterHandler = (value) => {
         setValue(value);
     };
+    const queryParams = new URLSearchParams(location?.search);
+    const blog_id = queryParams.get("blog_id");
+    
+    useEffect(()=>{
+        if(!blog_id){
+            navigate('/',{replace:true})
+        }
+        apiCall.getSingleBlogData({blog_id}).then(res => {
+            setBlogdata({loading: false, data:res.data})
+        }).catch(error => {
+            setBlogdata({loading: false, data:{}})
+            console.log('ERROR', error)
+        })
+    },[blog_id])
     return (
         <Layout>
             <CommonHead
                 commonHeadData={props.commonHeadData}
             />
             <div className="notification-page w-full mb-10">
-                <div className="notification-wrapper w-full">
-                    {/* heading */}
-                    <div className="sm:flex justify-between items-center mb-6">
-                        <div className="mb-5 sm:mb-0">
-                            <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
-                <span
-                    className={`${selectTab === "today" ? "block" : "hidden"}`}
-                >
-                  Title of this Blog Items
-                </span>
-                            </h1>
-                        </div>
-                        <div className="slider-btns flex space-x-4">
-
-                        </div>
+                <div className="notification-wrapper w-full bg-white p-8">
+                    {blogdata.loading ? 
+                        <LoadingSpinner size='8' color='sky-blue' height='h-[100px]' />
+                    :
+                        blogdata?.data?.blogdata && blogdata.data?.blogdata.length ?
+                        <div className="w-full">
+                            {/* heading */}
+                            <div className="sm:flex justify-between items-center mb-6">
+                                <div className="mb-5 sm:mb-0">
+                                    <h1 className="text-26 font-bold text-dark-gray dark:text-white">
+                                        <span
+                                            className={`${selectTab === "today" ? "block" : "hidden"}`}
+                                        >
+                                        {blogdata.data?.blogdata?.[0]?.post_title}
+                                        </span>
+                                    </h1>
+                                </div>
+                                {/* <div className="slider-btns flex space-x-4">
+                                </div> */}
+                            </div>
+                            <div dangerouslySetInnerHTML={{__html: blogdata.data?.blogdata?.[0]?.post_content}}>
+                            </div>
                     </div>
-                   <div>
-                       Blog Items Details need implenet
-                   </div>
+                    :
+                    <h1 className="text-26 font-bold text-dark-gray dark:text-white">No Blog Found!</h1>
+                    }  
                 </div>
             </div>
         </Layout>

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/Helpers/SearchCom.jsx

@@ -7,6 +7,7 @@ export default function SearchCom({
   placeholder,
   handleSearch,
   value,
+  name,
 }) {
   return (
     <div
@@ -22,6 +23,7 @@ export default function SearchCom({
           className={`w-full h-full focus:outline-0 focus:ring-0 dark:bg-dark-white dark:text-white ${
             inputClasses || ""
           }`}
+          name={name}
           type="text"
           onInput={handleSearch}
           value={value}

src/components/MyWallet/Popup/CompleteConfirmCredit.jsx

@@ -2,6 +2,11 @@ import React from "react";
 
 function CompleteConfirmCredit({ onClose, confirmCredit }) {
   const { data } = confirmCredit;
+
+  const backToWallet = () => {
+    onClose();
+    window.location.reload(true);
+  };
   return (
     <div className="logout-modal-body w-full flex flex-col items-center">
       <div className="content-wrapper w-full h-[32rem]">
@@ -99,7 +104,7 @@ function CompleteConfirmCredit({ onClose, confirmCredit }) {
             <div className="md:p-8 p-4 add-fund-btn flex justify-end items-center py-4 gap-4">
               <button
                 className="px-4 h-11 flex justify-center items-center btn-gradient text-white text-base rounded-full w-[100px]"
-                onClick={onClose}
+                onClick={backToWallet}
               >
                 Ok
               </button>

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({
@@ -17,7 +22,6 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
     loading: false,
     status: false,
   });
-  let [pageLoading, setPageLoading] = useState(true);
 
   //FUNCTION TO HANDLE SUBMIT
   const handleSubmit = () => {
@@ -25,19 +29,68 @@ 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;
+      reqData.mode = 100;
+    }
+
+    if (state?.choice === "new") {
+      reqData.account_no = state?.details?.accountNumber;
+      reqData.account_type = Number(state?.details?.accountType);
+      reqData.bank_uid = state?.details?.bank_uid;
+      reqData.country = state?.details?.country;
+      reqData.state = state?.details?.state;
+      reqData.city = state?.details?.city;
+      reqData.mode = 500;
+    }
+
     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 if (
+            res.data?.status_message
+              ?.toLowerCase()
+              .includes("recipient_add_error")
+          ) {
+            setRequestStatus({
+              message: res.data?.error,
+              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 +112,13 @@ function ConfirmNairaWithdraw({ payment, wallet, action, situation, state }) {
       });
   };
 
-  console.log(state)
+  const getBack = () => {
+    action();
+    setShowNairaWithdraw({
+      show: true,
+      data: {},
+    });
+  };
 
   return (
     <ModalCom action={action} situation={situation} className="edit-popup">
@@ -115,17 +174,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 +247,33 @@ 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,50 @@ 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
+        );
+
+        // 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 +312,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 +322,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 +334,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 +514,7 @@ function NairaWithdraw({
                               </div>
                             </div>
                           </div>
-                          <div className="h-[7.6rem]"></div>
+                          <div className="h-[7.8rem]"></div>
                         </>
                       )}
 
@@ -503,12 +532,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 +588,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 +619,7 @@ function NairaWithdraw({
                                         <option
                                           key={index}
                                           className="text-slate-500 text-lg"
-                                          value={item.code}
+                                          value={item.bank_uid}
                                         >
                                           {item.name}
                                         </option>
@@ -623,11 +653,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 +680,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 +739,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 +764,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/components/Resources/tabs/QuestionsTab.jsx

@@ -1,9 +1,65 @@
+import { useEffect, useState } from "react";
+
 import ProductCardStyleTwo from "../../Cards/ProductCardStyleTwo";
 import DataIteration from "../../Helpers/DataIteration";
 import SearchCom from "../../Helpers/SearchCom";
 import localImgLoad from "../../../lib/localImgLoad";
 
+import usersService from "../../../services/UsersService";
+import LoadingSpinner from "../../Spinners/LoadingSpinner";
+
 export default function QuestionsTab({ className, products }) {
+    const apiCall = new usersService()
+
+    const [requestStatus, setRequestStatus] = useState({loading: false, status: false, message: ''})
+
+    const [error, setError] = useState({question: '', searchPhrase: ''})
+
+    const [questions, setQuestions] = useState({loading: true, data: []})
+
+    const [askQuestion, setAskQuestion] = useState({question: '', searchPhrase: ''})
+
+    const changeAskQuestion = ({target: {name, value}}) => {
+        setAskQuestion(prev => ({...prev, [name]: value}))
+        setRequestStatus({loading: false, status: false, message: ''})
+    }
+
+    const onSearch = () => {
+        setError({question: '', searchPhrase: ''}) // sets error to false
+        if(!askQuestion.question){
+            return setError(prev => ({...prev, question: 'Select a question'}))
+        }
+        if(!askQuestion.searchPhrase){
+            return setError(prev => ({...prev, searchPhrase: 'Enter search parameter'}))
+        }
+        if(askQuestion.searchPhrase.length > 60){
+            return setError(prev => ({...prev, searchPhrase: 'Max of 60 characters'}))
+        }
+        
+        setRequestStatus({loading: true, status: false, message: ''})
+        let reqData = {
+            question_key: '',
+            question: ''
+        }
+        apiCall.askResourcesResult().then(res => {
+            console.log(res.data.choices[0].text)
+            if(!res.data || res.data?.choices?.length < 1){
+            setRequestStatus({loading: false, status: false, message: 'No result found!'})
+            }
+            setRequestStatus({loading: false, status: false, message: res.data?.choices[0].text})
+        }).catch(error => {
+            setRequestStatus({loading: false, status: false, message: 'No result found!'})
+        })
+    }
+   
+    useEffect(()=>{
+        apiCall.getResourceList().then(res => {
+            setQuestions({loading: false, data: res.data?.ask_categories?.data})
+        }).catch(error => {
+            setQuestions({loading: false, data: []})
+            console.log('ERROR', error)
+        })
+    }, [])
     return (
         <>
             <div className={`onsale-tab-wrapper w-full ${className || ""}`}>
@@ -16,29 +72,49 @@ export default function QuestionsTab({ className, products }) {
                             </div>
                             <div className="p-8 bg-white rounded-2xl h-full">
                                 <div className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full 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">
-                                    <select className="input-field px-2 placeholder:text-base text-dark-gray w-full h-full tracking-wide dark:bg-[#11131F] bg-[#fafafa] focus:ring-0 focus:outline-none">
-                                        <option className="rounded-full">Find answer on:</option>
+                                    <select value={askQuestion.question} name='question' onChange={changeAskQuestion} className="input-field px-2 placeholder:text-base text-dark-gray w-full h-full tracking-wide dark:bg-[#11131F] bg-[#fafafa] focus:ring-0 focus:outline-none">
+                                        {questions.loading ? 
+                                            <option value='' className="">Loading...</option>
+                                            :
+                                            <>
+                                            <option value='' className="">Find answer on:</option>
+                                            {questions.data.length > 0 && questions.data.map((item, index)=>(
+                                                <option key={index} value={item.question_key} className="">{item.name}</option>
+                                                ))}
+                                            </>
+                                        }
+                                        
                                     </select>
                                 </div>
+                                {error.question && <p className="text-red-500 text-[12px]">{error.question}</p>} 
                                 {/* filter-search */}
                                 <div className="w-full my-5 border-2 rounded-full">
-                                    <SearchCom />
+                                    <SearchCom 
+                                        name={'searchPhrase'}
+                                        value={askQuestion.searchPhrase}
+                                        handleSearch={changeAskQuestion}
+                                        />
                                 </div>
+                                {error.searchPhrase && <p className="text-red-500 text-[12px]">{error.searchPhrase}</p>}
                                 <div className="w-full flex justify-end items-center border-b-2 pb-4">
                                     <button
+                                        onClick={onSearch}
+                                        disabled={requestStatus.loading}
                                         className="btn-gradient text-base tracking-wide px-4 py-2 rounded-full text-white cursor-pointer"
                                         >
                                         Search
                                     </button>
                                 </div>
+                                <div className="search_result my-2 max-h-[400px] overflow-auto">
+                                {requestStatus.loading ?
+                                    <LoadingSpinner size='8' color='sky-blue' height='h-[100px]' />
+                                    :
+                                    <p className="py-2 text-sm font-bold text-dark-gray dark:text-white tracking-wide">{requestStatus.message}</p>
+                                    }
+                                </div>
                             </div>
                         </div>
-
                     </div>
-                    {/* <div className="content-section w-full-width">
-                        <div className="grid lg:grid-cols-3 sm:grid-cols-2 grid-cols-1 gap-[30px]">
-                        </div>
-                    </div> */}
                 </div>
             </div>
         </>

src/components/UserHeader/RecomendedSliders.jsx

@@ -100,7 +100,7 @@ export default function RecomendedSliders({ className, bannerData }) {
       <div className="slider-content">
         <SliderCom settings={settings} selector={sellSlider}>
           {bannerData.map((item, index) => (
-            <Link key={index} to={`/${item.link_path}`}>
+            <Link key={index} to={item.link_path == 'blog-page' ? `/${item.link_path}?blog_id=${item.blog_id}` : `/${item.link_path}`}>
               <div className="item">
                 <div
                   className={`commonHeaderSliderItem flex gap-1 flex-col justify-between items-center ${item.short_style}`}

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,
+};

src/services/UsersService.js

@@ -411,6 +411,19 @@ class usersService {
     };
     return this.postAuxEnd("/resources", postData);
   }
+
+  // ASK QUESTION RESOURCES
+  askResourcesResult(reqData) {
+    var postData = {
+      uuid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 22010,
+      ...reqData,
+    };
+    return this.postAuxEnd("/askresources", postData);
+  }
+
   getMyWiatingJobList() {
     // jobs you have shown inteterest in
     var postData = {
@@ -480,7 +493,6 @@ class usersService {
       member_id: localStorage.getItem("member_id"),
       sessionid: localStorage.getItem("session_token"),
       action: 33020,
-      mode: 100,
       ...reqData,
     };
     return this.postAuxEnd("/sendmoney", postData);
@@ -992,6 +1004,18 @@ class usersService {
       return this.postAuxEnd("/payremcard", postData);
     }
 
+    // FUNCTION TO GET SINGLE BLOG ITEM
+    getSingleBlogData(reqData) {
+      var postData = {
+        uid: localStorage.getItem("uid"),
+        member_id: localStorage.getItem("member_id"),
+        sessionid: localStorage.getItem("session_token"),
+        limit: 4,
+        ...reqData,
+      };
+      return this.postAuxEnd("/blogdata", postData);
+    }
+
   /*
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(username)
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(password)