TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update ResendTransaction component and remove unused dialog handling

Browse Source
This commit is contained in:
ardiola
2025-04-22 01:15:39 +07:00
parent dc4f33ffcd
commit 31a6d3d795
4 changed files with 82 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
View File

@ -1,12 +1,14 @@
import { useTransactionContext } from '../hooks/useTransactionContext';
import { useCallApi } from '@/hooks';
import { apiConfig } from '@/config/api.config';
import { useEffect, useState } from 'react';
import { useCallback, useEffect, useState } from 'react';
import ResendTransaction from './ResendTransaction';
import {
Dialog,
DialogBody,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle
} from '@/components/ui/dialog';
@ -23,6 +25,16 @@ const DetailTransaction = () => {
const [transactionDetails, setTransactionDetails] = useState<any>(null);
const [showResend, setResend] = useState(false);
const handleResendOpen = () => {
setResend(true);
};
const handleResendClose = () => {
setResend(false);
};
useEffect(() => {
const fetchTransactionDetails = async () => {
if (selectedTransactionId) {
@ -622,10 +634,20 @@ const DetailTransaction = () => {
)}
</div>
{/* {showResendDialog} */}
{(transactionDetails?.status === 'F' || transactionDetails?.status === 'P') && transactionDetails?.status_approve !== 'W' && (
<div className="flex justify-end mt-4">
<button className="btn btn-primary" onClick={handleResendOpen}>Retry Transaction</button>
<ResendTransaction isOpen={showResend} onClose={handleResendClose} selectedTransactionForResend={transactionDetails} />
</div>
)}
</DialogBody>
</DialogContent>
</Dialog>
);
};
export default DetailTransaction;
export default DetailTransaction;

89
src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx
View File

@ -19,10 +19,18 @@ import { Input } from '@/components/ui/input';
const API_URL = apiConfig.transaction;
const ResendTransaction = () => {
const { showResendDialog, handleResendDialog, selectedTransactionForResend } = useTransactionContext();
interface ResendTransactionProps {
isOpen: boolean | null;
onClose: () => void | null;
selectedTransactionForResend: any | null; // Adjust the type as per your requirements
}
const ResendTransaction = ({ isOpen, onClose, selectedTransactionForResend }: ResendTransactionProps) => {
// const { showResendDialog, handleResendDialog, selectedTransactionForResend } = useTransactionContext();
const { GetData, PostData } = useCallApi();
const { reload } = useDataGrid();
// const { reload } = useDataGrid();
const [transactionDetails, setTransactionDetails] = useState<any>(null);
const [alert, setAlert] = useState({
show: false,
@ -34,38 +42,42 @@ const ResendTransaction = () => {
const [formField, setFormField] = useState(initialStatePin);
useEffect(() => {
if (showResendDialog) {
// if (showResendDialog) {
if (isOpen) {
// Reset form fields when dialog opens
setFormField({
pin: ''
});
setAlert({ show: false, message: '' });
setTransactionDetails(null); // Optional reset
// setTransactionDetails(null); // Optional reset
}
}, [showResendDialog]);
}, [isOpen]);
useEffect(() => {
const fetchTransactionDetails = async () => {
if (selectedTransactionForResend) {
try {
const response = await GetData(
`${API_URL}/transaction/history/detail/${selectedTransactionForResend}`,
{
id: selectedTransactionForResend,
}
);
setTransactionDetails(response?.data);
} catch (error) {
console.error('Error fetching transaction', error);
}
}
// useEffect(() => {
// const fetchTransactionDetails = async () => {
// if (selectedTransactionForResend) {
// try {
// const response = await GetData(
// `${API_URL}/transaction/history/detail/${selectedTransactionForResend}`,
// {
// id: selectedTransactionForResend,
// }
// );
// setTransactionDetails(response?.data);
// } catch (error) {
// console.error('Error fetching transaction', error);
// }
// }
};
// };
// if (isOpen && selectedTransactionForResend) {
// fetchTransactionDetails();
// }
// }, [isOpen, selectedTransactionForResend, GetData]);
// console.log(selectedTransactionForResend);
if (showResendDialog && selectedTransactionForResend) {
fetchTransactionDetails();
}
}, [showResendDialog, selectedTransactionForResend, GetData]);
const doResendTransaction = useCallback(async (data: any | null, pintransactiion: string) => {
@ -146,9 +158,9 @@ const ResendTransaction = () => {
if (response?.status) {
setAlert({ show: false, message: '' });
handleResendDialog(false, null);
// handleResendDialog(false, null);
toast.success('Success Retry Transaction');
reload();
// reload();
const createActivity = {
module: 'History Transaction',
@ -161,17 +173,20 @@ const ResendTransaction = () => {
setAlert({ show: true, message: response?.message });
toast.error('Failed Retry Transaction');
}
}, [selectedTransactionForResend, PostData, handleResendDialog, reload]);
}, [selectedTransactionForResend, PostData]);
if (!isOpen) return null;
return (
<Dialog open={showResendDialog} onOpenChange={(open) => handleResendDialog(open, null)}>
<Dialog open={isOpen} onOpenChange={onClose}>
<DialogContent className="container-fixed max-w-md flex flex-col p-5 overflow-hidden [&>button]:hidden">
<DialogHeader className="p-0 border-0 block">
<DialogTitle></DialogTitle>
<DialogDescription></DialogDescription>
<Alert variant="warning">
<h3 className="text-lg">Are you sure?</h3>
<span className="text-sm">You will retry this transaction!</span>
<p className="text-sm">You will retry this transaction!</p>
</Alert>
{alert.show && (
<Alert variant="danger">
@ -188,14 +203,16 @@ const ResendTransaction = () => {
type="password"
value={formField.pin}
onChange={(e) => setFormField({ ...formField, pin: e.target.value })}
/></DialogBody>
/>
</DialogBody>
<DialogFooter className="flex justify-end items-center gap-4 mt-3">
<Button variant="outline" onClick={() => handleResendDialog(false, null)}>
<button onClick={onClose}>Close</button>
{/* <Button variant="outline" onClick={() => handleResendDialog(false, null)}>
Cancel
</Button>
<Button variant="default" onClick={() => doResendTransaction(transactionDetails, formField.pin)}>
</Button> */}
<button className="btn btn-primary" onClick={() => doResendTransaction(selectedTransactionForResend, formField.pin)}>
Retry
</Button>
</button>
</DialogFooter>
</DialogContent>
</Dialog>