diff --git a/src/pages/transaction/history-transaction/Transaction.tsx b/src/pages/transaction/history-transaction/Transaction.tsx
index ca2dbf8..ee0aeff 100644
--- a/src/pages/transaction/history-transaction/Transaction.tsx
+++ b/src/pages/transaction/history-transaction/Transaction.tsx
@@ -29,7 +29,7 @@ const Transaction = () => {
           <div className="grid gap-5 lg:gap-7.5">
             <DataGridInner />
           </div>
-          <ResendTransaction />
+          {/* <ResendTransaction /> */}
         </Container>
       </TransactionProvider>
     </>
diff --git a/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx b/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
index 079aaf6..46a9acc 100644
--- a/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
+++ b/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
@@ -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;
\ No newline at end of file
diff --git a/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx b/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx
index 2b4b13d..3da5a09 100644
--- a/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx
+++ b/src/pages/transaction/history-transaction/blocks/ResendTransaction.tsx
@@ -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>
diff --git a/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx b/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx
index 6b02b50..52409ad 100644
--- a/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx
+++ b/src/pages/transaction/history-transaction/hooks/TransactionContext.tsx
@@ -2,16 +2,11 @@ import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components';
 import { Toaster } from '@/components/ui/sonner';
 import { apiConfig } from '@/config/api.config';
 import { ColumnDef } from '@tanstack/react-table';
-import axios from 'axios';
-import React, { createContext, useCallback, useEffect, useMemo, useState } from 'react';
+import React, { createContext, useCallback, useMemo, useState } from 'react';
 import { useCallApi } from '@/hooks';
 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';
-import { comment } from 'stylis';
 
 interface TransactionProps {
   id: number;
@@ -31,9 +26,6 @@ interface ContextProps {
   setShowDetailDialog: React.Dispatch<React.SetStateAction<boolean>>;
   selectedTransactionId: number | null;
   setSelectedTransactionId: React.Dispatch<React.SetStateAction<number | null>>;
-  showResendDialog: boolean;
-  handleResendDialog: (show: boolean, selected_transaction: string | null) => void;
-  selectedTransactionForResend: string | null;
 }
 
 const initialProps: ContextProps = {
@@ -41,10 +33,7 @@ const initialProps: ContextProps = {
   showDetailDialog: false,
   setShowDetailDialog: () => { },
   selectedTransactionId: null,
-  setSelectedTransactionId: () => { },
-  showResendDialog: false,
-  handleResendDialog: (show: boolean, selected_transaction: string | null) => { },
-  selectedTransactionForResend: null
+  setSelectedTransactionId: () => { }
 };
 
 const ManageTransactionContext = createContext<ContextProps>(initialProps);
@@ -59,13 +48,6 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
   const handleNavigate = (path: string) => {
     const url = navigate(`${API_URL}/transaction/history/${path}`);
   };
-  const [showResendDialog, setShowResendDialog] = useState(false);
-  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>[]>(
@@ -217,18 +199,6 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
               >
                 <KeenIcon icon="eye" />
               </button>
-              {/* add new button for resend transaction failed */}
-              {isVisible &&
-                <button
-                  className="btn btn-sm btn-icon btn-clear btn-light"
-                  title="Retry Transaction"
-                  onClick={() => {
-                    handleResendDialog(true, row.id);
-                  }}
-                >
-                  <KeenIcon icon="abstract-37" />
-                </button>
-              }
             </div>
           );
         },
@@ -238,7 +208,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
         }
       }
     ],
-    [handleResendDialog]);
+    []);
 
   const getTransactionLists = async (page: number, limit: number, sorting: any, filter: any) => {
     try {
@@ -314,10 +284,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
         showDetailDialog,
         setShowDetailDialog,
         selectedTransactionId,
-        setSelectedTransactionId,
-        showResendDialog,
-        handleResendDialog,
-        selectedTransactionForResend
+        setSelectedTransactionId
       }}
     >
       <Toaster expand visibleToasts={9} duration={3000} />