From 6927d53c59cc4e9da56655cc0b99e1247347a7c9 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Mon, 6 Oct 2025 20:01:48 +0100
Subject: [PATCH] fixed endpoint

---
 src/components/country/CountrySettings.jsx | 220 +++++++--------------
 1 file changed, 66 insertions(+), 154 deletions(-)

diff --git a/src/components/country/CountrySettings.jsx b/src/components/country/CountrySettings.jsx
index 3f4578b..63191da 100644
--- a/src/components/country/CountrySettings.jsx
+++ b/src/components/country/CountrySettings.jsx
@@ -3,36 +3,13 @@ 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";
+import TableWrapper from "../tableWrapper/TableWrapper";
 
 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
@@ -41,9 +18,8 @@ export default function CountrySettings(){
         },
         staleTime: 0 //0 mins
     })
-    const countryData = data?.data?.templates // PRODUCTS TEMPLATE LIST
-    const pagination = data?.data?.pagination
-    console.log('DATA', data?.data)
+    const countryData = data?.data?.country_data // COUNTRY LIST
+
 
     return (
         <div className='w-full flex flex-col gap-8'>
@@ -52,135 +28,71 @@ 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">
-                        <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>
-                        <tr  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-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">NG</div>
-                                    </div>
-                                </div>
-                            </td>
-                            <td className="px-8">
-                                <div className="text-left">
-                                    <div className="text-base font-semibold">Nigeria</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>
-                        </tbody>
-                    </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'>
+                    {isFetching ?
+                        <p className='text-slate-800'>Loading...</p>
+                    : isError ?
+                        <p className='text-red-500'>{error.message}</p>
+                    :
+                        <TableWrapper data={countryData} itemsPerPage={20}>
+                            {({ 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="text-left">
-                                                        <div className="text-base font-semibold">US</div>
+                                                        <div className="text-base font-semibold">{item?.code}</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>
+                                                </td>
+                                                <td className="px-8">
+                                                    <div className="text-left">
+                                                        <div className="text-base font-semibold">{item?.description}</div>
+                                                    </div>
+                                                </td>
+                                                <td className="px-8">
+                                                    <div className="text-right">
+                                                        <div className="text-base font-semibold">{item?.status}</div>
+                                                    </div>
+                                                </td>
+                                                <td className="px-8">
+                                                    <div className="text-right">
+                                                        <div className="text-base font-semibold">{item?.signup}</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>
+                                </>
+                            )}
+                        </TableWrapper>
+                    }
                 </>
 
             </div>
-- 
2.34.1