Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
9ea846bc56 | ||
 ameye
|
2341d2a17d | ||
|
ameye
|
076df9438d | ||
|
Ebube
|
bbf03b2b10 | ||
|
Ebube
|
afead464b0 | ||
|
victorAnumudu
|
dcdf03e9c5 | ||
|
ameye
|
44e2402cb3 |
+1
-1
@@ -89,7 +89,7 @@ export default function Routers() {
|
||||
<Route exact path="/notification" element={<Notification />} />
|
||||
<Route exact path="/mytask" element={<MyTaskPage />} />
|
||||
<Route exact path="/myjobs" element={<MyJobsPage />} />
|
||||
<Route exact path="/add-job" element={<AddJobPage />} />
|
||||
{/* <Route exact path="/add-job" element={<AddJobPage />} /> */}
|
||||
<Route exact path="/my-active-jobs" element={<MyActiveJobsPage />} />
|
||||
<Route exact path="/my-pastdue-jobs" element={<MyPastDueJobsPage />} />
|
||||
<Route exact path="/my-pending-jobs" element={<MyPendingJobsPage />} />
|
||||
|
||||
@@ -106,7 +106,7 @@ function AddJob({ popUpHandler }) {
|
||||
});
|
||||
setTimeout(() => {
|
||||
dispatch(tableReload({ type: "JOBTABLE" }));
|
||||
popUpHandler()
|
||||
popUpHandler();
|
||||
}, 1000);
|
||||
})
|
||||
.catch((err) => {
|
||||
@@ -141,7 +141,7 @@ function AddJob({ popUpHandler }) {
|
||||
<div className="fields w-full">
|
||||
{/* inputs starts here */}
|
||||
{/* country */}
|
||||
<div className="xl:flex xl:space-x-7 mb-6">
|
||||
<div className="xl:flex xl:space-x-7 mb-[5px]">
|
||||
<div className="field w-full mb-6 xl:mb-0">
|
||||
<label
|
||||
htmlFor="country"
|
||||
@@ -187,11 +187,13 @@ function AddJob({ popUpHandler }) {
|
||||
</option>
|
||||
)}
|
||||
</select>
|
||||
{props.errors.country && props.touched.country && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.country}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.country && props.touched.country && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.country}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Price */}
|
||||
@@ -208,17 +210,19 @@ function AddJob({ popUpHandler }) {
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.price && props.touched.price && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.price}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.price && props.touched.price && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.price}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Title */}
|
||||
|
||||
<div className="field w-full mb-6">
|
||||
<div className="field w-full mb-[5px]">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Title"
|
||||
@@ -226,20 +230,21 @@ function AddJob({ popUpHandler }) {
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="title"
|
||||
// placeholder="Enter Job Title"
|
||||
value={props.values.title}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.title && props.touched.title && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.title}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.title && props.touched.title && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.title}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
<div className="field w-full mb-6">
|
||||
<div className="field w-full mb-[5px]">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Description"
|
||||
@@ -247,20 +252,22 @@ function AddJob({ popUpHandler }) {
|
||||
inputBg="bg-slate-100"
|
||||
type="text"
|
||||
name="description"
|
||||
// placeholder="Enter a description"
|
||||
value={props.values.description}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.description && props.touched.description && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.description}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.description &&
|
||||
props.touched.description && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.description}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Details */}
|
||||
<div className="field w-full mb-6">
|
||||
<div className="field w-full mb-[5px]">
|
||||
<label
|
||||
htmlFor="Job Delivery Details"
|
||||
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"'
|
||||
@@ -277,14 +284,16 @@ function AddJob({ popUpHandler }) {
|
||||
onChange={props.handleChange}
|
||||
onBlur={props.handleBlur}
|
||||
/>
|
||||
{props.errors.job_detail && props.touched.job_detail && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.job_detail}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.job_detail && props.touched.job_detail && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.job_detail}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="field w-full mb-6">
|
||||
<div className="field w-full mb-[5px]">
|
||||
<div className={`flex items-center justify-between mb-2.5`}>
|
||||
<label
|
||||
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
|
||||
@@ -313,12 +322,14 @@ function AddJob({ popUpHandler }) {
|
||||
</option>
|
||||
))}
|
||||
</Field>
|
||||
{props.errors.timeline_days &&
|
||||
props.touched.timeline_days && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.timeline_days}
|
||||
</p>
|
||||
)}
|
||||
<div className={`${!props.errors && "invisible"} h-5`}>
|
||||
{props.errors.timeline_days &&
|
||||
props.touched.timeline_days && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.timeline_days}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{/* inputs ends here */}
|
||||
</div>
|
||||
|
||||
@@ -1,10 +1,8 @@
|
||||
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { Link, useNavigate, } from "react-router-dom";
|
||||
import { toast } from "react-toastify";
|
||||
import localImgLoad from "../../lib/localImgLoad";
|
||||
import Icons from "../Helpers/Icons";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
import MarketPopUp from "../MarketPlace/PopUp/MarketPopUp";
|
||||
import usersService from "../../services/UsersService";
|
||||
import { PriceFormatter } from "../Helpers/PriceFormatter";
|
||||
|
||||
export default function AvailableJobsCard({
|
||||
className,
|
||||
@@ -12,44 +10,43 @@ export default function AvailableJobsCard({
|
||||
hidden = false,
|
||||
}) {
|
||||
//debugger;
|
||||
const [addFavorite, setValue] = useState(datas.whishlisted);
|
||||
const [marketPopUp, setMarketPopUp] = useState({ show: false, data: {} });
|
||||
const [manageInt, setManageInt] = useState(null)
|
||||
const [manageInt, setManageInt] = useState(null);
|
||||
const [imageUrl, setImageUrl] = useState("");
|
||||
|
||||
const navigate = useNavigate();
|
||||
const apiCall = useMemo(() => new usersService(), []);
|
||||
|
||||
|
||||
const favoriteHandler = () => {
|
||||
if (!addFavorite) {
|
||||
setValue(true);
|
||||
toast.success("Added to Favorite List");
|
||||
} else {
|
||||
setValue(false);
|
||||
toast.warn("Remove to Favorite List");
|
||||
}
|
||||
};
|
||||
|
||||
const marketInterestData = useCallback(async() => {
|
||||
const marketInterestData = useCallback(async () => {
|
||||
let { offer_code } = datas;
|
||||
let reqData = { offer_code };
|
||||
|
||||
try {
|
||||
const manageInt = await apiCall.MarketInterest(reqData);
|
||||
const manageIntRes = await manageInt?.data;
|
||||
setManageInt(manageIntRes)
|
||||
setManageInt(manageIntRes);
|
||||
} catch (error) {
|
||||
throw new Error(error)
|
||||
throw new Error(error);
|
||||
}
|
||||
}, [apiCall, datas]);
|
||||
|
||||
}, [])
|
||||
let thePrice = PriceFormatter(
|
||||
datas?.price * 0.01,
|
||||
datas?.currency_code,
|
||||
datas?.currency
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (!datas) {
|
||||
navigate("/market", { replace: true });
|
||||
}
|
||||
marketInterestData()
|
||||
}, [marketInterestData, datas])
|
||||
marketInterestData();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const imagePath = require(`../../assets/images/${datas.thumbnil}`); // Replace with your directory path for local images
|
||||
setImageUrl(imagePath);
|
||||
}, []);
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
@@ -87,11 +84,9 @@ export default function AvailableJobsCard({
|
||||
</div>
|
||||
<div className="thumbnail-area w-full">
|
||||
<div
|
||||
className="w-full h-[236px] p-6 rounded-xl overflow-hidden"
|
||||
className="w-full h-[236px] p-6 rounded-xl overflow-hidden bg-center bg-cover bg-no-repeat"
|
||||
style={{
|
||||
background: `url(${localImgLoad(
|
||||
`images/${datas.thumbnil}`
|
||||
)}) 0% 0% / cover no-repeat`,
|
||||
backgroundImage: `url('${imageUrl}')`,
|
||||
}}
|
||||
>
|
||||
<div className="flex justify-center">{datas.description}</div>
|
||||
@@ -124,11 +119,14 @@ export default function AvailableJobsCard({
|
||||
<div className="flex items-center space-x-2">
|
||||
<div>
|
||||
<p className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white">
|
||||
{datas.price * 0.01}
|
||||
{datas.currency} | {datas.timeline_days} day(s)
|
||||
{/* {thePrice} | {datas.timeline_days} day(s) */}
|
||||
{thePrice}
|
||||
</p>
|
||||
<p className="text-sm text-lighter-gray">
|
||||
( {datas.offer_code})
|
||||
( {datas.offer_code}) |
|
||||
<span className="italic ml-1">
|
||||
{datas.timeline_days} day(s) ago
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -137,7 +135,7 @@ export default function AvailableJobsCard({
|
||||
type="button"
|
||||
className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
|
||||
onClick={() => {
|
||||
setMarketPopUp({show: true, data: datas})
|
||||
setMarketPopUp({ show: true, data: datas });
|
||||
}}
|
||||
>
|
||||
View
|
||||
|
||||
@@ -9,7 +9,6 @@ export default function HomeBannerOffersCard(props) {
|
||||
let { banner, banner_location } = props?.itemData;
|
||||
if (banner_location === "LOCAL") {
|
||||
const imagePath = require(`../../assets/images/${banner}`); // Replace with your directory path for local images
|
||||
console.log("This is local");
|
||||
setImageUrl(imagePath);
|
||||
} else if (banner_location === "URL") setImageUrl(banner);
|
||||
else return null;
|
||||
@@ -30,7 +29,6 @@ export default function HomeBannerOffersCard(props) {
|
||||
<span className="heroSilderTitle">{props.itemData.title}</span>
|
||||
</h1>
|
||||
</div>
|
||||
{/*<SelectBox datas={filterDatas} action={dataSetHandler} />*/}
|
||||
</div>
|
||||
<div className="h-[233px]">
|
||||
<div className="siderCardDescription">
|
||||
|
||||
@@ -51,11 +51,16 @@ export default function InputCom({
|
||||
htmlFor={name}
|
||||
>
|
||||
{label}
|
||||
{spanTag && (
|
||||
{spanTag &&
|
||||
spanTag == '*' ?
|
||||
<span className="text-red-700 text-sm tracking-wide">
|
||||
{' '}{spanTag}
|
||||
</span>
|
||||
:
|
||||
<span className="text-green-700 text-sm tracking-wide">
|
||||
{spanTag}
|
||||
</span>
|
||||
)}
|
||||
}
|
||||
</label>
|
||||
)}
|
||||
{forgotPassword && (
|
||||
|
||||
@@ -1,26 +1,38 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import React, { useEffect, useMemo, useState } from "react";
|
||||
import DataIteration from "../Helpers/DataIteration";
|
||||
import AvailableJobsCard from "../Cards/AvailableJobsCard";
|
||||
|
||||
export default function MainSection({ className, marketPlaceProduct }) {
|
||||
const [tab, setTab] = useState("all");
|
||||
const [products, setProducts] = useState(marketPlaceProduct);
|
||||
export default function MainSection({
|
||||
className,
|
||||
marketPlaceProduct,
|
||||
categories,
|
||||
}) {
|
||||
// Creating All cart..
|
||||
let marketCategories = useMemo(
|
||||
() => ({ All: "All", ...categories }),
|
||||
[categories]
|
||||
);
|
||||
const [tab, setTab] = useState(marketCategories.All);
|
||||
|
||||
// Convert to array in order to map
|
||||
const mappedArray = Object.entries(marketCategories).map(([key, value]) => {
|
||||
return { key, value };
|
||||
});
|
||||
|
||||
const [products, setProducts] = useState([]);
|
||||
const tabHandler = (value) => {
|
||||
setTab(value);
|
||||
};
|
||||
useEffect(() => {
|
||||
if (tab === "artist") {
|
||||
setProducts(marketPlaceProduct?.slice(0, 3));
|
||||
} else if (tab === "market") {
|
||||
setProducts(marketPlaceProduct?.slice(0, 6));
|
||||
} else if (tab === "shop") {
|
||||
setProducts(marketPlaceProduct?.slice(6, 9));
|
||||
} else if (tab === "assets") {
|
||||
setProducts(marketPlaceProduct?.slice(3, 6));
|
||||
} else {
|
||||
if (tab === marketCategories.All) {
|
||||
setProducts(marketPlaceProduct);
|
||||
} else {
|
||||
const filteredProducts = marketPlaceProduct.filter((product) =>
|
||||
product.category.includes(tab)
|
||||
);
|
||||
setProducts(filteredProducts);
|
||||
}
|
||||
}, [tab, marketPlaceProduct]);
|
||||
}, [tab, marketPlaceProduct, categories, marketCategories]);
|
||||
|
||||
return (
|
||||
<div className={`market-place-section w-full ${className || ""}`}>
|
||||
@@ -28,69 +40,20 @@ export default function MainSection({ className, marketPlaceProduct }) {
|
||||
<div className="filter-navigate-area lg:flex justify-between mb-8 items-center">
|
||||
<div className="tab-item lg:mb-0 mb-5">
|
||||
<div className="md:flex md:space-x-8 space-x-2">
|
||||
<span
|
||||
onClick={() => tabHandler("all")}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === "all"
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
All
|
||||
</span>
|
||||
|
||||
|
||||
<span
|
||||
onClick={() => tabHandler("artist")}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === "artist"
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
Featured Artist
|
||||
</span>
|
||||
<span
|
||||
onClick={() => tabHandler("market")}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === "market"
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
Open Market
|
||||
</span>
|
||||
<span
|
||||
onClick={() => tabHandler("shop")}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === "shop"
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
Partner Shops
|
||||
</span>
|
||||
<span
|
||||
onClick={() => tabHandler("assets")}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === "assets"
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
Game Assets
|
||||
</span>
|
||||
|
||||
|
||||
{mappedArray.map(({ key, value }) => (
|
||||
<span
|
||||
onClick={() => tabHandler(key)}
|
||||
className={`md:text-[18px] text-md text-dark-gray dark:text-white hover:text-pink border-b hover:border-pink font-medium cursor-pointer ${
|
||||
tab === key
|
||||
? "text-pink border-pink"
|
||||
: " border-transparent"
|
||||
}`}
|
||||
>
|
||||
{value}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/*<div className="search-item flex lg:flex-none justify-end">*/}
|
||||
{/* <SearchCom*/}
|
||||
{/* className="lg:bg-transparent"*/}
|
||||
{/* inputClasses="lg:bg-transparent"*/}
|
||||
{/* />*/}
|
||||
{/*</div>*/}
|
||||
</div>
|
||||
<div className="filter-navigate-content w-full min-h-screen">
|
||||
<div className="grid lg:grid-cols-3 sm:grid-cols-2 gap-[30px]">
|
||||
|
||||
@@ -1,22 +1,23 @@
|
||||
import React from "react";
|
||||
// import products from "../../data/marketplace_data.json";
|
||||
//import CreateNft from "../Home/CreateNft";
|
||||
import Layout from "../Partials/Layout";
|
||||
import MainSection from "./MainSection";
|
||||
import CommonHead from "../UserHeader/CommonHead";
|
||||
import { useSelector } from "react-redux";
|
||||
|
||||
export default function MarketPlace({commonHeadData}) {
|
||||
export default function MarketPlace({ commonHeadData }) {
|
||||
let { jobLists } = useSelector((state) => state.jobLists);
|
||||
const marketData = jobLists?.result_list;
|
||||
const categories = jobLists?.categories;
|
||||
|
||||
// const marketProduct = products.data;
|
||||
return (
|
||||
<>
|
||||
<Layout>
|
||||
<CommonHead commonHeadData={commonHeadData} />
|
||||
<MainSection marketPlaceProduct={marketData} className="mb-10" />
|
||||
<CommonHead commonHeadData={commonHeadData} />
|
||||
<MainSection
|
||||
marketPlaceProduct={marketData}
|
||||
categories={categories}
|
||||
className="mb-10"
|
||||
/>
|
||||
</Layout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,15 +1,18 @@
|
||||
import React, {useState} from 'react'
|
||||
import RecentActivityTable from './WalletComponent/RecentActivityTable'
|
||||
import LoadingSpinner from '../Spinners/LoadingSpinner'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { useNavigate, useLocation } from 'react-router-dom'
|
||||
import InputCom from '../Helpers/Inputs/InputCom'
|
||||
|
||||
import AddFundDollars from './AddFundDollars'
|
||||
|
||||
function AddFund({payment}) {
|
||||
|
||||
const navigate = useNavigate()
|
||||
const {currency} = useLocation()?.state //GETS THE USER CURRENCY FOR ADD FUND
|
||||
|
||||
//STATE FOR CONTROLLED INPUT
|
||||
let [input, setInput] = useState('0')
|
||||
let [input, setInput] = useState('')
|
||||
|
||||
let [inputError, setInputError] = useState('')
|
||||
|
||||
@@ -23,15 +26,15 @@ function AddFund({payment}) {
|
||||
setInputError('')
|
||||
if(!input || input == '0'){
|
||||
setInputError('Please Enter Amount')
|
||||
return
|
||||
return setTimeout(()=>{setInputError('')}, 5000)
|
||||
}
|
||||
|
||||
if(isNaN(input)){
|
||||
setInputError('Amount must be a Number')
|
||||
return
|
||||
return setTimeout(()=>{setInputError('')}, 5000)
|
||||
}
|
||||
|
||||
const stateData = {amount: Number(input)}
|
||||
const stateData = {amount: Number(input), currency: 'naira'}
|
||||
navigate('confirm-add-fund', {state: stateData})
|
||||
|
||||
setInput('')
|
||||
@@ -79,18 +82,27 @@ function AddFund({payment}) {
|
||||
<div className="field w-full mb-6">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Amount(Naira)"
|
||||
label={currency == 'US Dollars' ? "Amount (USD)" : "Amount (Naira)"}
|
||||
type="text"
|
||||
name="amount"
|
||||
placeholder="Amount"
|
||||
placeholder="0"
|
||||
value={input}
|
||||
inputHandler={handleChange}
|
||||
// blurHandler={props.handleBlur}
|
||||
/>
|
||||
{inputError && <p className='text-base text-red-500'>{inputError}</p>}
|
||||
</div>
|
||||
</form>
|
||||
<hr />
|
||||
|
||||
{/* SHOWS THIS IF USER CURRENCY IS DOLLARS */}
|
||||
{currency == 'US Dollars' &&
|
||||
<div className='w-full md:p-8 p-4 bg-white dark:bg-dark-white rounded-2xl shadow'>
|
||||
<AddFundDollars setInputError={setInputError} input={input} setInput={setInput} />
|
||||
</div>
|
||||
}
|
||||
|
||||
{/* HIDES THIS BUTTON IF CURENCY IS NAIRA */}
|
||||
{currency != 'US Dollars' &&
|
||||
<div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'>
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
@@ -100,10 +112,13 @@ function AddFund({payment}) {
|
||||
<span className="text-white">Continue</span>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* HIDES THIS SECTION IF CURENCY IS NAIRA */}
|
||||
{currency != 'US Dollars' &&
|
||||
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
|
||||
<div className="lg:w-2/2 w-full mb-10 lg:mb-0">
|
||||
<div className="wallet w-full md:p-8 p-4 h-full min-h-[590px] bg-white dark:bg-dark-white rounded-2xl shadow">
|
||||
@@ -117,6 +132,7 @@ function AddFund({payment}) {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,462 @@
|
||||
import React,{useState} from 'react'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import InputCom from '../Helpers/Inputs/InputCom';
|
||||
import PaginatedList from '../Pagination/PaginatedList';
|
||||
import { handlePagingFunc } from '../Pagination/HandlePagination';
|
||||
|
||||
import { Form, Formik } from "formik";
|
||||
import * as Yup from "yup";
|
||||
|
||||
const validationSchema = Yup.object().shape({
|
||||
name: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(50, "Maximum 50 characters")
|
||||
.required("Name is required"),
|
||||
cardNum: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(25, "Maximum 25 characters")
|
||||
.required("Card Number is required"),
|
||||
code: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(25, "Maximum 25 characters")
|
||||
.required("Postal Code is required"),
|
||||
state: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(25, "Maximum 25 characters")
|
||||
.required("State is required"),
|
||||
address: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(50, "Maximum 50 characters")
|
||||
.required("Address is required"),
|
||||
expirationYear: Yup.string()
|
||||
.min(4, "Minimum 4 characters")
|
||||
.max(4, "Maximum 4 characters")
|
||||
.required("Expiration Year is required"),
|
||||
expirationMonth: Yup.string()
|
||||
.min(1, "Minimum 1 characters")
|
||||
.max(2, "Maximum 2 characters")
|
||||
.required("Expiration Month is required"),
|
||||
cvv: Yup.string()
|
||||
.min(3, "Minimum 3 characters")
|
||||
.max(4, "Maximum 4 characters")
|
||||
.required("CVV Year is required"),
|
||||
});
|
||||
|
||||
const initialValues = {
|
||||
name: '',
|
||||
cardNum: '',
|
||||
code: '',
|
||||
state: '',
|
||||
address: '',
|
||||
expirationYear: '',
|
||||
expirationMonth: '',
|
||||
cvv: ''
|
||||
};
|
||||
|
||||
|
||||
function AddFundDollars(props) {
|
||||
const navigate = useNavigate()
|
||||
|
||||
let [tab, setTab] = useState("previous"); //STATE FOR SWITCHING BETWEEN TABS
|
||||
|
||||
let [prevCardDetails, setPrevCardDetails] = useState(null) // STATE TO HOLD PREVIOUS CARD SELECTED
|
||||
|
||||
let previousCards = {data:[1,2]} //USER PREVIOUS CARDS // TO BE REPLACED LATER FROM DATA FROM API
|
||||
|
||||
const [currentPage, setCurrentPage] = useState(0);
|
||||
const indexOfFirstItem = Number(currentPage);
|
||||
const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE);
|
||||
const currentPreviousCards = previousCards?.data?.slice(indexOfFirstItem, indexOfLastItem);
|
||||
|
||||
const handlePagination = (e) => {
|
||||
handlePagingFunc(e,setCurrentPage)
|
||||
}
|
||||
|
||||
// FUNCTION TO SUBMIT
|
||||
const handleSubmit = (values, helpers) => {
|
||||
props.setInputError('')
|
||||
if(!props.input || props.input == '0'){
|
||||
props.setInputError('Please Enter Amount')
|
||||
return setTimeout(()=>{props.setInputError('')}, 5000)
|
||||
}
|
||||
|
||||
if(isNaN(props.input)){
|
||||
props.setInputError('Amount must be a Number')
|
||||
return setTimeout(()=>{props.setInputError('')}, 5000)
|
||||
}
|
||||
if(tab == 'previous'){
|
||||
const stateData = {amount: Number(props.input), currency: 'dollars'}
|
||||
navigate('confirm-add-fund', {state: stateData}) // State will change later dummy for now
|
||||
}
|
||||
if(tab == 'new'){
|
||||
const stateData = {amount: Number(props.input), currency: 'dollars', ...values}
|
||||
navigate('confirm-add-fund', {state: stateData}) // State will change later dummy for now
|
||||
}
|
||||
props.setInput('')
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<h1 className='mb-2 text-xl font-bold text-dark-gray dark:text-white'>Payment Method</h1>
|
||||
<div className="w-full">
|
||||
{/* switch button */}
|
||||
<div className="my-1 flex items-center border-b border-slate-300">
|
||||
<button
|
||||
name="previous"
|
||||
onClick={(e) => setTab(e.target.name)}
|
||||
className={`p-2 text-lg font-bold text-slate-600 dark:text-white border ${
|
||||
tab == "previous" ? "border-sky-blue" : "border-slate-300"
|
||||
} tracking-wide transition duration-200`}
|
||||
>
|
||||
Previous Cards
|
||||
</button>
|
||||
<button
|
||||
name="new"
|
||||
onClick={(e) => setTab(e.target.name)}
|
||||
className={`p-2 text-lg font-bold text-slate-600 dark:text-white border ${
|
||||
tab == "new" ? "border-sky-blue" : "border-slate-300"
|
||||
} tracking-wide transition duration-200`}
|
||||
>
|
||||
Add New Card
|
||||
</button>
|
||||
</div>
|
||||
{/* END OF switch button */}
|
||||
|
||||
{/* previous tab */}
|
||||
{tab == 'previous' ?
|
||||
<div className="p-4 previous-details w-full border min-h-[300px] flex flex-col justify-between items-center">
|
||||
{previousCards?.data?.length ?
|
||||
<table className="my-3 w-full">
|
||||
<tbody>
|
||||
{currentPreviousCards.map((item, index)=>(
|
||||
<tr key={index}>
|
||||
<td>
|
||||
<div className='flex items-center gap-5'>
|
||||
<input type="radio" className='w-8 h-8' name='card' value='value' />
|
||||
<div className='card-details'>
|
||||
<h1 className='text-lg font-bold text-dark-gray dark:text-white tracking-wide'>Master Card</h1>
|
||||
<p className='text-base font-bold text-dark-gray dark:text-white tracking-wide'>Bank **************3535</p>
|
||||
<p className='text-sm font-bold text-green-700 dark:text-white tracking-wide'>Verified</p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<button
|
||||
// onClick={handleSubmit}
|
||||
type="button"
|
||||
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
<span className="text-white">Manage</span>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
:
|
||||
<div className='w-full flex flex-col items-center'>
|
||||
<p className='my-5 text-base font-bold text-dark-gray dark:text-white tracking-wide'>No Previous Card Found!</p>
|
||||
<button
|
||||
onClick={()=> setTab('new')}
|
||||
type="button"
|
||||
className="my-5 px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
<span className="text-white">Add Card</span>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
{/* PAGINATION BUTTON */}
|
||||
<div className='w-full'>
|
||||
<PaginatedList onClick={handlePagination} prev={currentPage == 0 ? true : false} next={currentPage+Number(process.env.REACT_APP_ITEM_PER_PAGE) >= previousCards?.data?.length ? true : false} data={previousCards?.data} start={indexOfFirstItem} stop={indexOfLastItem} />
|
||||
</div>
|
||||
{/* END OF PAGINATION BUTTON */}
|
||||
</div>
|
||||
:
|
||||
<div className="new-details w-full min-h-[300px] border-t">
|
||||
<div className="w-full flex flex-col justify-between">
|
||||
<Formik
|
||||
initialValues={initialValues}
|
||||
validationSchema={validationSchema}
|
||||
onSubmit={handleSubmit}
|
||||
>
|
||||
{(props) => {
|
||||
return (
|
||||
<Form>
|
||||
<div className="flex flex-col-reverse sm:flex-row">
|
||||
<div className="flex-1 sm:mr-10">
|
||||
<div className="fields w-full">
|
||||
{/* inputs starts here */}
|
||||
{/* Name */}
|
||||
<div className="field w-full my-6">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
label="Name on Card"
|
||||
type="text"
|
||||
name="name"
|
||||
placeholder="DUMMY NAME"
|
||||
value={props.values.name}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.name && props.touched.name && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.name}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* CARD NUMBER */}
|
||||
<div className="field w-full mb-6">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
iconName='wallet-two'
|
||||
label="Card Number"
|
||||
type="text"
|
||||
name="cardNum"
|
||||
placeholder="Enter Card Number"
|
||||
value={props.values.cardNum}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.cardNum && props.touched.cardNum && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.cardNum}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
{/* EXPIRE YEAR, YEAR AND CVV */}
|
||||
<div className="sm:grid gap-5 grid-cols-3 mb-6">
|
||||
<div className="field w-full mb-6 xl:mb-0 col-span-1">
|
||||
<div className="select-option">
|
||||
<div className={`flex items-center justify-between mb-2.5`}>
|
||||
<label
|
||||
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
|
||||
htmlFor='expiration'
|
||||
>Expiration Month <span className="text-red-700 text-sm tracking-wide">*</span></label>
|
||||
</div>
|
||||
<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 placeholder:text-base text-dark-gray w-full h-full tracking-wide dark:bg-[#11131F] bg-[#f5f8fa] focus:ring-0 focus:outline-none`}
|
||||
value={props.values.expirationMonth}
|
||||
onChange={props.handleChange}
|
||||
onBlur={props.handleBlur}
|
||||
name='expirationMonth'
|
||||
>
|
||||
<option value=''>Select...</option>
|
||||
{expireMonth?.length &&
|
||||
expireMonth.map((item, index) => (
|
||||
<option key={index} value={item.value}>{item.name}</option>
|
||||
))
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
{props.errors.expirationMonth && props.touched.expirationMonth && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.expirationMonth}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="field w-full mb-6 xl:mb-0 col-span-1">
|
||||
<div className="select-option">
|
||||
<div className={`flex items-center justify-between mb-2.5`}>
|
||||
<label
|
||||
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
|
||||
htmlFor='expiration'
|
||||
>Expiration Year <span className="text-red-700 text-sm tracking-wide">*</span>
|
||||
</label>
|
||||
</div>
|
||||
<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 placeholder:text-base text-dark-gray w-full h-full tracking-wide dark:bg-[#11131F] bg-[#f5f8fa] focus:ring-0 focus:outline-none`}
|
||||
value={props.values.expirationYear}
|
||||
onChange={props.handleChange}
|
||||
onBlur={props.handleBlur}
|
||||
name='expirationYear'
|
||||
>
|
||||
<option value=''>Select...</option>
|
||||
{expireYear?.length &&
|
||||
expireYear.map((item, index) => (
|
||||
<option key={index} value={item}>{item}</option>
|
||||
))
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
{props.errors.expirationYear && props.touched.expirationYear && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.expirationYear}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="field w-full col-span-1">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
iconName='wallet-two'
|
||||
label="CVV"
|
||||
type="text"
|
||||
name="cvv"
|
||||
placeholder="CVV"
|
||||
value={props.values.cvv}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.cvv && props.touched.cvv && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.cvv}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{/* Address */}
|
||||
<div className="field w-full my-6">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
label="Billing Address"
|
||||
type="text"
|
||||
name="address"
|
||||
placeholder="Billing Address"
|
||||
value={props.values.Address}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.address && props.touched.address && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.address}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
{/* postal code and state */}
|
||||
<div className="sm:grid gap-5 grid-cols-3 mb-6">
|
||||
<div className="field w-full mb-6 xl:mb-0 col-span-1">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
label="Postal Code"
|
||||
type="text"
|
||||
name="code"
|
||||
placeholder="Postal Code"
|
||||
value={props.values.code}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.code && props.touched.code && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.code}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="field w-full col-span-1">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
spanTag='*'
|
||||
label="State"
|
||||
type="text"
|
||||
name="state"
|
||||
placeholder="State"
|
||||
value={props.values.state}
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
/>
|
||||
{props.errors.state && props.touched.state && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.state}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* <div className="w-full">
|
||||
{requestStatus.message != "" && (
|
||||
<p
|
||||
className={`text-center text-base ${
|
||||
requestStatus.status ? "text-green-800" : "text-red-600"
|
||||
}`}
|
||||
>
|
||||
{requestStatus.message}
|
||||
</p>
|
||||
)}
|
||||
<div className="w-full h-[120px] border-t border-light-purple dark:border-[#5356fb29] flex justify-end items-center">
|
||||
<div className="flex items-center space-x-4 mr-9">
|
||||
<Link
|
||||
to="/"
|
||||
className="text-18 text-light-red tracking-wide "
|
||||
>
|
||||
<span className="border-b dark:border-[#5356fb29] border-light-red">
|
||||
{" "}
|
||||
Cancel
|
||||
</span>
|
||||
</Link>
|
||||
|
||||
{requestStatus.loading ? (
|
||||
<LoadingSpinner size="8" color="sky-blue" />
|
||||
) : (
|
||||
<button
|
||||
type="submit"
|
||||
className="w-[152px] h-[46px] flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
Update Profile
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'>
|
||||
<button
|
||||
type="submit"
|
||||
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
<span className="text-white">Continue</span>
|
||||
</button>
|
||||
</div>
|
||||
</Form>
|
||||
);
|
||||
}}
|
||||
</Formik>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
{ tab == 'previous' &&
|
||||
<div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'>
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
type="button"
|
||||
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
<span className="text-white">Continue</span>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default AddFundDollars
|
||||
|
||||
|
||||
// FORMS ARRAY OF EXPIRATION YEAR FOR CARD
|
||||
const expireYear = []
|
||||
let currentYear = new Date().getFullYear()
|
||||
for(let i=0; i<=6; i++){
|
||||
expireYear.push(currentYear + i)
|
||||
}
|
||||
|
||||
// FORMS ARRAY OF EXPIRATION MONTH FOR CARD
|
||||
let month = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
|
||||
const expireMonth = []
|
||||
for(let i=0; i<month.length; i++){
|
||||
expireMonth.push({name:month[i], value:i+1})
|
||||
}
|
||||
@@ -55,7 +55,7 @@ function Balance({wallet, coupon}) {
|
||||
item.action_type != 'AC_AD_FD_ONLY' ?
|
||||
<Link to='transfer-fund' className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-purple lg:text-xl text-lg font-bold text-white'>Transfer</Link>:''
|
||||
}
|
||||
<Link to='add-fund' className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-green lg:text-xl text-lg font-bold text-white'>
|
||||
<Link to='add-fund' state={{currency:item.description}} className='px-2 py-1 flex items-center gap-2 user-balance cursor-pointer h-[48px] rounded-full relative bg-green lg:text-xl text-lg font-bold text-white'>
|
||||
<span className="">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="38"
|
||||
height="38" viewBox="0 0 42 42" fill="none"><path
|
||||
|
||||
@@ -50,7 +50,6 @@ function ConfirmAddFund({ payment }) {
|
||||
toast.success("Account Topup was sucessful");
|
||||
setTimeout(() => {
|
||||
navigate("/my-wallet", { replace: true });
|
||||
window.location.reload(true);
|
||||
}, 1000);
|
||||
})
|
||||
.catch((err) => {
|
||||
@@ -102,11 +101,11 @@ function ConfirmAddFund({ payment }) {
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
|
||||
<div className="content-wrapper w-full">
|
||||
{pageLoading ? (
|
||||
<LoadingSpinner size="8" color="sky-blue" />
|
||||
) : (
|
||||
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
|
||||
<div className="w-full mb-10">
|
||||
<div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
|
||||
<h2 className="md:p-8 p-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium">
|
||||
Confirm Add Fund To Account
|
||||
@@ -116,7 +115,7 @@ function ConfirmAddFund({ payment }) {
|
||||
<div className="field w-full mb-3">
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Amount (Naira):"
|
||||
label={state.currency == 'naira' ? "Amount (Naira):" : "Amount (Dollars):"}
|
||||
type="text"
|
||||
name="amount"
|
||||
value={state.amount || ""}
|
||||
@@ -127,16 +126,26 @@ function ConfirmAddFund({ payment }) {
|
||||
|
||||
<hr />
|
||||
<div className="md:p-8 p-4 add-fund-btn flex justify-end items-center py-4">
|
||||
<FlutterWaveButton
|
||||
{...fwConfig}
|
||||
{
|
||||
state.currency == 'naira' ?
|
||||
<FlutterWaveButton
|
||||
{...fwConfig}
|
||||
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
/>
|
||||
:
|
||||
<button
|
||||
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
/>
|
||||
onClick={()=>console.log('WORKING')}
|
||||
>
|
||||
Continue
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="lg:w-1/2 w-full mb-10 lg:mb-0">
|
||||
<div className="w-full mb-10">
|
||||
<div className="wallet w-full md:p-8 p-4 h-full min-h-[600px] bg-white dark:bg-dark-white rounded-2xl shadow">
|
||||
<h2 className="text-gray-900 dark:text-white text-xl lg:text-2xl font-medium">
|
||||
Recent Activity
|
||||
|
||||
@@ -48,12 +48,13 @@ export default function ManageInterestOffer(props) {
|
||||
setRequestStatus({loading: false, status: false, message: 'Unable to complete request', processType: ''})
|
||||
return
|
||||
}
|
||||
setInterval(() => { // SETS REDIRECT COUNT DOWN
|
||||
let intervalTime = setInterval(() => { // SETS REDIRECT COUNT DOWN
|
||||
setRedirectTime(prev => prev - 1)
|
||||
}, 1000);
|
||||
setRequestStatus({loading: false, status: true, message: `Offer ${name}ed`, processType: ''})
|
||||
setTimeout(()=>{
|
||||
navigate('/offer-interest', {replace: true})
|
||||
clearInterval(intervalTime)
|
||||
},5000)
|
||||
}).catch(err => {
|
||||
setRequestStatus({loading: false, status: false, message: 'Opps! something went wrong. Try again', processType: ''})
|
||||
|
||||
Reference in New Issue
Block a user