From 2e795ece53d2fd3f23d32be8a0564335b474332d Mon Sep 17 00:00:00 2001 From: ardiola Date: Fri, 11 Apr 2025 22:27:58 +0700 Subject: [PATCH] Add ResendTransaction component Add resend button in transactioncontext --- .gitignore | 3 + package-lock.json | 5 + package.json | 1 + .../blocks/ResendTransaction.tsx | 183 ++++++++++++ .../hooks/TransactionContext.tsx | 37 ++- yarn.lock | 269 ++++++++++++++++++ 6 files changed, 495 insertions(+), 3 deletions(-) create mode 100644 src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx diff --git a/.gitignore b/.gitignore index cff2732..a93a63a 100644 --- a/.gitignore +++ b/.gitignore @@ -30,3 +30,6 @@ yarn.lock .env package-lock.json +package.json +yarn.lock +package-lock.json diff --git a/package-lock.json b/package-lock.json index 87756c1..3e4da0b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -49,6 +49,7 @@ "https": "^1.0.0", "leaflet": "^1.9.4", "lucide-react": "^0.456.0", + "metronic-tailwind-react": "file:", "mini-svg-data-uri": "^1.4.4", "moment": "^2.30.1", "next-themes": "^0.4.3", @@ -6454,6 +6455,10 @@ "node": ">= 8" } }, + "node_modules/metronic-tailwind-react": { + "resolved": "", + "link": true + }, "node_modules/micromatch": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", diff --git a/package.json b/package.json index 2e30fa9..7745b80 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ "https": "^1.0.0", "leaflet": "^1.9.4", "lucide-react": "^0.456.0", + "metronic-tailwind-react": "file:", "mini-svg-data-uri": "^1.4.4", "moment": "^2.30.1", "next-themes": "^0.4.3", diff --git a/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx b/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx new file mode 100644 index 0000000..3e68622 --- /dev/null +++ b/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx @@ -0,0 +1,183 @@ +import { useTransactionContext } from '../hooks/useTransactionContext'; +import { useCallApi } from '@/hooks'; +import { apiConfig } from '@/config/api.config'; +import { useCallback, useEffect, useRef, useState } from 'react'; +import { + Dialog, + DialogBody, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle +} from '@/components/ui/dialog'; +import { Button } from '@/components/ui/button'; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue +} from '@/components/ui/select'; +import { Alert, KeenIcon, useDataGrid } from '@/components'; +import { doSaveLogActivity } from '@/actions/GlobalActions'; +import { toast } from 'sonner'; +import { Input } from '@/components/ui/input'; + +const API_URL = apiConfig.transaction; + +const ResendTransaction = () => { + const { GetData, PostData } = useCallApi(); + // const { reload } = useDataGrid(); + const { + showResendDialog, + setShowResendDialog, + selectedTransactionRowForResend + } = useTransactionContext(); + + // const [transactionDetails, setTransactionDetails] = useState(null); + + // const [formField, setFormField] = useState({ + // transaction_code: '', + // status: '' + // }); + + console.log('selectedTransactionRowForResend', selectedTransactionRowForResend); + + const [alert, setAlert] = useState({ + show: false, + message: '' + }); + + // const doApproval = useCallback( + // async (e: React.FormEvent) => { + // e.preventDefault(); + + // if (!transactionDetails || !transactionDetails.code) { + // toast.error('Transaction data not loaded yet.'); + // return; + // } + + // if (!formField.status) { + // toast.error('Please select a status.'); + // return; + // } + + // const response = await PostData(`${API_URL}/transaction/set-approval`, { + // transaction_code: transactionDetails.code, + // status: formField.status, + // }); + + // if (response?.status) { + // setAlert((prev) => ({ ...prev, show: false, message: '' })); + // toast.success('Success Update Position'); + // const createActivity = { + // module: 'Approval Transaction', + // description: `Change status approve for transaction => ${transactionDetails.code}`, + // action: 'U' + // }; + // doSaveLogActivity(createActivity); + // setShowApprovalDialog(false); // optionally close dialog + // } else { + // setAlert((prev) => ({ ...prev, show: true, message: response?.message })); + // } + // }, + // [formField, transactionDetails] + // ); + + // useEffect(() => { + // const fetchTransactionDetails = async () => { + // if (selectedTransactionIdForApproval) { + // try { + // const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionIdForApproval}`, { + // id: selectedTransactionIdForApproval + // }); + // // console.log(response?.data.code); + // // console.log(selectedTransactionIdForApproval); + // setTransactionDetails(response?.data); + // } catch (error) { + // console.error('Error fetching transaction', error); + // } + // } + // }; + + // if (showApprovalDialog && selectedTransactionIdForApproval) { + // fetchTransactionDetails(); + // } + // }, [showApprovalDialog, selectedTransactionIdForApproval, GetData]); + + return ( + setShowResendDialog(open)}> + + + + + +

Are you sure?

+ You will resend this failed transaction! + + {alert.show && ( + +

{alert.message}

+ + )} + + + + + + + + ); + + // return ( + // + // + // + // Resend Transaction + // + // + //

tes dialog

+ // {/*
+ //
+ //
+ //
+ // + + //
+ // + //
+ //
+ //
+ + + //
+ //
+ // + //
+ //
+ //
*/} + // + // + // + // ); +}; + +export default ResendTransaction; diff --git a/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx b/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx index 5e28d8f..ca7b179 100644 --- a/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx +++ b/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx @@ -9,6 +9,8 @@ import ListToolbar from '../blocks/ListToolbar'; import { Button } from '@/components/ui/button'; import { useNavigate } from 'react-router'; import DetailTransaction from '../blocks/DetailTransaction'; +import { log } from 'console'; +import ResendTransaction from '../blocks/ResendTransaction'; interface TransactionProps { id: number; @@ -28,6 +30,10 @@ interface ContextProps { setShowDetailDialog: React.Dispatch>; selectedTransactionId: number | null; setSelectedTransactionId: React.Dispatch>; + showResendDialog: boolean; + setShowResendDialog: React.Dispatch>; + selectedTransactionRowForResend: any | null; + setTransactionRowForResend: React.Dispatch>; } const initialProps: ContextProps = { @@ -35,7 +41,11 @@ const initialProps: ContextProps = { showDetailDialog: false, setShowDetailDialog: () => { }, selectedTransactionId: null, - setSelectedTransactionId: () => { } + setSelectedTransactionId: () => { }, + showResendDialog: false, + setShowResendDialog: () => { }, + selectedTransactionRowForResend: null, + setTransactionRowForResend: () => { } }; const ManageTransactionContext = createContext(initialProps); @@ -50,6 +60,8 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { const handleNavigate = (path: string) => { const url = navigate(`${API_URL}/transaction/history/${path}`); }; + const [showResendDialog, setShowResendDialog] = useState(false); + const [selectedTransactionRowForResend, setTransactionRowForResend] = useState(null); const columns = useMemo[]>( () => [ @@ -84,7 +96,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { }); return formattedDateTime; // Format DD-MM-YYYY HH:MM:SS (menggunakan waktu yang sudah ada) } - }, + }, { accessorKey: 'origin_customer.fullname', header: ({ column }) => , @@ -171,6 +183,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { enableHiding: false, cell: (data) => { const row = data.row.original; + const isVisible = row.status === 'F' ? true : false || row.status === 'P' ? true : false; return (
+ {/* add new button for resend transaction failed */} + {isVisible && + + }
); }, @@ -241,11 +267,16 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => { showDetailDialog, setShowDetailDialog, selectedTransactionId, - setSelectedTransactionId + setSelectedTransactionId, + showResendDialog, + setShowResendDialog, + selectedTransactionRowForResend, + setTransactionRowForResend }} > +