diff --git a/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx b/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx
index c3ded68..5f5ff7b 100644
--- a/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx
+++ b/src/pages/disbursement/history-transaction/blocks/DetailTransaction.tsx
@@ -61,7 +61,6 @@ const DetailTransaction = () => {
 
     useEffect(() => {
         const fetchTransactionDetails = async () => {
-            console.log(selectedTransactionId)
             if (selectedTransactionId) {
                 try {
                     const response = await GetData(`${API_URL}/transaction/history/${selectedTransactionId}`, {
diff --git a/src/pages/disbursement/history-transaction/blocks/DetailTransactionLog.tsx b/src/pages/disbursement/history-transaction/blocks/DetailTransactionLog.tsx
index b2a668f..3c24c1a 100644
--- a/src/pages/disbursement/history-transaction/blocks/DetailTransactionLog.tsx
+++ b/src/pages/disbursement/history-transaction/blocks/DetailTransactionLog.tsx
@@ -54,10 +54,6 @@ const TransactionLogViewer = () => {
 		detailLogData
 	} = useTransactionContext();
 
-	console.log('detailLogData: ', detailLogData)
-
-	
-
   return (
     <Dialog open={showDetailLogDialog} onOpenChange={setShowDetailLogDialog}>
         <DialogContent className="container-fixed max-w-[1280px] w-full h-[90vh] flex flex-col p-6 overflow-hidden">
diff --git a/src/pages/members/kyc-delete-member/blocks/DetailDialog.tsx b/src/pages/members/kyc-delete-member/blocks/DetailDialog.tsx
index 7875949..4ba5dfc 100644
--- a/src/pages/members/kyc-delete-member/blocks/DetailDialog.tsx
+++ b/src/pages/members/kyc-delete-member/blocks/DetailDialog.tsx
@@ -13,7 +13,7 @@ import axios from 'axios';
 
 const API_URL = apiConfig.service_customer;
 const DetailDialog = () => {
-  const { showDetailDialog, setShowDetailDialog, detailKyc } = useManageKycDeletionContext();
+  const { showDetailDialog, setShowDetailDialog, detailKyc, handleApproveReject } = useManageKycDeletionContext();
 	
   return (
 		<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
@@ -38,8 +38,8 @@ const DetailDialog = () => {
 
 							<div className="flex justify-end gap-2 mt-3">
 								<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
-								<Button onClick={()=>{}} variant="destructive" color="warning">Reject</Button>
-								<Button onClick={()=>{}} variant="default" color="primary">Approve</Button>
+								<Button onClick={()=>handleApproveReject(detailKyc.id, 'N')} variant="destructive" color="warning">Reject</Button>
+								<Button onClick={()=>handleApproveReject(detailKyc.id, 'Y')} variant="default" color="primary">Approve</Button>
 						</div>
 						</div>
 					) : (<div></div>)}
diff --git a/src/pages/members/kyc-delete-member/hooks/ManageKycDeletionContext.tsx b/src/pages/members/kyc-delete-member/hooks/ManageKycDeletionContext.tsx
index bf5e46f..c0742fd 100644
--- a/src/pages/members/kyc-delete-member/hooks/ManageKycDeletionContext.tsx
+++ b/src/pages/members/kyc-delete-member/hooks/ManageKycDeletionContext.tsx
@@ -1,5 +1,6 @@
 import { DataGridColumnHeader, DataGridProvider, KeenIcon } from '@/components';
 import { Toaster } from '@/components/ui/sonner';
+import { toast } from 'sonner';
 import { apiConfig } from '@/config/api.config';
 import { ColumnDef } from '@tanstack/react-table';
 import { createContext, useCallback, useMemo, useState } from 'react';
@@ -36,6 +37,7 @@ interface ContextProps {
   selectedIdCustomer: string | null;
   detailKyc: any | null;
   setDetailKyc: React.Dispatch<React.SetStateAction<any>>;
+  handleApproveReject: (customerDeletionId: string, status_approve: string) => {};
 }
 
 const initialProps: ContextProps = {
@@ -48,6 +50,7 @@ const initialProps: ContextProps = {
   setShowDetailDialog: () => { },
   detailKyc: async () => {},
   setDetailKyc: () => { },
+  handleApproveReject: () => ({customerDeletionId: '0', status_approve: 'Y'}),
 };
 
 const ManageKycDeletionContext = createContext<ContextProps>(initialProps);
@@ -83,13 +86,15 @@ export const renderStatusBadge = (statusRaw: string | null | undefined) => {
 	);
 };
 
+// const { reload } = useDataGrid();
+
 const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactNode }) => {
   const [showDetailDialog, setShowDetailDialog] = useState(false);
   const [showAddDialog, setShowAddDialog] = useState(false);
   const [selectedIdCustomer, setSelectedIdCustomer] = useState<string | null>(null);
   const [detailKyc, setDetailKyc] = useState<any>();
   const [manageKyc, setManageKyc] = useState<ManageKycDeletionProps[]>([]);
-  const { GetData } = useCallApi();
+  const { GetData, PostData } = useCallApi();
 
   const getKycDeletionList = async (page: number, limit: number, sorting: any, filter: any) => {
     try {
@@ -130,12 +135,11 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
   };
 
   const handleDetailDialog = useCallback(async (show: boolean, selected_id_customer: string | null) => {
-    setSelectedIdCustomer(show ? selected_id_customer : null);
-    let detailCustomer = await GetData(`${API_URL}/customer_deletion/detail/${selected_id_customer}`, {})
-		setDetailKyc(detailCustomer?.data)
-    console.log('detailCustomer: ',detailCustomer)
-    console.log('detailCustomer2: ',detailCustomer?.data)
-    console.log('detailKyc: ', detailKyc)
+    if (show == true) {
+      setSelectedIdCustomer(show ? selected_id_customer : null);
+      let detailCustomer = await GetData(`${API_URL}/customer_deletion/detail/${selected_id_customer}`, {})
+      setDetailKyc(detailCustomer?.data)
+    }
     setShowDetailDialog(show);
   }, []);
 
@@ -143,6 +147,26 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
     setShowAddDialog(show);
   }, []);
 
+  const handleApproveReject = useCallback(async (customerDeletionId: string, status_approve: string) => {
+    console.log(customerDeletionId, status_approve)
+    try {
+      let approveReject = await PostData(`${API_URL}/customer_deletion/update_status/${customerDeletionId}`, {
+        status_approve
+      })
+
+      if (approveReject?.status == true) {
+        toast.success('Success update status approval')
+        handleDetailDialog(false, null)
+      } else {
+        toast.warning(`${approveReject?.message}`)
+        handleDetailDialog(false, null)
+      }
+    } catch (error) {
+      toast.warning('Failed to approve/reject')
+      handleDetailDialog(false, null)
+    }
+  }, [])
+
   const columns = useMemo<ColumnDef<any>[]>(
     () => [
       {
@@ -242,7 +266,8 @@ const ManageKycDeletionContextProvider = ({ children }: { children: React.ReactN
         selectedIdCustomer,
         setShowDetailDialog,
         setDetailKyc,
-        detailKyc
+        detailKyc,
+        handleApproveReject,
       }}
     >
       <Toaster expand visibleToasts={9} duration={3000} />
diff --git a/src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx b/src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx
index e032a94..848eb7c 100644
--- a/src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx
+++ b/src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx
@@ -30,7 +30,7 @@ const DetailApprovalTransaction = () => {
                     const response = await GetData(`${API_URL}/transaction/history/detail/${selectedTransactionId}`, {
                         id: selectedTransactionId
                     });
-                    // console.log(response?.data);
+                    console.log(response?.data);
                     setTransactionDetails(response?.data);
                 } catch (error) {
                     console.error('Error fetching transaction', error);
@@ -190,7 +190,7 @@ const DetailApprovalTransaction = () => {
                                     </div>
                                     <div>
                                         <p className="text-sm text-gray-500">Name</p>
-                                        <p className="font-medium">{transactionDetails?.type.name}</p>
+                                        <p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
                                     </div>
                                 </div>
 
@@ -346,9 +346,11 @@ const DetailApprovalTransaction = () => {
                                         <p className="text-sm text-gray-500">Description</p>
                                         <p className="font-medium">{transactionDetails?.description}</p>
                                     </div>
+                                    <div>
                                     <div>
                                         <p className="text-sm text-gray-500">Name</p>
-                                        <p className="font-medium">{transactionDetails?.type.name}</p>
+                                        <p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
+                                    </div>
                                     </div>
                                     <div>
                                         <p className="text-sm text-gray-500">Reference</p>
diff --git a/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx b/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
index 55db0a0..6d774d7 100644
--- a/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
+++ b/src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
@@ -189,7 +189,7 @@ const DetailTransaction = () => {
                                     </div>
                                     <div>
                                         <p className="text-sm text-gray-500">Name</p>
-                                        <p className="font-medium">{transactionDetails?.type.name}</p>
+                                        <p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
                                     </div>
                                 </div>
 
@@ -347,7 +347,7 @@ const DetailTransaction = () => {
                                     </div>
                                     <div>
                                         <p className="text-sm text-gray-500">Name</p>
-                                        <p className="font-medium">{transactionDetails?.type.name}</p>
+                                        <p className="font-medium">{transactionDetails?.type?.name || '-'}</p>
                                     </div>
                                     <div>
                                         <p className="text-sm text-gray-500">Reference</p>
diff --git a/src/pages/transfer/transferfee/blocks/AddDialog.tsx b/src/pages/transfer/transferfee/blocks/AddDialog.tsx
index 0860010..6b73eed 100644
--- a/src/pages/transfer/transferfee/blocks/AddDialog.tsx
+++ b/src/pages/transfer/transferfee/blocks/AddDialog.tsx
@@ -70,6 +70,8 @@ const AddFeeDialog = () => {
     selectedTransferFee,
     transactionTypeId
   } = useManageTransferFeeContext();
+  const [customerSearchTerm, setCustomerSearchTerm] = useState('');
+  const [open, setOpen] = useState(false);
 
   const [alert, setAlert] = useState({
     show: false,
@@ -111,6 +113,7 @@ const AddFeeDialog = () => {
     credit_destination_account: ''
   };
 
+
   const [formField, setFormField] = useState(initialState);
 
   const resetForm = () => {
@@ -151,6 +154,13 @@ const AddFeeDialog = () => {
     }
   }, [showAddFeeDialog, transactionTypeId, GetData]);
 
+  useEffect(() => {
+    if (!showAddFeeDialog) {
+      setCustomerSearchTerm('');
+      setOpen(false);
+    }
+  }, [showAddFeeDialog]);
+
   useEffect(() => {
     const created_time = new Date();
     const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
@@ -619,13 +629,72 @@ const AddFeeDialog = () => {
                     <label className="form-label">
                       Credit Destination <span className="text-red-500">*</span>
                     </label>
-                    {renderSelectWithLoading(
-                      formField.credit_destination,
-                      (value) => setFormField({ ...formField, credit_destination: value }),
-                      customersWithNames,
-                      'Select Customer',
-                      isLoadingCustomers
-                    )}
+                    <div className="relative">
+                      <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"
+                        onClick={() => setOpen(!open)}
+                      >
+                        <span className="truncate">
+                          {customers.find(
+                            (customer) => customer.id === formField.credit_destination
+                          )?.username || 'Search customer...'}
+                        </span>
+                        <path d="m6 9 6 6 6-6"></path>
+                      </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">
diff --git a/src/pages/transfer/transferfee/blocks/EditDialog.tsx b/src/pages/transfer/transferfee/blocks/EditDialog.tsx
index b8077b5..3d6b0ce 100644
--- a/src/pages/transfer/transferfee/blocks/EditDialog.tsx
+++ b/src/pages/transfer/transferfee/blocks/EditDialog.tsx
@@ -72,7 +72,6 @@ const EditFeeDialog = () => {
     message: ''
   });
 
-  // Loading states
   const [isLoadingTransferFee, setIsLoadingTransferFee] = useState(false);
   const [isLoadingTransactionType, setIsLoadingTransactionType] = useState(false);
   const [isLoadingWallets, setIsLoadingWallets] = useState(false);
@@ -687,9 +686,7 @@ const EditFeeDialog = () => {
         <span className="truncate">
           {customers.find(customer => customer.id === formField.credit_destination)?.username || 'Search customer...'}
         </span>
-        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="h-4 w-4 opacity-50">
           <path d="m6 9 6 6 6-6"></path>
-        </svg>
       </div>
       
       {open && (
@@ -702,9 +699,7 @@ const EditFeeDialog = () => {
               value={customerSearchTerm}
               onChange={(e) => setCustomerSearchTerm(e.target.value)}
               autoComplete="off"
-              // Prevent clicks from closing the dropdown
               onClick={(e) => e.stopPropagation()}
-              // Auto focus the input when opened
               autoFocus
             />
           </div>