add ResendTransaction component and integrate into Transaction context

This commit is contained in:
ardiola
2025-04-15 22:03:45 +07:00
parent bb37f9711b
commit 3b45b6f1e4
3 changed files with 167 additions and 141 deletions

View File

@ -11,6 +11,7 @@ import { useNavigate } from 'react-router';
import DetailTransaction from '../blocks/DetailTransaction';
import { log } from 'console';
import ResendTransaction from '../blocks/ResendTransaction';
import { comment } from 'stylis';
interface TransactionProps {
id: number;
@ -31,9 +32,8 @@ interface ContextProps {
selectedTransactionId: number | null;
setSelectedTransactionId: React.Dispatch<React.SetStateAction<number | null>>;
showResendDialog: boolean;
setShowResendDialog: React.Dispatch<React.SetStateAction<boolean>>;
selectedTransactionRowForResend: any | null;
setTransactionRowForResend: React.Dispatch<React.SetStateAction<any | null>>;
handleResendDialog: (show: boolean, selected_transaction: string | null) => void;
selectedTransactionForResend: string | null;
}
const initialProps: ContextProps = {
@ -43,9 +43,8 @@ const initialProps: ContextProps = {
selectedTransactionId: null,
setSelectedTransactionId: () => { },
showResendDialog: false,
setShowResendDialog: () => { },
selectedTransactionRowForResend: null,
setTransactionRowForResend: () => { }
handleResendDialog: (show: boolean, selected_transaction: string | null) => { },
selectedTransactionForResend: null
};
const ManageTransactionContext = createContext<ContextProps>(initialProps);
@ -61,7 +60,13 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
const url = navigate(`${API_URL}/transaction/history/${path}`);
};
const [showResendDialog, setShowResendDialog] = useState(false);
const [selectedTransactionRowForResend, setTransactionRowForResend] = useState<any | null>(null);
const [selectedTransactionForResend, setSelectedTransactionForResend] = useState<string | null>(null);
const handleResendDialog = useCallback((show: boolean, selected_transaction: string | null) => {
setSelectedTransactionForResend(show ? selected_transaction : null);
setShowResendDialog(show);
}, []);
const columns = useMemo<ColumnDef<any>[]>(
() => [
@ -174,7 +179,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
</span>
);
},
},
},
{
accessorKey: 'description',
header: ({ column }) => <DataGridColumnHeader title="Description" column={column} />,
@ -216,10 +221,9 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
{isVisible &&
<button
className="btn btn-sm btn-icon btn-clear btn-light"
title="Resend Transaction"
title="Retry Transaction"
onClick={() => {
setTransactionRowForResend(row);
setShowResendDialog(true);
handleResendDialog(true, row.id);
}}
>
<KeenIcon icon="abstract-37" />
@ -234,7 +238,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
}
}
],
[]);
[handleResendDialog]);
const getTransactionLists = async (page: number, limit: number, sorting: any, filter: any) => {
try {
@ -287,14 +291,12 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
selectedTransactionId,
setSelectedTransactionId,
showResendDialog,
setShowResendDialog,
selectedTransactionRowForResend,
setTransactionRowForResend
handleResendDialog,
selectedTransactionForResend
}}
>
<Toaster expand visibleToasts={9} duration={3000} />
<DetailTransaction />
<ResendTransaction />
<DataGridProvider
columns={columns}