fix double notification transfer fee

This commit is contained in:
Wikzyy
2025-04-25 14:43:07 +07:00
parent daae143823
commit 3802650b0c
2 changed files with 110 additions and 98 deletions

View File

@ -25,7 +25,14 @@ import { useCallApi } from '@/hooks';
import { doSaveLogActivity } from '@/actions/GlobalActions'; import { doSaveLogActivity } from '@/actions/GlobalActions';
import { getAuth } from '@/auth'; import { getAuth } from '@/auth';
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'; import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '@/components/ui/command'; import {
Command,
CommandEmpty,
CommandGroup,
CommandInput,
CommandItem,
CommandList
} from '@/components/ui/command';
const API_URL = apiConfig.service_transaction; const API_URL = apiConfig.service_transaction;
const API_URL_MASTER_DATA = apiConfig.service_master_data; const API_URL_MASTER_DATA = apiConfig.service_master_data;
@ -178,9 +185,9 @@ const EditFeeDialog = () => {
); );
if (response?.status) { if (response?.status) {
toast.success('Successfully updated transfer fee');
reload(); reload();
handleEditFeeDialog(false, null); handleEditFeeDialog(false, null);
toast.success('Successfully updated transfer fee');
const createActivity = { const createActivity = {
module: 'Manage Transfer Fee', module: 'Manage Transfer Fee',
description: `Edit Transfer Fee => ${formField.name}`, description: `Edit Transfer Fee => ${formField.name}`,
@ -197,7 +204,7 @@ const EditFeeDialog = () => {
setIsSubmitting(false); setIsSubmitting(false);
} }
}, },
[formField, selectedTransferFee, PutData, reload, handleEditFeeDialog] [formField, selectedTransferFee, handleEditFeeDialog]
); );
const fetchWallets = useCallback(async () => { const fetchWallets = useCallback(async () => {
@ -315,7 +322,7 @@ const EditFeeDialog = () => {
updated_by: parsedUser?.username, updated_by: parsedUser?.username,
updated_at: new Date().toISOString().slice(0, 19).replace('T', ' ') updated_at: new Date().toISOString().slice(0, 19).replace('T', ' ')
}); });
if (response.data.transaction_type?.name) { if (response.data.transaction_type?.name) {
setTransactionTypeName(response.data.transaction_type.name); setTransactionTypeName(response.data.transaction_type.name);
} }
@ -421,7 +428,7 @@ const EditFeeDialog = () => {
</Alert> </Alert>
</div> </div>
)} )}
{isLoadingTransferFee ? ( {isLoadingTransferFee ? (
<div className="flex flex-col items-center justify-center p-8"> <div className="flex flex-col items-center justify-center p-8">
<div className="animate-pulse flex space-x-4 w-full"> <div className="animate-pulse flex space-x-4 w-full">
@ -458,14 +465,14 @@ const EditFeeDialog = () => {
</div> </div>
</div> </div>
)} )}
<input <input
type="hidden" type="hidden"
name="transaction_type" name="transaction_type"
value={formField.transaction_type} value={formField.transaction_type}
/> />
</div> </div>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Transfer Fee Name <span className="text-red-500">*</span> Transfer Fee Name <span className="text-red-500">*</span>
@ -480,7 +487,7 @@ const EditFeeDialog = () => {
} }
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Description <span className="text-red-500">*</span> Description <span className="text-red-500">*</span>
@ -495,7 +502,7 @@ const EditFeeDialog = () => {
} }
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Minimum Amount</label> <label className="form-label">Minimum Amount</label>
<NumericFormat <NumericFormat
@ -513,7 +520,7 @@ const EditFeeDialog = () => {
placeholder="Enter Minimum Amount" placeholder="Enter Minimum Amount"
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Maximum Amount</label> <label className="form-label">Maximum Amount</label>
<NumericFormat <NumericFormat
@ -531,7 +538,7 @@ const EditFeeDialog = () => {
placeholder="Enter Maximum Amount" placeholder="Enter Maximum Amount"
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Period Start <span className="text-red-500">*</span> Period Start <span className="text-red-500">*</span>
@ -546,7 +553,7 @@ const EditFeeDialog = () => {
} }
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Period End <span className="text-red-500">*</span> Period End <span className="text-red-500">*</span>
@ -561,7 +568,7 @@ const EditFeeDialog = () => {
} }
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct Amount</label> <label className="form-label">Deduct Amount</label>
<NumericFormat <NumericFormat
@ -579,7 +586,7 @@ const EditFeeDialog = () => {
placeholder="Enter Deduct Amount" placeholder="Enter Deduct Amount"
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Deduct Percentage</label> <label className="form-label">Deduct Percentage</label>
<NumericFormat <NumericFormat
@ -597,7 +604,7 @@ const EditFeeDialog = () => {
placeholder="Enter Deduct Percentage" placeholder="Enter Deduct Percentage"
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label">Fee Amount</label> <label className="form-label">Fee Amount</label>
<NumericFormat <NumericFormat
@ -615,7 +622,7 @@ const EditFeeDialog = () => {
placeholder="Enter Fee Amount" placeholder="Enter Fee Amount"
/> />
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Deduct From <span className="text-red-500">*</span> Deduct From <span className="text-red-500">*</span>
@ -633,7 +640,7 @@ const EditFeeDialog = () => {
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Deduct From Destination <span className="text-red-500">*</span> Deduct From Destination <span className="text-red-500">*</span>
@ -646,7 +653,7 @@ const EditFeeDialog = () => {
isLoadingWallets isLoadingWallets
)} )}
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Credit To <span className="text-red-500">*</span> Credit To <span className="text-red-500">*</span>
@ -672,74 +679,81 @@ const EditFeeDialog = () => {
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
{formField.credit_to === 'I' && ( {formField.credit_to === 'I' && (
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Credit Destination <span className="text-red-500">*</span> Credit Destination <span className="text-red-500">*</span>
</label> </label>
<div className="relative"> <div className="relative">
<div <div
className="flex w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 cursor-pointer" className="flex w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 cursor-pointer"
onClick={() => setOpen(!open)} onClick={() => setOpen(!open)}
> >
<span className="truncate"> <span className="truncate">
{customers.find(customer => customer.id === formField.credit_destination)?.username || 'Search customer...'} {customers.find(
</span> (customer) => customer.id === formField.credit_destination
<path d="m6 9 6 6 6-6"></path> )?.username || 'Search customer...'}
</div> </span>
<path d="m6 9 6 6 6-6"></path>
{open && ( </div>
<div className="absolute left-0 right-0 top-full z-50 mt-1 max-h-52 overflow-auto rounded-md border border-gray-200 bg-white shadow-lg">
<div className="sticky top-0 bg-white p-2 border-b">
<Input
className="h-8 text-sm"
type="text"
placeholder="Search customer..."
value={customerSearchTerm}
onChange={(e) => setCustomerSearchTerm(e.target.value)}
autoComplete="off"
onClick={(e) => e.stopPropagation()}
autoFocus
/>
</div>
<div>
{customers
.filter(customer =>
customer.username.toLowerCase().includes(customerSearchTerm.toLowerCase()) ||
customer.msisdn.includes(customerSearchTerm)
)
.map(customer => (
<div
key={customer.id}
className="cursor-pointer px-3 py-1.5 text-sm hover:bg-gray-100"
onClick={() => {
setFormField({
...formField,
credit_destination: customer.id
});
setOpen(false);
}}
>
{customer.username}
</div>
))}
{customers.filter(customer =>
customer.username.toLowerCase().includes(customerSearchTerm.toLowerCase()) ||
customer.msisdn.includes(customerSearchTerm)
).length === 0 && (
<div className="px-3 py-2 text-sm text-gray-500">No customer found</div>
)}
</div>
</div>
)}
</div>
</div>
)}
{open && (
<div className="absolute left-0 right-0 top-full z-50 mt-1 max-h-52 overflow-auto rounded-md border border-gray-200 bg-white shadow-lg">
<div className="sticky top-0 bg-white p-2 border-b">
<Input
className="h-8 text-sm"
type="text"
placeholder="Search customer..."
value={customerSearchTerm}
onChange={(e) => setCustomerSearchTerm(e.target.value)}
autoComplete="off"
onClick={(e) => e.stopPropagation()}
autoFocus
/>
</div>
<div>
{customers
.filter(
(customer) =>
customer.username
.toLowerCase()
.includes(customerSearchTerm.toLowerCase()) ||
customer.msisdn.includes(customerSearchTerm)
)
.map((customer) => (
<div
key={customer.id}
className="cursor-pointer px-3 py-1.5 text-sm hover:bg-gray-100"
onClick={() => {
setFormField({
...formField,
credit_destination: customer.id
});
setOpen(false);
}}
>
{customer.username}
</div>
))}
{customers.filter(
(customer) =>
customer.username
.toLowerCase()
.includes(customerSearchTerm.toLowerCase()) ||
customer.msisdn.includes(customerSearchTerm)
).length === 0 && (
<div className="px-3 py-2 text-sm text-gray-500">
No customer found
</div>
)}
</div>
</div>
)}
</div>
</div>
)}
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Credit Destination Account <span className="text-red-500">*</span> Credit Destination Account <span className="text-red-500">*</span>
@ -752,7 +766,7 @@ const EditFeeDialog = () => {
isLoadingWallets isLoadingWallets
)} )}
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Status <span className="text-red-500">*</span> Status <span className="text-red-500">*</span>
@ -770,14 +784,16 @@ const EditFeeDialog = () => {
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Status Include <span className="text-red-500">*</span> Status Include <span className="text-red-500">*</span>
</label> </label>
<Select <Select
value={formField.status_include} value={formField.status_include}
onValueChange={(value) => setFormField({ ...formField, status_include: value })} onValueChange={(value) =>
setFormField({ ...formField, status_include: value })
}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="Select Status" /> <SelectValue placeholder="Select Status" />
@ -788,7 +804,7 @@ const EditFeeDialog = () => {
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
<div className="w-full"> <div className="w-full">
<label className="form-label"> <label className="form-label">
Priority <span className="text-red-500">*</span> Priority <span className="text-red-500">*</span>
@ -806,13 +822,9 @@ const EditFeeDialog = () => {
</SelectContent> </SelectContent>
</Select> </Select>
</div> </div>
<div className="flex justify-end pt-2.5 gap-5"> <div className="flex justify-end pt-2.5 gap-5">
<Button <Button variant={'outline'} type="button" onClick={resetForm}>
variant={'outline'}
type="button"
onClick={resetForm}
>
Reset Reset
</Button> </Button>
<Button <Button
@ -839,4 +851,4 @@ const EditFeeDialog = () => {
); );
}; };
export {EditFeeDialog}; export { EditFeeDialog };

View File

@ -378,7 +378,7 @@ const ManageTransferFeeContextProvider = ({
transactionTypeId transactionTypeId
}} }}
> >
<Toaster expand visibleToasts={9} duration={3000} /> {/* <Toaster expand visibleToasts={9} duration={3000} /> */}
<DataGridProvider <DataGridProvider
columns={columns} columns={columns}
pagination={{ size: 10 }} pagination={{ size: 10 }}