From 1ecd62c7774ddf2c3f4bca3f49f7c1441bde376e Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Thu, 17 Apr 2025 10:42:15 +0700 Subject: [PATCH 01/12] update set delay loading skeleton on master data --- src/pages/master/aldeias/blocks/AddDialog.tsx | 14 +++++++------- src/pages/master/aldeias/blocks/DeleteDialog.tsx | 11 ++++++++++- src/pages/master/aldeias/blocks/EditDialog.tsx | 11 +++++++---- src/pages/master/conversion/blocks/EditDialog.tsx | 5 ++++- src/pages/master/currency/blocks/EditDialog.tsx | 5 ++++- src/pages/master/municipios/blocks/EditDialog.tsx | 4 +++- src/pages/master/postoadms/blocks/EditDialog.tsx | 4 +++- src/pages/master/products/blocks/EditDialog.tsx | 6 +++++- src/pages/master/profession/blocks/EditDialog.tsx | 4 +++- src/pages/master/provider/blocks/EditDialog.tsx | 4 +++- src/pages/master/reward/blocks/EditDialog.tsx | 5 +++-- src/pages/master/sucos/blocks/EditDialog.tsx | 4 +++- .../master/sucos/hooks/ManageSucosContext.tsx | 1 - src/pages/master/wallet/blocks/EditDialog.tsx | 5 +++-- 14 files changed, 58 insertions(+), 25 deletions(-) diff --git a/src/pages/master/aldeias/blocks/AddDialog.tsx b/src/pages/master/aldeias/blocks/AddDialog.tsx index a1c566c..7d33c9b 100644 --- a/src/pages/master/aldeias/blocks/AddDialog.tsx +++ b/src/pages/master/aldeias/blocks/AddDialog.tsx @@ -27,8 +27,8 @@ import { import { doSaveLogActivity } from '@/actions/GlobalActions'; interface SucosProps { - sucos_id: number; - sucos_name: string; + id: number; + name: string; } const API_URL = apiConfig.service_master_data; @@ -181,7 +181,7 @@ const AddDialog = () => { className="input col-span-5 text-left" style={{ color: 'inherit' }} > - {sucos.find((suco) => suco.sucos_id === formField.sucosId)?.sucos_name || + {sucos.find((suco) => suco.id === formField.sucosId)?.name || 'Select Sucos'} @@ -196,17 +196,17 @@ const AddDialog = () => { {sucos.map((suco) => ( { setFormField({ ...formField, - sucosId: suco.sucos_id + sucosId: suco.id }); setOpen(false); }} > - {suco.sucos_name} + {suco.name} ))} diff --git a/src/pages/master/aldeias/blocks/DeleteDialog.tsx b/src/pages/master/aldeias/blocks/DeleteDialog.tsx index 44f0a81..e98df8c 100644 --- a/src/pages/master/aldeias/blocks/DeleteDialog.tsx +++ b/src/pages/master/aldeias/blocks/DeleteDialog.tsx @@ -4,7 +4,14 @@ import { Alert, useDataGrid } from '@/components'; import { useCallApi } from '@/hooks'; import { useCallback, useState } from 'react'; import { toast } from 'sonner'; -import { Dialog, DialogContent, DialogFooter, DialogHeader } from '@/components/ui/dialog'; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle +} from '@/components/ui/dialog'; import { Button } from '@/components/ui/button'; import { doSaveLogActivity } from '@/actions/GlobalActions'; @@ -52,6 +59,8 @@ const DeleteDialog = () => { handleDeleteDialog(open, null)}> + +

Are you sure?

You will delete this data! diff --git a/src/pages/master/aldeias/blocks/EditDialog.tsx b/src/pages/master/aldeias/blocks/EditDialog.tsx index 76c7c10..a7bcb66 100644 --- a/src/pages/master/aldeias/blocks/EditDialog.tsx +++ b/src/pages/master/aldeias/blocks/EditDialog.tsx @@ -98,7 +98,7 @@ const EditDialog = () => { }); setSucos(response?.data.list); - console.log(sucos); + // console.log(sucos); } catch (error) { console.error('Error fetching Sucos', error); setAlert({ show: true, message: 'Failed to get Sucos. Please try again.' }); @@ -107,7 +107,10 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/aldeias/getdata/${id}`, { id }); + + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/aldeias/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); if (response?.status) { setFormField((prev) => ({ @@ -221,8 +224,8 @@ const EditDialog = () => { className="input col-span-5 text-left" style={{ color: 'inherit' }} > - {sucos.find((suco) => suco.id === formField.sucosId) - ?.name || 'Select Sucos'} + {sucos.find((suco) => suco.id === formField.sucosId)?.name || + 'Select Sucos'} diff --git a/src/pages/master/conversion/blocks/EditDialog.tsx b/src/pages/master/conversion/blocks/EditDialog.tsx index 48daf9c..0b98ae6 100644 --- a/src/pages/master/conversion/blocks/EditDialog.tsx +++ b/src/pages/master/conversion/blocks/EditDialog.tsx @@ -120,7 +120,10 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/dashboard/conversion/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/dashboard/conversion/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); + console.log('Transaction Type: ', response?.data); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/currency/blocks/EditDialog.tsx b/src/pages/master/currency/blocks/EditDialog.tsx index 96fb0c4..e0dffd8 100644 --- a/src/pages/master/currency/blocks/EditDialog.tsx +++ b/src/pages/master/currency/blocks/EditDialog.tsx @@ -101,7 +101,10 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/dashboard/currency/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/dashboard/currency/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); + // console.log('Transaction Type: ', response?.data); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/municipios/blocks/EditDialog.tsx b/src/pages/master/municipios/blocks/EditDialog.tsx index ceeac80..ef7b3d3 100644 --- a/src/pages/master/municipios/blocks/EditDialog.tsx +++ b/src/pages/master/municipios/blocks/EditDialog.tsx @@ -77,7 +77,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/municipios/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/municipios/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx index c5f165f..d33d318 100644 --- a/src/pages/master/postoadms/blocks/EditDialog.tsx +++ b/src/pages/master/postoadms/blocks/EditDialog.tsx @@ -114,7 +114,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/postoadms/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = await GetData(`${API_URL}/postoadms/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/products/blocks/EditDialog.tsx b/src/pages/master/products/blocks/EditDialog.tsx index a6395cd..f82dbc0 100644 --- a/src/pages/master/products/blocks/EditDialog.tsx +++ b/src/pages/master/products/blocks/EditDialog.tsx @@ -125,7 +125,11 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/product/getdata/${id}`, { id }); + + const minDelay = new Promise((resolve) => setTimeout(resolve, 500)); + const fetchData = GetData(`${API_URL}/product/getdata/${id}`, { id }); + + const [response] = await Promise.all([fetchData, minDelay]); // console.log(response); if (response?.status) { diff --git a/src/pages/master/profession/blocks/EditDialog.tsx b/src/pages/master/profession/blocks/EditDialog.tsx index fc8a83f..ea012e4 100644 --- a/src/pages/master/profession/blocks/EditDialog.tsx +++ b/src/pages/master/profession/blocks/EditDialog.tsx @@ -74,7 +74,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/profession/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/profession/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx index 5c33f37..958f749 100644 --- a/src/pages/master/provider/blocks/EditDialog.tsx +++ b/src/pages/master/provider/blocks/EditDialog.tsx @@ -148,7 +148,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL_MASTERDATA}/provider/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL_MASTERDATA}/provider/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); // console.log(response); if (response?.status) { setFormField((prev) => ({ diff --git a/src/pages/master/reward/blocks/EditDialog.tsx b/src/pages/master/reward/blocks/EditDialog.tsx index d61ec96..1a8fd68 100644 --- a/src/pages/master/reward/blocks/EditDialog.tsx +++ b/src/pages/master/reward/blocks/EditDialog.tsx @@ -95,8 +95,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - // console.log('Ini datanya:', id); - const response = await GetData(`${API_URL}/reward/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/reward/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); // console.log('API Response:', response); if (response?.status) { diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx index fabdbf2..d6d6933 100644 --- a/src/pages/master/sucos/blocks/EditDialog.tsx +++ b/src/pages/master/sucos/blocks/EditDialog.tsx @@ -113,7 +113,9 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL}/sucos/getdata/${id}`, { id }); + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL}/sucos/getdata/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); // console.log('Data Sucos:', response?.data); if (response?.status) { diff --git a/src/pages/master/sucos/hooks/ManageSucosContext.tsx b/src/pages/master/sucos/hooks/ManageSucosContext.tsx index 2d106a7..605a2a9 100644 --- a/src/pages/master/sucos/hooks/ManageSucosContext.tsx +++ b/src/pages/master/sucos/hooks/ManageSucosContext.tsx @@ -163,7 +163,6 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode }) order_direction: sorting[0].desc == false ? 'ASC' : 'DESC', filter: JSON.stringify(filter) }); - console.log('Sucos List Response:', response?.data); setSucos(response?.data.list || []); return { data: response?.data.list, totalCount: response?.data.total_count }; } catch (error) { diff --git a/src/pages/master/wallet/blocks/EditDialog.tsx b/src/pages/master/wallet/blocks/EditDialog.tsx index de4f5dc..ffcc1e5 100644 --- a/src/pages/master/wallet/blocks/EditDialog.tsx +++ b/src/pages/master/wallet/blocks/EditDialog.tsx @@ -117,11 +117,12 @@ const EditDialog = () => { const doFetchData = useCallback(async (id: string) => { setIsLoading(true); - const response = await GetData(`${API_URL_MASTER_DATA}/wallet/detail/${id}`, { + const minDelay = new Promise((resolve) => setTimeout(resolve, 300)); + const fetchData = GetData(`${API_URL_MASTER_DATA}/wallet/detail/${id}`, { id }); + const [response] = await Promise.all([fetchData, minDelay]); - console.log(response); if (response?.status) { setFormField((prev) => ({ ...prev, From 7b95761e92bdbf31b402392f25db4b9bc6337320 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Thu, 17 Apr 2025 11:06:02 +0700 Subject: [PATCH 02/12] fix formfield edit on manage provider - set optional on transaction_type id and set default null --- src/pages/master/provider/blocks/EditDialog.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/pages/master/provider/blocks/EditDialog.tsx b/src/pages/master/provider/blocks/EditDialog.tsx index 958f749..f7b2c1e 100644 --- a/src/pages/master/provider/blocks/EditDialog.tsx +++ b/src/pages/master/provider/blocks/EditDialog.tsx @@ -155,11 +155,11 @@ const EditDialog = () => { if (response?.status) { setFormField((prev) => ({ ...prev, - name: response?.data.name, + name: response?.data.name || null, description: response?.data.description, type: response?.data.type, status: response?.data.status, - transaction_type: response?.data.transaction_type.id, + transaction_type: response?.data.transaction_type?.id || null, agent: response?.data.agent?.id || null })); } @@ -174,7 +174,8 @@ const EditDialog = () => { formField.description.trim() === '' || formField.type.trim() === '' || formField.status.trim() === '' || - formField.transaction_type.trim() === '' + formField.transaction_type.trim() === '' || + formField.agent === null ) { setAlert({ show: true, message: 'Please fill in all required fields.' }); return; From 3034886eef14053a3d4dc8dd0213999d10fc79a6 Mon Sep 17 00:00:00 2001 From: Raja Oktafrianto Date: Thu, 17 Apr 2025 11:14:53 +0700 Subject: [PATCH 03/12] update search --- src/pages/notification/blocks/ListToolbar.tsx | 23 ++++--------------- .../manage-position/blocks/ListToolBar.tsx | 20 ++++------------ .../user/manage-user/blocks/ListToolBar.tsx | 23 +++++-------------- 3 files changed, 15 insertions(+), 51 deletions(-) diff --git a/src/pages/notification/blocks/ListToolbar.tsx b/src/pages/notification/blocks/ListToolbar.tsx index 2f4c918..823454b 100644 --- a/src/pages/notification/blocks/ListToolbar.tsx +++ b/src/pages/notification/blocks/ListToolbar.tsx @@ -1,22 +1,10 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useManageNotificationContext } from '../hooks/useManageNotificationContext'; import { Button } from '@/components/ui/button'; -import React, { useState } from 'react'; const ListToolBar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog } = useManageNotificationContext(); - const [searchValue, setSearchValue] = useState(''); - - const handleKeydown = (event: React.KeyboardEvent) => { - if (event.key === 'Enter') { - handleSearch(); - } - }; - - const handleSearch = () => { - table.getColumn('content')?.setFilterValue(searchValue); - }; return (
@@ -27,13 +15,12 @@ const ListToolBar = () => { setSearchValue(event.target.value)} - onKeyDown={handleKeydown} + placeholder="Search notifications" + value={table.getColumn(`content`)?.getFilterValue() as string} + onChange={(event) => table.getColumn('content')?.setFilterValue(event.target.value)} /> - + {/* - + */}
- + */}
diff --git a/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx b/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx index daa8cec..a884d14 100644 --- a/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx +++ b/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx @@ -1,22 +1,10 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useUserContext } from '../hooks'; import { Button } from '@/components/ui/button'; -import React, { useState } from 'react'; const ListToolBar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog } = useUserContext(); - const [searchValue, setSearchValue] = useState(''); - - const handleSearch = () => { - table.getColumn('username')?.setFilterValue(searchValue); - }; - - const handleKeyDown = (event: React.KeyboardEvent) => { - if (event.key === 'Enter') { - handleSearch(); - } - }; return (
@@ -28,12 +16,13 @@ const ListToolBar = () => { setSearchValue(event.target.value)} - onKeyDown={handleKeyDown} + value={table.getColumn(`username`)?.getFilterValue() as string} + onChange={(event) => + table.getColumn('username')?.setFilterValue(event.target.value) + } /> - + {/* - + */}
- {/*
+
@@ -181,10 +203,12 @@ const AddDialog = () => { type="button" className="input col-span-5 text-left flex justify-between" style={{ color: 'inherit' }} + disabled={formField.all_customer !== 'false'} > - {customers.find((customer) => customer.id === formField.customers) - ?.username || 'Select Customer'} + {formField.customers.length === 0 + ? 'Select Customers' + : `${formField.customers.length} Customers Selected`} @@ -206,11 +230,16 @@ const AddDialog = () => { key={customer.id} value={customer.username} onSelect={() => { - setFormField({ - ...formField, - customers: customer.id + const customerId = customer.id; + setFormField((prev) => { + const isSelected = prev.customers.includes(customerId); + return { + ...prev, + customers: isSelected + ? prev.customers.filter((id) => id !== customerId) + : [...prev.customers, customerId] + }; }); - setOpen(false); }} > {customer.username} @@ -222,7 +251,7 @@ const AddDialog = () => {
-
*/} +
@@ -299,7 +328,7 @@ const AddDialog = () => { placeholder="Enter Subject" value={formField.subject} onChange={handleChange} - disabled={formField.via !== 'email'} + disabled={formField.via !== 'email' && formField.via !== 'fcm'} />
diff --git a/src/pages/notification/hooks/ManageNotificationContext.tsx b/src/pages/notification/hooks/ManageNotificationContext.tsx index 6f742a4..03fbdff 100644 --- a/src/pages/notification/hooks/ManageNotificationContext.tsx +++ b/src/pages/notification/hooks/ManageNotificationContext.tsx @@ -101,34 +101,6 @@ const ManageNotifContextProvider = ({ children }: { children: React.ReactNode }) enableHiding: false, cell: ({ row }) => moment(row.original.created_at).format('YYYY-MM-DD HH:mm:ss') } - // { - // id: 'actions', - // header: ({ column }) => , - // meta: { - // headerClassName: 'w-[100px]', - // cellClassName: 'text-center' - // }, - // cell: (data: any) => { - // const row = data.row.original; - - // return ( - // <> - // - // - // - // ); - // } - // } ], [handleEditDialog, handleDeleteDialog] ); @@ -146,7 +118,7 @@ const ManageNotifContextProvider = ({ children }: { children: React.ReactNode }) order_direction: sorting[0].desc == false ? 'ASC' : 'DESC', filter: JSON.stringify(filter) }); - console.log('API Response notif: ', response); + // console.log('API Response notif: ', response); return { data: response?.data.list, totalCount: response?.data.total_count }; } catch (error) { console.error('Error fetching notification', error); From 637cd949f4ec0de3f9eadb41a38d9fb0cbe506f2 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Thu, 17 Apr 2025 14:05:41 +0700 Subject: [PATCH 06/12] update remove button reset on edit dialog master data --- src/pages/master/conversion/blocks/EditDialog.tsx | 3 --- src/pages/master/currency/blocks/EditDialog.tsx | 3 --- src/pages/master/postoadms/blocks/EditDialog.tsx | 3 --- src/pages/master/products/blocks/EditDialog.tsx | 3 --- src/pages/master/reward/blocks/EditDialog.tsx | 3 --- src/pages/master/sucos/blocks/EditDialog.tsx | 3 --- src/pages/master/walletRule/blocks/EditDialog.tsx | 3 --- src/pages/members/manage-members/blocks/ListToolBar.tsx | 8 ++------ src/pages/transfer/transfertype/blocks/EditDialog.tsx | 9 +++++---- 9 files changed, 7 insertions(+), 31 deletions(-) diff --git a/src/pages/master/conversion/blocks/EditDialog.tsx b/src/pages/master/conversion/blocks/EditDialog.tsx index 0b98ae6..f32f8f2 100644 --- a/src/pages/master/conversion/blocks/EditDialog.tsx +++ b/src/pages/master/conversion/blocks/EditDialog.tsx @@ -305,9 +305,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/currency/blocks/EditDialog.tsx b/src/pages/master/currency/blocks/EditDialog.tsx index e0dffd8..faee892 100644 --- a/src/pages/master/currency/blocks/EditDialog.tsx +++ b/src/pages/master/currency/blocks/EditDialog.tsx @@ -235,9 +235,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/postoadms/blocks/EditDialog.tsx b/src/pages/master/postoadms/blocks/EditDialog.tsx index d33d318..93e73a8 100644 --- a/src/pages/master/postoadms/blocks/EditDialog.tsx +++ b/src/pages/master/postoadms/blocks/EditDialog.tsx @@ -261,9 +261,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/products/blocks/EditDialog.tsx b/src/pages/master/products/blocks/EditDialog.tsx index f82dbc0..bf6d741 100644 --- a/src/pages/master/products/blocks/EditDialog.tsx +++ b/src/pages/master/products/blocks/EditDialog.tsx @@ -449,9 +449,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/reward/blocks/EditDialog.tsx b/src/pages/master/reward/blocks/EditDialog.tsx index 1a8fd68..d748cf2 100644 --- a/src/pages/master/reward/blocks/EditDialog.tsx +++ b/src/pages/master/reward/blocks/EditDialog.tsx @@ -261,9 +261,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/sucos/blocks/EditDialog.tsx b/src/pages/master/sucos/blocks/EditDialog.tsx index d6d6933..42d1dd8 100644 --- a/src/pages/master/sucos/blocks/EditDialog.tsx +++ b/src/pages/master/sucos/blocks/EditDialog.tsx @@ -260,9 +260,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/master/walletRule/blocks/EditDialog.tsx b/src/pages/master/walletRule/blocks/EditDialog.tsx index b555d06..9c5a132 100644 --- a/src/pages/master/walletRule/blocks/EditDialog.tsx +++ b/src/pages/master/walletRule/blocks/EditDialog.tsx @@ -402,9 +402,6 @@ const EditDialog = () => {
-
diff --git a/src/pages/members/manage-members/blocks/ListToolBar.tsx b/src/pages/members/manage-members/blocks/ListToolBar.tsx index 77742b8..3e77aca 100644 --- a/src/pages/members/manage-members/blocks/ListToolBar.tsx +++ b/src/pages/members/manage-members/blocks/ListToolBar.tsx @@ -4,7 +4,7 @@ import { useState } from 'react'; const ListToolbar = ({ createMember }: { createMember: () => void }) => { const { table, reload } = useDataGrid(); - const [ usernameFilter, setUsernameFilter] = useState(''); + const [usernameFilter, setUsernameFilter] = useState(''); const [emailFilter, setEmailFilter] = useState(''); const handleUsernameChange = (e: React.ChangeEvent) => { @@ -31,11 +31,7 @@ const ListToolbar = ({ createMember }: { createMember: () => void }) => { />
- diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx index 1d9803b..edd00ed 100644 --- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx @@ -174,7 +174,7 @@ const EditDialog = () => { updated_at: formattedTime })); } - }, [showEditDialog, parsedUser]); + }, [showEditDialog]); const selectedPermissionNames = groups .filter((g) => formField.permission.includes(g.id)) @@ -238,7 +238,7 @@ const EditDialog = () => { }); return false; } - }, [formField, selectedTransferType, PutData]); + }, [formField, selectedTransferType]); useEffect(() => { if (!showEditDialog) return; @@ -263,7 +263,7 @@ const EditDialog = () => { }; getCustomerList(); - }, [showEditDialog, GetData]); + }, [showEditDialog]); useEffect(() => { if (!showEditDialog) return; @@ -287,7 +287,7 @@ const EditDialog = () => { }; getGroupList(); - }, [showEditDialog, GetData]); + }, [showEditDialog]); useEffect(() => { if (!showEditDialog) return; @@ -365,6 +365,7 @@ const EditDialog = () => { return () => clearTimeout(timer); }, [showEditDialog, selectedTransferType, GetData]); + useEffect(() => { if (showEditDialog === false) { resetForm(); From 0bf1bca802c359c1e71d62dce59488b2696d327d Mon Sep 17 00:00:00 2001 From: Raja Oktafrianto Date: Thu, 17 Apr 2025 14:36:14 +0700 Subject: [PATCH 07/12] update add notification & search --- src/pages/notification/blocks/AddDialog.tsx | 16 +++++----- src/pages/notification/blocks/ListToolbar.tsx | 28 ++++++++++++++++-- .../manage-position/blocks/ListToolBar.tsx | 28 ++++++++++++++++-- .../user/manage-user/blocks/ListToolBar.tsx | 29 ++++++++++++++++--- 4 files changed, 84 insertions(+), 17 deletions(-) diff --git a/src/pages/notification/blocks/AddDialog.tsx b/src/pages/notification/blocks/AddDialog.tsx index 2b5778e..29063ea 100644 --- a/src/pages/notification/blocks/AddDialog.tsx +++ b/src/pages/notification/blocks/AddDialog.tsx @@ -65,15 +65,15 @@ const AddDialog = () => { const doCreateNotification = async (e: React.FormEvent) => { e.preventDefault(); - const payload = { - ...formField, - subject: - formField.subject.trim() === '' && formField.via === 'sms' - ? 'SMS Notification' - : formField.subject - }; + // const payload = { + // ...formField, + // subject: + // formField.subject.trim() === '' && formField.via === 'sms' + // ? 'SMS Notification' + // : formField.subject + // }; - const response = await PostData(`${API_URL_NOTIFICATION}/send`, payload); + const response = await PostData(`${API_URL_NOTIFICATION}/send`, formField); // console.log('send response :', response); if (response?.status) { diff --git a/src/pages/notification/blocks/ListToolbar.tsx b/src/pages/notification/blocks/ListToolbar.tsx index 823454b..4406253 100644 --- a/src/pages/notification/blocks/ListToolbar.tsx +++ b/src/pages/notification/blocks/ListToolbar.tsx @@ -1,10 +1,34 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useManageNotificationContext } from '../hooks/useManageNotificationContext'; import { Button } from '@/components/ui/button'; +import { useEffect, useState } from 'react'; const ListToolBar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog } = useManageNotificationContext(); + const [searchValue, setSearchValue] = useState( + (table.getColumn('content')?.getFilterValue() as string) ?? '' + ); + + const handleKeyDown = (event: React.KeyboardEvent) => { + if (event.key === 'Enter') { + handleSearch(); + } + }; + + const handleSearch = () => { + table.getColumn('content')?.setFilterValue(searchValue); + table.setPageIndex(0); + }; + + useEffect(() => { + const timer = setTimeout(() => { + table.getColumn('content')?.setFilterValue(searchValue); + table.setPageIndex(0); + }, 200); + + return () => clearTimeout(timer); + }, [searchValue, table]); return (
@@ -16,8 +40,8 @@ const ListToolBar = () => { table.getColumn('content')?.setFilterValue(event.target.value)} + value={searchValue} + onChange={(event) => setSearchValue(event.target.value)} /> {/* diff --git a/src/pages/settings/user/manage-position/blocks/ListToolBar.tsx b/src/pages/settings/user/manage-position/blocks/ListToolBar.tsx index 156a507..3ee35a7 100644 --- a/src/pages/settings/user/manage-position/blocks/ListToolBar.tsx +++ b/src/pages/settings/user/manage-position/blocks/ListToolBar.tsx @@ -1,11 +1,33 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useManagePositionContext } from '../hooks'; import { Button } from '@/components/ui/button'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; const ListToolBar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog } = useManagePositionContext(); + const [searchValue, setSearchValue] = useState( + (table.getColumn('name')?.getFilterValue() as string) ?? '' + ); + + const handleKeyDown = (event: React.KeyboardEvent) => { + if (event.key === 'Enter') { + handleSearch(); + } + }; + + const handleSearch = () => { + table.getColumn('username')?.setFilterValue(searchValue); + table.setPageIndex(0); + }; + + useEffect(() => { + const timer = setTimeout(() => { + table.getColumn('username')?.setFilterValue(searchValue); + table.setPageIndex(0); + }, 200); + return () => clearTimeout(timer); + }, [searchValue, table]); return (
@@ -17,8 +39,8 @@ const ListToolBar = () => { table.getColumn('name')?.setFilterValue(event.target.value)} + value={searchValue} + onChange={(event) => setSearchValue(event.target.value)} /> {/* diff --git a/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx b/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx index a884d14..ae55333 100644 --- a/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx +++ b/src/pages/settings/user/manage-user/blocks/ListToolBar.tsx @@ -1,10 +1,33 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { useUserContext } from '../hooks'; import { Button } from '@/components/ui/button'; +import { useEffect, useState } from 'react'; const ListToolBar = () => { const { table, reload } = useDataGrid(); const { handleAddDialog } = useUserContext(); + const [searchValue, setSearchValue] = useState( + (table.getColumn('username')?.getFilterValue() as string) ?? '' + ); + + const handleKeyDown = (event: React.KeyboardEvent) => { + if (event.key === 'Enter') { + handleSearch(); + } + }; + + const handleSearch = () => { + table.getColumn('username')?.setFilterValue(searchValue); + table.setPageIndex(0); + }; + + useEffect(() => { + const timer = setTimeout(() => { + table.getColumn('username')?.setFilterValue(searchValue); + table.setPageIndex(0); + }, 200); + return () => clearTimeout(timer); + }, [searchValue, table]); return (
@@ -16,10 +39,8 @@ const ListToolBar = () => { - table.getColumn('username')?.setFilterValue(event.target.value) - } + value={searchValue} + onChange={(event) => setSearchValue(event.target.value)} /> {/* From f235ee4832fb26f5f327a3fc79e90b34d0f3ab91 Mon Sep 17 00:00:00 2001 From: Raja Oktafrianto Date: Thu, 17 Apr 2025 15:02:15 +0700 Subject: [PATCH 08/12] update add notification --- src/pages/notification/blocks/AddDialog.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/pages/notification/blocks/AddDialog.tsx b/src/pages/notification/blocks/AddDialog.tsx index 29063ea..9146d6a 100644 --- a/src/pages/notification/blocks/AddDialog.tsx +++ b/src/pages/notification/blocks/AddDialog.tsx @@ -114,7 +114,7 @@ const AddDialog = () => { e.preventDefault(); if ( - formField.type.trim() === '' || + formField.all_customer.trim() === '' || formField.via.trim() === '' || formField.content.trim() === '' ) { @@ -255,9 +255,7 @@ const AddDialog = () => {
- +
{['info', 'promo'].map((type) => (
@@ -46,4 +65,4 @@ const ListToolbar = ({ createMember }: { createMember: () => void }) => { ); }; -export default ListToolbar; +export default ListToolbar; \ No newline at end of file diff --git a/src/pages/transfer/transfertype/blocks/ListToolBar.tsx b/src/pages/transfer/transfertype/blocks/ListToolBar.tsx index 7d9e413..47833ba 100644 --- a/src/pages/transfer/transfertype/blocks/ListToolBar.tsx +++ b/src/pages/transfer/transfertype/blocks/ListToolBar.tsx @@ -12,6 +12,7 @@ const ListToolbar = () => { useEffect(() => { const timer = setTimeout(() => { table.getColumn('name')?.setFilterValue(searchValue); + table.setPageIndex(0); }, 200); return () => clearTimeout(timer); From 45b2bccbde0c07c72ccfdc1b60f7a7d0ffe04917 Mon Sep 17 00:00:00 2001 From: bagusajisaputroo Date: Thu, 17 Apr 2025 16:44:17 +0700 Subject: [PATCH 10/12] adding purchase loja on status transaction type field in transaction type module --- src/pages/transfer/transfertype/blocks/AddDialog.tsx | 3 ++- src/pages/transfer/transfertype/blocks/EditDialog.tsx | 5 +++-- .../transfertype/hooks/ManageTransferTypeContext.tsx | 3 ++- 3 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/pages/transfer/transfertype/blocks/AddDialog.tsx b/src/pages/transfer/transfertype/blocks/AddDialog.tsx index fe6eff6..581ba03 100644 --- a/src/pages/transfer/transfertype/blocks/AddDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/AddDialog.tsx @@ -470,7 +470,8 @@ const AddDialog = () => { Top Up Escrow Top Up Master Agent Top Up Agent - + Purchase Loja +
diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx index edd00ed..28e2296 100644 --- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx @@ -365,7 +365,7 @@ const EditDialog = () => { return () => clearTimeout(timer); }, [showEditDialog, selectedTransferType, GetData]); - + useEffect(() => { if (showEditDialog === false) { resetForm(); @@ -590,7 +590,7 @@ const EditDialog = () => { - Disbursement + Disbursement Other Change Group Emoney Customer to Agent Change Group Emoney Agent to Customer @@ -604,6 +604,7 @@ const EditDialog = () => { Top Up Escrow Top Up Master Agent Top Up Agent + Purchase Loja
diff --git a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx index dfdd72d..a21febf 100644 --- a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx +++ b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx @@ -185,7 +185,8 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React R: 'Reward Point', TE:'Top Up Escrow', TM:'Top Up Master Agent', - TA:'Top Up Agent' + TA:'Top Up Agent', + PL:'Purchase Loja' }; return mapping[row.type] || 'Unknown'; From d4239820f4e48965024254799eef24ae15d953e2 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Thu, 17 Apr 2025 16:54:03 +0700 Subject: [PATCH 11/12] fix refresh on kyc --- src/pages/members/kyc/Kyc.tsx | 31 ++++++++++- src/pages/members/kyc/blocks/ListToolBar.tsx | 55 ++++++++++--------- .../members/manage-members/ManageMembers.tsx | 55 ++++++++++--------- 3 files changed, 88 insertions(+), 53 deletions(-) diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx index 969db5e..6e3fcbf 100644 --- a/src/pages/members/kyc/Kyc.tsx +++ b/src/pages/members/kyc/Kyc.tsx @@ -1,4 +1,10 @@ -import { Container, DataGridInner, DataGridProvider, TDataGridProps } from '@/components'; +import { + Container, + DataGridInner, + DataGridProvider, + TDataGridProps, + useDataGrid +} from '@/components'; import { DataTable } from '@/components/ui/DataTable'; import { Table } from '@tanstack/react-table'; import React, { createContext, useContext, useState, useEffect } from 'react'; @@ -17,6 +23,7 @@ import DetailMember from '../manage-members/blocks/DetailMember'; import { Breadcrumbs, Link } from '@mui/material'; import { Helmet } from 'react-helmet'; import { ListToolBar } from './blocks/ListToolBar'; +import { RefreshCw } from 'lucide-react'; const Kyc = () => { const [loading, setLoading] = useState(false); @@ -26,6 +33,7 @@ const Kyc = () => { const [isDialogOpen, setIsDialogOpen] = useState(false); const [dialogOpen, setDialogOpen] = useState(false); const [dialogType, setDialogType] = useState(''); + const [isReloading, setIsReloading] = useState(false); const closeDialog = () => setIsDialogOpen(false); const { getUser } = useAuthContext(); @@ -65,6 +73,9 @@ const Kyc = () => { } catch (error: any) { toast.error(error.message); console.log(error); + } finally { + setLoading(false); + setIsReloading(false); } } @@ -89,6 +100,11 @@ const Kyc = () => { setMember(initialMember); }; + const handleReload = () => { + setIsReloading(true); + fetchCustomers(); + }; + const handleYes = async () => { setLoading(true); const userLogin: any = await getUser(); @@ -172,6 +188,7 @@ const Kyc = () => { } finally { await fetchCustomers(); setLoading(false); + setIsReloading(false); } }; @@ -237,12 +254,20 @@ const Kyc = () => { {/*
*/} -
+
+ {isReloading && ( +
+
+ + Refreshing data... +
+
+ )} } + toolbar={} layout={{ card: true }} sorting={[{ id: 'created_at', desc: true }]} serverSide={false} diff --git a/src/pages/members/kyc/blocks/ListToolBar.tsx b/src/pages/members/kyc/blocks/ListToolBar.tsx index 180e68b..54ffca7 100644 --- a/src/pages/members/kyc/blocks/ListToolBar.tsx +++ b/src/pages/members/kyc/blocks/ListToolBar.tsx @@ -1,40 +1,45 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { Button } from '@/components/ui/button'; import { useKycContext } from '../hooks'; +import { useState } from 'react'; -const ListToolBar = () => { +interface ListToolbarProps { + onReload: () => void; + isReloading: boolean; +} + +const ListToolBar = ({ onReload, isReloading }: ListToolbarProps) => { const { table, reload } = useDataGrid(); + const [usernameFilter, setUsernameFilter] = useState(''); + + const handleUsernameChange = (e: React.ChangeEvent) => { + setUsernameFilter(e.target.value); + table.getColumn('username')?.setFilterValue(e.target.value); + }; return (
-
- - - - +
+
- -
diff --git a/src/pages/members/manage-members/ManageMembers.tsx b/src/pages/members/manage-members/ManageMembers.tsx index 7ac36d2..3dedff3 100644 --- a/src/pages/members/manage-members/ManageMembers.tsx +++ b/src/pages/members/manage-members/ManageMembers.tsx @@ -47,7 +47,7 @@ const ManageMembers = () => { order_field: 'created_at', order_direction: 'DESC' } - }); + }); let temp = 1; let resMembers = customers.data.data.list.map((el: any) => { el.no = temp++; @@ -73,11 +73,10 @@ const ManageMembers = () => { toast.error(error.message); console.log(error); } finally { - setLoading(false) + setLoading(false); setIsReloading(false); } } - const handleUpdate = (data: any) => { setDialogType('update'); @@ -233,29 +232,35 @@ const ManageMembers = () => { {/*
*/} - +
- {isReloading && ( -
-
- - Refreshing data... -
-
- )} - } - onRowSelectionChange={(selected, table: any) => { - const selectedRow = table.getSelectedRowModel().rows[0]; - if (selectedRow) handleUpdate(selectedRow.original); - }} - > -
+ {isReloading && ( +
+
+ + Refreshing data... +
+
+ )} + + } + onRowSelectionChange={(selected, table: any) => { + const selectedRow = table.getSelectedRowModel().rows[0]; + if (selectedRow) handleUpdate(selectedRow.original); + }} + > +
{/*
*/} From d550a9c5f1abf5ee6fcd3fb068981efdb2929b87 Mon Sep 17 00:00:00 2001 From: Wikzyy Date: Thu, 17 Apr 2025 16:56:05 +0700 Subject: [PATCH 12/12] fix bug on kyc table --- src/pages/members/kyc/Kyc.tsx | 1 - src/pages/members/kyc/blocks/ListToolBar.tsx | 1 - .../members/kyc/hooks/ManageKycContext.tsx | 145 ------------------ src/pages/members/kyc/hooks/index.ts | 2 - src/pages/members/kyc/hooks/useKycContext.tsx | 12 -- 5 files changed, 161 deletions(-) delete mode 100644 src/pages/members/kyc/hooks/ManageKycContext.tsx delete mode 100644 src/pages/members/kyc/hooks/index.ts delete mode 100644 src/pages/members/kyc/hooks/useKycContext.tsx diff --git a/src/pages/members/kyc/Kyc.tsx b/src/pages/members/kyc/Kyc.tsx index 6e3fcbf..bd62625 100644 --- a/src/pages/members/kyc/Kyc.tsx +++ b/src/pages/members/kyc/Kyc.tsx @@ -8,7 +8,6 @@ import { import { DataTable } from '@/components/ui/DataTable'; import { Table } from '@tanstack/react-table'; import React, { createContext, useContext, useState, useEffect } from 'react'; -import { ManageKycContextProvider } from './hooks'; import { getColumns, initialMember } from './Columns'; import { useAuthContext } from '@/auth'; import { LoaderTransparant } from '@/components'; diff --git a/src/pages/members/kyc/blocks/ListToolBar.tsx b/src/pages/members/kyc/blocks/ListToolBar.tsx index 54ffca7..804c008 100644 --- a/src/pages/members/kyc/blocks/ListToolBar.tsx +++ b/src/pages/members/kyc/blocks/ListToolBar.tsx @@ -1,6 +1,5 @@ import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components'; import { Button } from '@/components/ui/button'; -import { useKycContext } from '../hooks'; import { useState } from 'react'; interface ListToolbarProps { diff --git a/src/pages/members/kyc/hooks/ManageKycContext.tsx b/src/pages/members/kyc/hooks/ManageKycContext.tsx deleted file mode 100644 index 2a63fe1..0000000 --- a/src/pages/members/kyc/hooks/ManageKycContext.tsx +++ /dev/null @@ -1,145 +0,0 @@ -import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components'; -import { Toaster } from '@/components/ui/sonner'; -import { apiConfig } from '@/config/api.config'; -import { ColumnDef } from '@tanstack/react-table'; -import { createContext, useCallback, useMemo, useState } from 'react'; -import { ListToolBar } from '../blocks/ListToolBar'; - -interface SelectedUser { - id: string; - name: string; - email: string; - role: string; - description: string; - created_date: Date; -} - -interface ContextProps { - showDetailDialog: boolean; - handleDetailDialog: (show: boolean, selected_user: SelectedUser | null) => void; - showAddDialog: boolean; - handleAddDialog: (show: boolean) => void; - selectedUser: SelectedUser | null; -} - -const initialProps: ContextProps = { - showDetailDialog: false, - handleDetailDialog: () => {}, - showAddDialog: false, - handleAddDialog: () => {}, - selectedUser: null -}; - -const ManageKycContext = createContext(initialProps); -const API_URL = apiConfig.service_dashboard; - -const ManageKycContextProvider = ({ children }: { children: React.ReactNode }) => { - const [showDetailDialog, setShowDetailDialog] = useState(false); - const [showAddDialog, setShowAddDialog] = useState(false); - const [selectedUser, setSelectedUser] = useState(null); - - const handleDetailDialog = useCallback((show: boolean, selected_user: SelectedUser | null) => { - setSelectedUser(show ? selected_user : null); - setShowDetailDialog(show); - }, []); - - const handleAddDialog = useCallback((show: boolean) => { - setShowAddDialog(show); - }, []); - - const columns = useMemo[]>( - () => [ - { - accessorFn: (row) => row.id, - id: 'id', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[100px]' - } - }, - { - accessorFn: (row) => row.created_date, - id: 'created_date', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[250px]' - } - }, - { - accessorFn: (row) => row.name, - id: 'name', - header: ({ column }) => , - enableSorting: true, - enableHiding: false, - meta: { - headerClassName: 'w-[350px]' - } - }, - { - accessorFn: (row) => row.description, - id: 'description', - header: ({ column }) => , - enableSorting: true, - meta: { - headerClassName: 'w-[350px]' - } - }, - { - id: 'actions', - enableSorting: false, - header: ({ column }) => , - cell: (data: any) => { - const row = data.row.original; - - return ( - <> - - - ); - }, - meta: { - headerClassName: 'w-[100px]', - cellClassName: 'text-center' - } - } - ], - [handleDetailDialog] - ); - - return ( - - - - } - layout={{ card: true }} - sorting={[{ id: 'name', desc: false }]} - serverSide={true} - > - {children} - - - ); -}; - -export { ManageKycContextProvider, ManageKycContext }; -export type { SelectedUser }; diff --git a/src/pages/members/kyc/hooks/index.ts b/src/pages/members/kyc/hooks/index.ts deleted file mode 100644 index 246dfa8..0000000 --- a/src/pages/members/kyc/hooks/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './ManageKycContext'; -export * from './useKycContext'; diff --git a/src/pages/members/kyc/hooks/useKycContext.tsx b/src/pages/members/kyc/hooks/useKycContext.tsx deleted file mode 100644 index 1043f87..0000000 --- a/src/pages/members/kyc/hooks/useKycContext.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { useContext } from 'react'; -import { ManageKycContext } from './ManageKycContext'; - -const useKycContext = () => { - const context = useContext(ManageKycContext); - - if (!context) throw new Error('useKycContext must be used within AuthProvider'); - - return context; -}; - -export { useKycContext };