From 189ed724b5a80904839213894035e13eb33ade95 Mon Sep 17 00:00:00 2001 From: bagusajisaputroo Date: Mon, 12 May 2025 14:51:37 +0700 Subject: [PATCH 1/3] fixing issue manage transferfee on edit transfertype --- .../hooks/ManageTransferFeeContext.tsx | 4 +- .../transfertype/blocks/EditDialog.tsx | 727 +++++++++--------- 2 files changed, 369 insertions(+), 362 deletions(-) diff --git a/src/pages/transfer/transferfee/hooks/ManageTransferFeeContext.tsx b/src/pages/transfer/transferfee/hooks/ManageTransferFeeContext.tsx index 10d8390..a090d18 100644 --- a/src/pages/transfer/transferfee/hooks/ManageTransferFeeContext.tsx +++ b/src/pages/transfer/transferfee/hooks/ManageTransferFeeContext.tsx @@ -363,8 +363,8 @@ const ManageTransferFeeContextProvider = ({ return (
-
-

Manage Transaction Fee

+
+

Manage Transaction Fee

{

Loading transaction type data...

) : ( -
-
-
-
- -
- { - setFormField((prev) => ({ ...prev, name: target.value })); - if (target.value) { - setErrors((prev) => ({ ...prev, name: '' })); - } - }} - /> - {errors.name && ( - {errors.name} - )} +
+ +
+
+
+ +
+ { + setFormField((prev) => ({ ...prev, name: target.value })); + if (target.value) { + setErrors((prev) => ({ ...prev, name: '' })); + } + }} + /> + {errors.name && ( + {errors.name} + )} +
-
-
-
- -
- { - setFormField((prev) => ({ ...prev, description: target.value })); - if (target.value) { - setErrors((prev) => ({ ...prev, description: '' })); - } - }} - /> - {errors.description && ( - {errors.description} - )} +
+
+ +
+ { + setFormField((prev) => ({ ...prev, description: target.value })); + if (target.value) { + setErrors((prev) => ({ ...prev, description: '' })); + } + }} + /> + {errors.description && ( + {errors.description} + )} +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - minimum_amount: values.floatValue || 0 - })); - }} - placeholder="Enter Minimum Amount" - /> +
+
+ +
+ { + setFormField((prev) => ({ + ...prev, + minimum_amount: values.floatValue || 0 + })); + }} + placeholder="Enter Minimum Amount" + /> +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - maximum_amount: values.floatValue || 0 - })); - }} - placeholder="Enter Maximum Amount" - /> +
+
+ +
+ { + setFormField((prev) => ({ + ...prev, + maximum_amount: values.floatValue || 0 + })); + }} + placeholder="Enter Maximum Amount" + /> +
-
-
-
- -
- { - setFormField((prev) => ({ - ...prev, - max_transaction_per_day: values.floatValue || 0 - })); - }} - placeholder="Enter Max Transaction Per Day" - /> +
+
+ +
+ { + setFormField((prev) => ({ + ...prev, + max_transaction_per_day: values.floatValue || 0 + })); + }} + placeholder="Enter Max Transaction Per Day" + /> +
-
-
-
- -
- {renderSelectWithLoading( - formField.wallet_origin, - (value) => setFormField({ ...formField, wallet_origin: value }), - wallets, - 'Select Wallet', - isLoadingWallets - )} - {errors.wallet_origin && ( - {errors.wallet_origin} - )} +
+
+ +
+ {renderSelectWithLoading( + formField.wallet_origin, + (value) => setFormField({ ...formField, wallet_origin: value }), + wallets, + 'Select Wallet', + isLoadingWallets + )} + {errors.wallet_origin && ( + + {errors.wallet_origin} + + )} +
-
-
-
- -
- { + setFormField((prev) => ({ ...prev, wallet_destination })); + setErrors((prev) => ({ ...prev, wallet_destination: '' })); + }} > - - - - {wallets.map((wallet) => ( - - {wallet.name} + + + + + {wallets.map((wallet) => ( + + {wallet.name} + + ))} + + + {errors.wallet_destination && ( + + {errors.wallet_destination} + + )} +
+
+
+ +
+
+ +
+ - {errors.wallet_destination && ( - - {errors.wallet_destination} - - )} + + Change Group Emoney Agent to Customer{' '} + + + Change Group Point Agent to Customer{' '} + + + Change Group Point Customer to Agent + + Return Customer Emoney + Return Agent Deposit + Return Agent Merchant + Return Agent Emoney + Reward Point + Top Up Escrow + Top Up Master Agent + Top Up Agent + Purchase Loja + Disbursment Escrow + Disbursment Master Agent + Disbursment Agent + Withdraw Merchant + Income Merchant + Donation + + + {errors.type && ( + {errors.type} + )} +
-
-
-
- -
- - {errors.type && ( - {errors.type} - )} +
+
+ +
+ + {errors.status_approval && ( + + {errors.status_approval} + + )} +
-
+
+
+ -
-
- -
- - {errors.status_approval && ( - - {errors.status_approval} - - )} +
+ + {errors.status_kind && ( + {errors.status_kind} + )} +
+
+
+
+
+ +
+ + {errors.status && ( + {errors.status} + )} +
-
-
-
- -
- - {errors.status_kind && ( - {errors.status_kind} - )} -
-
-
-
-
- -
- - {errors.status && ( - {errors.status} - )} -
-
-
- -
-
- -
- - {errors.permission && ( - {errors.permission} - )} -
-
- {groups.map((group) => ( -
- handleGroupChange(group.id)} - /> - -
- ))} +
+
+ +
+ + {errors.permission && ( + {errors.permission} + )} +
+
+ {groups.map((group) => ( +
+ handleGroupChange(group.id)} + /> + +
+ ))} +
-
-
- - +
+ + +
+ +
+ + +
+ +
+ + + + +
- - )} - - {isLoadingData && ( - - -
- -
- - - - - +
)}
From 109939b0b43b085fe669acc0babbbf33865aaf3b Mon Sep 17 00:00:00 2001 From: bagusajisaputroo Date: Mon, 12 May 2025 15:18:44 +0700 Subject: [PATCH 2/3] color customization on some field in managetransfertype --- .../hooks/ManageTransferTypeContext.tsx | 95 +++++++++++++++---- 1 file changed, 78 insertions(+), 17 deletions(-) diff --git a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx index c815be0..afb3628 100644 --- a/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx +++ b/src/pages/transfer/transfertype/hooks/ManageTransferTypeContext.tsx @@ -106,6 +106,25 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React setShowDeleteDialog(show); }, []); + const StatusBadge = ({ + value, + map + }: { + value: string; + map: Record; + }) => { + const statusInfo = map[value] || { label: value || 'Unknown', color: 'gray' }; + const { label, color } = statusInfo; + + return ( + + {label} + + ); + }; + const columns = useMemo[]>( () => [ { @@ -217,40 +236,82 @@ const ManageTransferTypeContextProvider = ({ children }: { children: React.React enableHiding: false, meta: { headerClassName: 'w-[250px]' } }, + { - accessorFn: (row) => (row.status === 'Y' ? 'Active' : 'Inactive'), + accessorFn: (row) => row.status, id: 'status', header: ({ column }) => , enableSorting: false, enableHiding: false, - meta: { headerClassName: 'w-[150px]' } + cell: ({ row }) => { + const status = row.original.status; + const label = status === 'Y' ? 'Active' : 'Inactive'; + const color = status === 'Y' ? 'green' : 'red'; + + return ( + + {label} + + ); + }, + meta: { + headerClassName: 'w-[100px]', + cellClassName: 'text-center' + } }, { - accessorFn: (row: { status_kind: string }) => { - const mapping: Record = { - R: 'Return', - T: 'Transfer', - P: 'Purchase', - W: 'Withdraw', - U: 'Top Up', - N: 'Top Up Patner' - }; - - return mapping[row.status_kind] || 'Unknown'; - }, + accessorFn: (row) => row.status_kind, id: 'status_kind', header: ({ column }) => , enableSorting: false, enableHiding: false, - meta: { headerClassName: 'w-[250px]' } + cell: ({ row }) => { + const kind = row.original.status_kind; + + const mapping: Record = { + R: { label: 'Return', className: 'bg-blue-100 text-blue-600' }, + T: { label: 'Transfer', className: 'bg-indigo-100 text-indigo-600' }, + P: { label: 'Purchase', className: 'bg-green-100 text-green-600' }, + W: { label: 'Withdraw', className: 'bg-fuchsia-100 text-fuchsia-600' }, + U: { label: 'Top Up', className: 'bg-yellow-100 text-yellow-600' }, + N: { label: 'Top Up Patner', className: 'bg-purple-100 text-purple-600' } + }; + + const kindInfo = mapping[kind] || { + label: 'Unknown', + className: 'bg-gray-100 text-gray-600' + }; + + return ( + + {kindInfo.label} + + ); + }, + meta: { headerClassName: 'w-[250px]', cellClassName: 'text-center' } }, { - accessorFn: (row) => (row.status_approval === 'Y' ? 'Yes' : 'No'), + accessorFn: (row) => row.status_approval, id: 'status_approval', header: ({ column }) => , enableSorting: false, enableHiding: false, - meta: { headerClassName: 'w-[150px]' } + cell: ({ row }) => { + const approval = row.original.status_approval; + const label = approval === 'Y' ? 'Yes' : 'No'; + const color = approval === 'Y' ? 'green' : 'red'; + + return ( + + {label} + + ); + }, + meta: { headerClassName: 'w-[150px]', cellClassName: 'text-center' } }, { id: 'actions', From a0bc7d13a1cf47fc017207cdb7a473fbe5940b0d Mon Sep 17 00:00:00 2001 From: Raja Oktafrianto Date: Mon, 12 May 2025 15:57:22 +0700 Subject: [PATCH 3/3] update response error --- .../transfertype/blocks/AddDialog.tsx | 54 +++++++++++++------ .../transfertype/blocks/EditDialog.tsx | 18 ++++--- 2 files changed, 50 insertions(+), 22 deletions(-) diff --git a/src/pages/transfer/transfertype/blocks/AddDialog.tsx b/src/pages/transfer/transfertype/blocks/AddDialog.tsx index 1458819..e164a1b 100644 --- a/src/pages/transfer/transfertype/blocks/AddDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/AddDialog.tsx @@ -64,7 +64,7 @@ const AddDialog = () => { const [customers, setCustomers] = useState([]); const { reload } = useDataGrid(); const { PostData, PutData } = useCallApi(); - + const [errors, setErrors] = useState>({}); const initialState = { @@ -164,11 +164,12 @@ const AddDialog = () => { toast.error(response?.message || 'Failed to create transfer type'); return false; } - } catch (error) { + } catch (error: any) { toast.error( - error instanceof Error - ? error.message - : 'An error occurred while creating transfer type' + error?.response?.data?.message || + (error instanceof Error + ? error.message + : 'An error occurred while creating transfer type') ); return false; } @@ -203,8 +204,9 @@ const AddDialog = () => { order_direction: sorting[0].desc ? 'DESC' : 'ASC' }); setCustomers(response?.data.list); - } catch (error) { + } catch (error: any) { console.error('Error fetching customer', error); + toast.error(error?.response?.data?.message || 'Failed to fetch customer data'); } }; @@ -284,7 +286,9 @@ const AddDialog = () => { } }} /> - {errors.name && {errors.name}} + {errors.name && ( + {errors.name} + )}
@@ -308,7 +312,9 @@ const AddDialog = () => { } }} /> - {errors.description && {errors.description}} + {errors.description && ( + {errors.description} + )}
@@ -408,7 +414,9 @@ const AddDialog = () => { ))} - {errors.wallet_origin && {errors.wallet_origin}} + {errors.wallet_origin && ( + {errors.wallet_origin} + )}
@@ -427,7 +435,9 @@ const AddDialog = () => { setErrors((prev) => ({ ...prev, wallet_destination: '' })); }} > - + @@ -438,7 +448,11 @@ const AddDialog = () => { ))} - {errors.wallet_destination && {errors.wallet_destination}} + {errors.wallet_destination && ( + + {errors.wallet_destination} + + )}
@@ -485,7 +499,9 @@ const AddDialog = () => { Donation - {errors.type && {errors.type}} + {errors.type && ( + {errors.type} + )}
@@ -512,7 +528,9 @@ const AddDialog = () => { No - {errors.status_approval && {errors.status_approval}} + {errors.status_approval && ( + {errors.status_approval} + )}
@@ -543,7 +561,9 @@ const AddDialog = () => { Top Up Patner - {errors.status_kind && {errors.status_kind}} + {errors.status_kind && ( + {errors.status_kind} + )}
@@ -571,7 +591,9 @@ const AddDialog = () => { Inactive - {errors.status && {errors.status}} + {errors.status && ( + {errors.status} + )} @@ -599,4 +621,4 @@ const AddDialog = () => { ); }; -export default AddDialog; \ No newline at end of file +export default AddDialog; diff --git a/src/pages/transfer/transfertype/blocks/EditDialog.tsx b/src/pages/transfer/transfertype/blocks/EditDialog.tsx index 84e0621..1fd1936 100644 --- a/src/pages/transfer/transfertype/blocks/EditDialog.tsx +++ b/src/pages/transfer/transfertype/blocks/EditDialog.tsx @@ -234,8 +234,10 @@ const EditDialog = () => { toast.error(response?.message || 'Failed to update transfer type'); return false; } - } catch (error) { - toast.error(error instanceof Error ? error.message : 'Failed to Update Transfer Type'); + } catch (error: any) { + toast.error( + error?.response?.data?.message || error.message || 'Failed to Update Transfer Type' + ); return false; } }, [formField, selectedTransferType]); @@ -257,8 +259,9 @@ const EditDialog = () => { if (response?.status && response?.data) { setCustomers(response.data.list); } - } catch (error) { + } catch (error: any) { console.error('Error fetching customer', error); + toast.error(error?.response?.data?.message || 'Failed to fetch customer data'); } }; @@ -281,8 +284,9 @@ const EditDialog = () => { if (response?.status && response?.data) { setGroups(response.data.list); } - } catch (error) { + } catch (error: any) { console.error('Error fetching groups', error); + toast.error(error?.response?.data?.message || 'Failed to fetch groups'); } }; @@ -305,8 +309,9 @@ const EditDialog = () => { if (response?.status && response?.data) { setWallets(response.data.list); } - } catch (error) { + } catch (error: any) { console.error('Error fetching wallets', error); + toast.error(error?.response?.data?.message || 'Failed to fetch wallets'); } }; @@ -353,8 +358,9 @@ const EditDialog = () => { })); } // console.log(response); - } catch (error) { + } catch (error: any) { console.error('Error fetching transaction type', error); + toast.error(error?.response?.data?.message || 'Failed to load transaction type data'); setAlert({ show: true, message: 'Failed to load transaction type data'