diff --git a/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx b/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
index 46bb52db..109b70b4 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
+++ b/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
@@ -27,12 +27,16 @@ interface PurchaseOrderAcceptApprovalFormProps {
   type?: 'add' | 'edit';
   initialValues?: Purchase;
   onCancel?: () => void;
+  refreshApprovals?: () => void;
+  onModalClose?: () => void;
 }
 
 const PurchaseOrderAcceptApprovalForm = ({
   type = 'add',
   initialValues,
   onCancel,
+  refreshApprovals,
+  onModalClose,
 }: PurchaseOrderAcceptApprovalFormProps) => {
   const searchParams = useSearchParams();
   const [purchaseOrderFormErrorMessage, setPurchaseOrderFormErrorMessage] =
@@ -99,9 +103,12 @@ const PurchaseOrderAcceptApprovalForm = ({
         return;
       }
       toast.success(res?.message as string);
+      refreshApprovals?.();
+      formik.resetForm();
       onCancel?.();
+      onModalClose?.();
     },
-    [initialValues?.id, searchParams]
+    [initialValues?.id, searchParams, refreshApprovals, onModalClose]
   );
 
   const updateAcceptApprovalHandler = useCallback(
@@ -112,10 +119,13 @@ const PurchaseOrderAcceptApprovalForm = ({
         return;
       }
       toast.success(res?.message as string);
+      refreshApprovals?.();
+      formik.resetForm();
       onCancel?.();
+      onModalClose?.();
       window.location.href = '/purchase';
     },
-    []
+    [refreshApprovals, onModalClose]
   );
 
   // ===== FORM CONFIGURATION =====
@@ -652,7 +662,12 @@ const PurchaseOrderAcceptApprovalForm = ({
               type='button'
               color='warning'
               className='px-4'
-              onClick={onCancel}
+              onClick={() => {
+                formik.resetForm();
+                setPurchaseOrderFormErrorMessage('');
+                onCancel?.();
+                onModalClose?.();
+              }}
             >
               Cancel
             </Button>
diff --git a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
index 88a9773d..8c3daad5 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
+++ b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
@@ -27,12 +27,16 @@ interface PurchaseOrderStaffApprovalFormProps {
   type?: 'add' | 'edit';
   initialValues?: Purchase;
   onCancel?: () => void;
+  refreshApprovals?: () => void;
+  onModalClose?: () => void;
 }
 
 const PurchaseOrderStaffApprovalForm = ({
   type = 'add',
   initialValues,
   onCancel,
+  refreshApprovals,
+  onModalClose,
 }: PurchaseOrderStaffApprovalFormProps) => {
   const searchParams = useSearchParams();
   const [purchaseOrderFormErrorMessage, setPurchaseOrderFormErrorMessage] =
@@ -90,9 +94,12 @@ const PurchaseOrderStaffApprovalForm = ({
         return;
       }
       toast.success(res?.message as string);
+      refreshApprovals?.();
+      formik.resetForm();
       onCancel?.();
+      onModalClose?.();
     },
-    [initialValues?.id, searchParams]
+    [initialValues?.id, searchParams, refreshApprovals, onModalClose]
   );
 
   const updateStaffApprovalHandler = useCallback(
@@ -106,10 +113,13 @@ const PurchaseOrderStaffApprovalForm = ({
         return;
       }
       toast.success(res?.message as string);
+      refreshApprovals?.();
+      formik.resetForm();
       onCancel?.();
+      onModalClose?.();
       await router.push(`/purchase/detail?purchaseId=${purchaseId}`);
     },
-    []
+    [refreshApprovals, onModalClose]
   );
 
   // ===== FORM CONFIGURATION =====
@@ -451,7 +461,12 @@ const PurchaseOrderStaffApprovalForm = ({
                 type='button'
                 color='warning'
                 className='px-4'
-                onClick={onCancel}
+                onClick={() => {
+                  formik.resetForm();
+                  setPurchaseOrderFormErrorMessage('');
+                  onCancel?.();
+                  onModalClose?.();
+                }}
               >
                 Cancel
               </Button>
diff --git a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
index 3e2bc913..904177bb 100644
--- a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
+++ b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
@@ -544,11 +544,7 @@ const PurchaseOrderDetail = ({
               Approve
             </Button>
 
-            <Button
-              variant='outline'
-              color='error'
-              className='w-full sm:w-fit'
-            >
+            <Button variant='outline' color='error' className='w-full sm:w-fit'>
               <Icon icon='material-symbols:close' width={24} height={24} />
               Reject
             </Button>
@@ -864,6 +860,7 @@ const PurchaseOrderDetail = ({
             };
 
             await createManagerApprovalHandler(payload);
+            await refreshApprovals();
             confirmationModalWithNotes.closeModal();
           },
         }}
@@ -884,6 +881,8 @@ const PurchaseOrderDetail = ({
           type='add'
           initialValues={purchaseData}
           onCancel={handleStaffApprovalModalClose}
+          refreshApprovals={refreshApprovals}
+          onModalClose={staffApprovalModal.closeModal}
         />
       </Modal>
 
@@ -899,6 +898,8 @@ const PurchaseOrderDetail = ({
           type='add'
           initialValues={purchaseData}
           onCancel={acceptApprovalModal.closeModal}
+          refreshApprovals={refreshApprovals}
+          onModalClose={acceptApprovalModal.closeModal}
         />
       </Modal>
 
@@ -914,6 +915,8 @@ const PurchaseOrderDetail = ({
           type='edit'
           initialValues={purchaseData}
           onCancel={handleEditModalClose}
+          refreshApprovals={refreshApprovals}
+          onModalClose={editModal.closeModal}
         />
       </Modal>
 
@@ -929,6 +932,8 @@ const PurchaseOrderDetail = ({
           type='edit'
           initialValues={purchaseData}
           onCancel={penerimaanBarangModal.closeModal}
+          refreshApprovals={refreshApprovals}
+          onModalClose={penerimaanBarangModal.closeModal}
         />
       </Modal>