update data currency
This commit is contained in:
@ -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)}
|
||||
/>
|
||||
|
||||
@ -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,16 +234,22 @@ const ManageCurrencyContextProvider = ({ children }: { children: React.ReactNode
|
||||
}}
|
||||
>
|
||||
<Toaster expand visibleToasts={9} duration={3000} />
|
||||
<DataGridProvider
|
||||
columns={columns}
|
||||
pagination={{ size: 10 }}
|
||||
layout={{ card: true }}
|
||||
toolbar={<ListToolbar />}
|
||||
sorting={[{ id: 'id', desc: true }]}
|
||||
serverSide={true}
|
||||
>
|
||||
{children}
|
||||
</DataGridProvider>
|
||||
|
||||
{currencies.length > 0 ? (
|
||||
<DataGridProvider
|
||||
columns={columns}
|
||||
data={currencies}
|
||||
pagination={{ size: 10 }}
|
||||
layout={{ card: true }}
|
||||
toolbar={<ListToolbar />}
|
||||
sorting={[{ id: 'id', desc: true }]}
|
||||
serverSide={true}
|
||||
>
|
||||
{children}
|
||||
</DataGridProvider>
|
||||
) : (
|
||||
<p>loading</p>
|
||||
)}
|
||||
</ManageCurrencyContext.Provider>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user