diff --git a/src/App.js b/src/App.js index b4acaa9..ef7d8a1 100644 --- a/src/App.js +++ b/src/App.js @@ -8,6 +8,18 @@ import { generalLayoutContext } from './context/GeneralLayoutContext'; import './App.css'; +const queryClient = new QueryClient({ + defaultOptions: { + queries: { + refetchOnWindowFocus: false, + retry: 3, + staleTime: 300000 //5 mins + // refetchOnMount: false, + // staleTime: Infinity // can also be a number in millisecond + }, + }, +}) + function App() { const {pathname} = useLocation() @@ -18,17 +30,6 @@ function App() { window.scrollTo(0,0) },[pathname]) - const queryClient = new QueryClient({ - defaultOptions: { - queries: { - refetchOnWindowFocus: false, - retry: 3, - staleTime: 300000 //5 mins - // refetchOnMount: false, - // staleTime: Infinity // can also be a number in millisecond - }, - }, - }) return ( <> diff --git a/src/assets/simbrella-bko-logo.png b/src/assets/simbrella-bko-logo.png new file mode 100644 index 0000000..5c0bd90 Binary files /dev/null and b/src/assets/simbrella-bko-logo.png differ diff --git a/src/components/auth/LoginCom.jsx b/src/components/auth/LoginCom.jsx index 00aa232..f560a71 100644 --- a/src/components/auth/LoginCom.jsx +++ b/src/components/auth/LoginCom.jsx @@ -11,6 +11,7 @@ import { loginUser } from '../../services/siteServices' import RouteLinks from '../../RouteLinks' import Icons from '../Icons' +import localImgLoader from '../../helpers/localImageLoader' const initialValues = { @@ -83,13 +84,17 @@ export default function LoginCom() { {(props)=>(
+
+ +
+

Sign In

Welcome back, please login to your account

{/* social login */} -
+ {/*
Sign in with Google @@ -102,7 +107,7 @@ export default function LoginCom() {

Or with email

-
+
*/}
@@ -146,11 +151,11 @@ export default function LoginCom() { {/*

Not yet a member? Sign Up

*/} -
+ {/*
Terms Plans Contact Us -
+
*/}
diff --git a/src/components/layouts/DashboardHeader.jsx b/src/components/layouts/DashboardHeader.jsx index 67c0190..b0b9142 100644 --- a/src/components/layouts/DashboardHeader.jsx +++ b/src/components/layouts/DashboardHeader.jsx @@ -57,6 +57,8 @@ export default function DashboardHeader() {
handleActiveMenu('avatar')} className='relative cursor-pointer w-10 h-10 rounded shadow-round_black dark:shadow-round_white'> user avatar {activeMenu == 'avatar' && + <> +
@@ -74,6 +76,7 @@ export default function DashboardHeader() {
+ }
diff --git a/src/components/layouts/aside/DashboardAside.jsx b/src/components/layouts/aside/DashboardAside.jsx index 5d35fc9..3756ae6 100644 --- a/src/components/layouts/aside/DashboardAside.jsx +++ b/src/components/layouts/aside/DashboardAside.jsx @@ -9,6 +9,7 @@ import { generalLayoutContext } from "../../../context/GeneralLayoutContext"; import { TbLogout2 } from "react-icons/tb"; import UserAvatar from '../../../assets/user_avatar.jpg' import Icons from "../../Icons"; +import localImgLoader from '../../../helpers/localImageLoader'; export default function DashboardAside() { @@ -22,7 +23,8 @@ export default function DashboardAside() { return (
- + {/* */} +
{/*
*/} diff --git a/src/components/layouts/rightaside/Orders.jsx b/src/components/layouts/rightaside/Orders.jsx index 420064b..15215c4 100644 --- a/src/components/layouts/rightaside/Orders.jsx +++ b/src/components/layouts/rightaside/Orders.jsx @@ -2,77 +2,25 @@ import React from 'react' import Img from '../../../assets/user_avatar.jpg' import CustomCounter from '../../CustomCounter' -export default function Orders() { +export default function Orders({data}) { return (
- {/*
*/} - {/*

Recent Eligibility

*/} - {/*
*/} - {/*
*/} - {/*

*/} - {/* */} - {/*

*/} - {/*

Pending

*/} - {/*
*/} - {/*
*/} - {/*

*/} - {/* */} - {/*

*/} - {/*

Approved

*/} - {/*
*/} - {/*
*/} - {/*

*/} - {/* */} - {/*

*/} - {/*

Rejected

*/} - {/*
*/} - {/*
*/} - {/*

*/} - {/* */} - {/*

*/} - {/*

Created

*/} - {/*
*/} - {/*
*/} - {/*
*/}

Recent Loans

-
-
- Order Image -
-
-

Project Briefing

-

Project Manager

-
-
-
-
- Order Image -
-
-

Project Briefing

-

Project Manager

-
-
-
-
- Order Image -
-
-

Project Briefing

-

Project Manager

-
-
-
-
- Order Image -
-
-

Project Briefing

-

Project Manager

-
-
+ {data.map((item, index)=>{ + return ( +
+
+ Order Image +
+
+

Project Briefing

+

Project Manager

+
+
+ ) + })}
diff --git a/src/components/layouts/rightaside/RightAsideBar.jsx b/src/components/layouts/rightaside/RightAsideBar.jsx index f0b7df9..e39a145 100644 --- a/src/components/layouts/rightaside/RightAsideBar.jsx +++ b/src/components/layouts/rightaside/RightAsideBar.jsx @@ -1,4 +1,7 @@ import React, { useState } from 'react' +import { useQuery } from "@tanstack/react-query"; +import queryKeys from '../../../services/queryKeys' +import { getRecentLoans } from '../../../services/siteServices' import Icons from '../../Icons' import Orders from './Orders' import Tickets from './Tickets' @@ -13,25 +16,41 @@ export default function RightAsideBar() { setActive(lowerStr) } - return ( -
- {/* Menu */} -
- - {/**/} - {/**/} -
+ const {data, isFetching, isError, error} = useQuery({ + queryKey: queryKeys.recent_loans, + queryFn: () => getRecentLoans() + }) - {/* Body */} - {active === 'orders' && } - {/*{active == 'tickets' && }*/} - {/*{active == 'tasks' && }*/} -
- ) + console.log('data', data?.data) + + return ( +
+ {/* Menu */} +
+ + {/**/} + {/**/} +
+ + {/* Body */} + {(isFetching || isError) ? +
+ {isError ?

{error.message}

: +

Loading...

} +
+ : +
+ {active === 'orders' && } + {/*{active == 'tickets' && }*/} + {/*{active == 'tasks' && }*/} +
+ } +
+ ) } diff --git a/src/components/transactions/TransactionsCom.jsx b/src/components/transactions/TransactionsCom.jsx index 3dbb178..a07ac37 100644 --- a/src/components/transactions/TransactionsCom.jsx +++ b/src/components/transactions/TransactionsCom.jsx @@ -1,4 +1,5 @@ import {useEffect, useState} from 'react' +import { useQuery } from '@tanstack/react-query' import {Link} from 'react-router-dom' import BreadcrumbCom from '../breadcrumb/BreadcrumbCom' @@ -10,50 +11,45 @@ import getTimeFromDateString from '../../helpers/GetTimeFromDateString'; import localImgLoader from '../../helpers/localImageLoader'; import RouteLinks from '../../RouteLinks'; import localSiteIcons from '../../helpers/localSiteIcons'; +import queryKeys from '../../services/queryKeys' export default function TransactionsCom() { const [page, setPage] = useState(1) - const [allTransactions, setAllTransaction] = useState({loading: true, error: '', data: {}}) - - const [willFilter, setWillFilter] = useState(false) const [filter, setFilter] = useState({type: '', id: ''}) - const handleFilter = ({target: {name, value}}) => { - setFilter(prev => ({...prev, [name]: value})) + const [willFilter, setWillFilter] = useState(false) + + const handleFilter = ({target:{name, value}}) => { + setFilter(prev => ({...prev, [name]:value})) } const handleFilterByParams = () => { - if (filter.type && !filter.id) { + if(filter.type && !filter.id){ return - } else if (!filter.type) { + }else if(!filter.type){ setPage(1) setWillFilter(prev => !prev) setFilter({type: '', id: ''}) - } else { + }else{ setPage(1) setWillFilter(prev => !prev) } } - const transactions = allTransactions?.data?.transactions // TRANSACTIONS LIST - const pagination = allTransactions?.data?.pagination - const isFetching = allTransactions?.loading - const isError = allTransactions?.error - - useEffect(() => { - setAllTransaction(prev => ({...prev, loading: true})) - const payload = filter?.type ? {[filter?.type]: filter.id} : {} - getTransactions({...payload, page}).then(res => { - if (res?.status != 200) { - setAllTransaction(prev => ({...prev, loading: false})) - return + const {data, isFetching, isError, error} = useQuery({ + queryKey: [...queryKeys.transactions, page, willFilter], + queryFn: () => { + const filterData = filter?.type ? {[filter?.type]: filter.id} : {} + const reqData = { + page, + ...filterData } - setAllTransaction({loading: false, error: '', data: res?.data}) - }).catch(err => { - setAllTransaction({loading: false, error: 'error occurred', data: {}}) - console.log('ERR', err) - }) - }, [page, willFilter]) + return getTransactions(reqData) + }, + staleTime: 0 //0 mins + }) + const transactions = data?.data?.transactions // TRANSACTIONS LIST + const pagination = data?.data?.pagination return (
@@ -61,7 +57,7 @@ export default function TransactionsCom() {
{isError ? -

{allTransactions?.error}

+

{error?.message}

: <> {/* filter section */} diff --git a/src/services/queryKeys.js b/src/services/queryKeys.js index 86ff66a..e4146f0 100644 --- a/src/services/queryKeys.js +++ b/src/services/queryKeys.js @@ -1,7 +1,6 @@ const queryKeys = { dashboard: ['dashboard'], loans: ['loans'], - transactions: ['transactions'], repayment_schedule: ['repayment-schedule'], loan_charges: ['loan-charges'], offers: ['offers'], @@ -9,6 +8,10 @@ const queryKeys = { select_loan: ['select-loan'], approved_loan: ['approved-loan'], loan_offers: ['loan-offers'], + + //new + transactions: ['transactions'], + recent_loans: ['recent_loans'], } export default queryKeys \ No newline at end of file diff --git a/src/services/siteEventService.js b/src/services/siteEventService.js index 032b796..a73150d 100644 --- a/src/services/siteEventService.js +++ b/src/services/siteEventService.js @@ -15,7 +15,7 @@ axios.interceptors.request.use( } ); const postAuxEnd = (path, postData, media=false) => { - const basePath = media ? process.env.REACT_APP_EVENT_API : 'http://10.2.249.133:5000' + const basePath = media ? process.env.REACT_APP_EVENT_API : process.env.REACT_APP_EVENT_API return axios.post(`${basePath}${path}`, postData).then(res => { return res }).catch(err => { @@ -25,7 +25,7 @@ const postAuxEnd = (path, postData, media=false) => { } const getAuxEnd = (path, reqData= null) => { - const basePath = media ? process.env.REACT_APP_EVENT_API : 'http://10.2.249.133:5000' + const basePath = media ? process.env.REACT_APP_EVENT_API : process.env.REACT_APP_EVENT_API return axios.get(`${basePath}${path}`,{ params: reqData }).then(res => { return res diff --git a/src/services/siteServices.js b/src/services/siteServices.js index 0ce3a2f..3655008 100644 --- a/src/services/siteServices.js +++ b/src/services/siteServices.js @@ -90,4 +90,10 @@ export const getOffers = (reqData) => { export const getRepaymentSchedule = (reqData) => { const postData = { ...reqData } return getAuxEnd(`/repayment-schedules`, postData) +} + +// FUNCTION TO GET RECENT LOANS +export const getRecentLoans = (reqData) => { + const postData = { ...reqData } + return getAuxEnd(`/recent-loans`, postData) } \ No newline at end of file