diff --git a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
index 57af080f..3f55737e 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
+++ b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
@@ -9,13 +9,10 @@ import useSWR from 'swr';
 import Button from '@/components/Button';
 import TextInput from '@/components/input/TextInput';
 import NumberInput from '@/components/input/NumberInput';
-import SelectInput, {
-  OptionType,
-  useSelect,
-} from '@/components/input/SelectInput';
+import SelectInput, { OptionType } from '@/components/input/SelectInput';
 import ConfirmationModal from '@/components/modal/ConfirmationModal';
 import { useModal } from '@/components/Modal';
-import { WarehouseApi, SupplierApi } from '@/services/api/master-data';
+import { SupplierApi } from '@/services/api/master-data';
 import { SupplierProducts } from '@/types/api/master-data/supplier';
 import { isResponseSuccess } from '@/lib/api-helper';
 
@@ -32,8 +29,8 @@ import {
   UpdateStaffApprovalRequestPayload,
   Purchase,
 } from '@/types/api/purchase/purchase';
+import { BaseApproval, BaseGroupedApproval } from '@/types/api/api-general';
 import { useRouter } from 'next/navigation';
-import { useApprovalSteps } from '@/components/pages/ApprovalSteps';
 
 interface PurchaseOrderStaffApprovalFormProps {
   type?: 'add' | 'edit';
@@ -42,6 +39,7 @@ interface PurchaseOrderStaffApprovalFormProps {
   refreshApprovals?: () => void;
   onModalClose?: () => void;
   onRefetchData?: () => void;
+  rawDataApprovals?: BaseApproval[] | BaseGroupedApproval[];
 }
 
 const PurchaseOrderStaffApprovalForm = ({
@@ -51,18 +49,8 @@ const PurchaseOrderStaffApprovalForm = ({
   refreshApprovals,
   onModalClose,
   onRefetchData,
+  rawDataApprovals,
 }: PurchaseOrderStaffApprovalFormProps) => {
-  const { rawDataApprovals } = useApprovalSteps({
-    latestApproval: initialValues?.approval,
-    approvalLines: [],
-    moduleName: 'PURCHASES',
-    moduleId: initialValues?.id?.toString() ?? '',
-    params: {
-      limit: 100,
-      group_step_number: true,
-    },
-  });
-
   const type = useMemo(() => {
     if (propType && (propType === 'add' || propType === 'edit')) {
       return propType;
@@ -76,8 +64,7 @@ const PurchaseOrderStaffApprovalForm = ({
     const hasOnlyInitialStep =
       rawDataApprovals.length === 1 &&
       firstApproval?.step_number === 1 &&
-      'action' in firstApproval &&
-      firstApproval.action === 'CREATED';
+      ('action' in firstApproval ? firstApproval.action === 'CREATED' : false);
 
     return hasOnlyInitialStep ? 'add' : 'edit';
   }, [rawDataApprovals, propType]);
diff --git a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
index 860a8ed7..11faab80 100644
--- a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
+++ b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
@@ -954,6 +954,7 @@ const PurchaseOrderDetail = ({
           refreshApprovals={refreshApprovals}
           onModalClose={staffApprovalModal.closeModal}
           onRefetchData={refetchData}
+          rawDataApprovals={rawDataApprovals}
         />
       </Modal>
 
@@ -990,6 +991,7 @@ const PurchaseOrderDetail = ({
           refreshApprovals={refreshApprovals}
           onModalClose={editModal.closeModal}
           onRefetchData={refetchData}
+          rawDataApprovals={rawDataApprovals}
         />
       </Modal>