update data currency

src/pages/account/manage-currency/blocks/ListToolBar.tsx

@@ -15,7 +15,7 @@ const ListToolbar = () => {
               <KeenIcon icon="magnifier" />
               <input
                 type="text"
-                placeholder="Search Access Type"
+                placeholder="Search Currency"
                 value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
                 onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
               />

src/pages/account/manage-currency/hooks/ManageCurrencyContext.tsx

@@ -3,7 +3,7 @@ import { Toaster } from '@/components/ui/sonner';
 import { apiConfig } from '@/config/api.config';
 import { useCallApi } from '@/hooks';
 import { ColumnDef } from '@tanstack/react-table';
-import { createContext, useCallback, useMemo, useState } from 'react';
+import { createContext, useCallback, useEffect, useMemo, useState } from 'react';
 import ListToolbar from '../blocks/ListToolBar';
 
 interface SelectedUser {
@@ -56,6 +56,52 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
   const [currencies, setCurrencies] = useState<CurrencyProps[]>([]);
   const { GetData } = useCallApi();
 
+  useEffect(() => {
+    const dummyData: CurrencyProps[] = [
+      {
+        id: '1',
+        name: 'US Dollar',
+        code: 'USD',
+        prefix: '$',
+        trailer: '',
+        format: '#,##0.00',
+        grouping_separator: ',',
+        decimal_separator: '.'
+      },
+      {
+        id: '2',
+        name: 'Euro',
+        code: 'EUR',
+        prefix: '€',
+        trailer: '',
+        format: '#.##0,00',
+        grouping_separator: '.',
+        decimal_separator: ','
+      },
+      {
+        id: '3',
+        name: 'Japanese Yen',
+        code: 'JPY',
+        prefix: '¥',
+        trailer: '',
+        format: '#,##0',
+        grouping_separator: ',',
+        decimal_separator: '.'
+      },
+      {
+        id: '4',
+        name: 'Indonesia Rupiah',
+        code: 'IDR',
+        prefix: 'Rp',
+        trailer: '',
+        format: '#,##0',
+        grouping_separator: '.',
+        decimal_separator: ','
+      }
+    ];
+    setCurrencies(dummyData);
+  }, []);
+
   const handleEditDialog = useCallback((show: boolean, selected_user: string | null) => {
     setSelectedUser(show ? selected_user : null);
     setShowEditDialog(show);
@@ -108,7 +154,7 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
         }
       },
       {
-        accessorFn: (row) => row.Trailer,
+        accessorFn: (row) => row.trailer,
         id: 'trailer',
         header: ({ column }) => <DataGridColumnHeader title="Trailer" column={column} />,
         enableSorting: true,
@@ -171,11 +217,11 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
     ],
     [handleAddDialog, handleEditDialog]
   );
-
+  console.log(currencies);
   return (
     <div>
       <div className="container mx-auto py-5">
-        <h1>Manage Access Type</h1>
+        <h1>Manage Currency</h1>
       </div>
       <ManageCurrencyContext.Provider
         value={{
@@ -188,8 +234,11 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
         }}
       >
         <Toaster expand visibleToasts={9} duration={3000} />
+
+        {currencies.length > 0 ? (
           <DataGridProvider
             columns={columns}
+            data={currencies}
             pagination={{ size: 10 }}
             layout={{ card: true }}
             toolbar={<ListToolbar />}
@@ -198,6 +247,9 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
           >
             {children}
           </DataGridProvider>
+        ) : (
+          <p>loading</p>
+        )}
       </ManageCurrencyContext.Provider>
     </div>
   );