added country endpoint

This commit was merged in pull request #21.
This commit is contained in:
victorAnumudu
2025-10-06 17:50:38 +01:00
parent 54a0361620
commit 20c224b625
3 changed files with 114 additions and 3 deletions
+107 -3
View File
@@ -1,7 +1,50 @@
import { useState } from "react";
import { useQuery } from '@tanstack/react-query'
import queryKeys from '../../services/queryKeys'
import BreadcrumbCom from "../breadcrumb/BreadcrumbCom";
import { getCountry } from "../../services/siteServices";
import TablePaginatedWrapper from "../tableWrapper/TablePaginatedWrapper";
export default function CountrySettings(){
const [page, setPage] = useState(1)
const [filter, setFilter] = useState({type: '', id: ''})
const [willFilter, setWillFilter] = useState(false)
const handleFilter = ({target:{name, value}}) => {
setFilter(prev => ({...prev, [name]:value}))
}
const handleFilterByParams = () => {
if(filter.type && !filter.id){
return
}else if(!filter.type){
setPage(1)
setWillFilter(prev => !prev)
setFilter({type: '', id: ''})
}else{
setPage(1)
setWillFilter(prev => !prev)
}
}
const {data, isFetching, isError, error} = useQuery({
// queryKey: [...queryKeys.country_list, page, willFilter],
queryKey: queryKeys.country_list,
queryFn: () => {
// const filterData = filter?.type ? {[filter?.type]: filter.id} : {}
const reqData = {
// page,
// ...filterData
}
return getCountry(reqData)
},
staleTime: 0 //0 mins
})
const countryData = data?.data?.templates // PRODUCTS TEMPLATE LIST
const pagination = data?.data?.pagination
console.log('DATA', data?.data)
return (
<div className='w-full flex flex-col gap-8'>
<BreadcrumbCom title='Country Settings' paths={['Dashboard', 'Country']} />
@@ -9,7 +52,7 @@ export default function CountrySettings(){
<div className='box bg-white dark:bg-black-box text-black-body dark:text-white-body'>
<>
<table className="py-2 w-full text-sm">
{/* <table className="py-2 w-full text-sm">
<thead className="py-2 text-sm text-slate-500 text-left">
<tr>
<th scope="col" className="px-2 py-2">
@@ -76,8 +119,69 @@ export default function CountrySettings(){
</td>
</tr>
</tbody>
</table>
</>
</table> */}
<TablePaginatedWrapper data={countryData} isFetching={isFetching} setPage={setPage} itemsPerPage={pagination?.limit} pagination={pagination}>
{({ data }) => (
<>
<table className="py-2 w-full text-sm">
<thead className="py-2 text-sm text-slate-500 text-left">
<tr>
<th scope="col" className="px-2 py-2">
Code
</th>
<th scope="col" className="px-8">
Country
</th>
<th scope="col" className="px-2 text-right">
Status
</th>
<th scope="col" className="px-2 text-right">
Signup
</th>
</tr>
</thead>
<tbody>
{(data && data.length > 0) ? data?.map((item, index) => (
<tr key={index} className="py-2 border-t border-dashed border-slate-300">
<td className="px-2 py-2">
<div className='w-full min-w-48 flex items-center gap-2 whitespace-nowrap'>
<div className="text-left">
<div className="text-base font-semibold">US</div>
</div>
</div>
</td>
<td className="px-8">
<div className="text-left">
<div className="text-base font-semibold">United States</div>
</div>
</td>
<td className="px-8">
<div className="text-left">
<div className="text-base font-semibold">[chkbox]</div>
</div>
</td>
<td className="px-8">
<div className="text-left">
<div className="text-base font-semibold">[chkbox]</div>
</div>
</td>
</tr>
))
:
<tr className="py-2 border-t border-dashed border-slate-300">
<td className="px-3 py-2" colSpan={4}>
<div className="flex justify-center items-center">
No Record Found
</div>
</td>
</tr>
}
</tbody>
</table>
</>
)}
</TablePaginatedWrapper>
</>
</div>
</div>
+1
View File
@@ -22,6 +22,7 @@ const queryKeys = {
account_view: ['account_view'],
subscriptions_view: ['subscriptions_view'],
users_admin: ['users_admin'],
country_list: ['country_list'],
}
export default queryKeys
+6
View File
@@ -62,6 +62,12 @@ export const getCustomers = (reqData) => {
return getAuxEnd(`/customers`, postData)
}
// FUNCTION TO GET COUNTRY
export const getCountry = (reqData) => {
const postData = { ...reqData }
return getAuxEnd(`/country`, postData)
}
// FUNCTION TO GET BILLINGS
export const getBillings = (reqData) => {
const postData = { ...reqData }