refactor(FE-208): improve deletion logic in PurchaseOrderDetail to restrict item deletion to approval step 3 and enhance approval step handling

src/components/pages/purchase/order/PurchaseOrderDetail.tsx

@@ -160,13 +160,36 @@ const PurchaseOrderDetail = ({
     return initialValues.approval.step_number;
   }, [initialValues?.approval]);
 
+  const {
+    approvals,
+    isLoading: approvalsLoading,
+    rawDataApprovals,
+    refresh: refreshApprovals,
+  } = useApprovalSteps({
+    latestApproval: initialValues?.approval,
+    approvalLines: PURCHASE_ORDER_APPROVAL_LINE,
+    moduleName: 'PURCHASES',
+    moduleId: initialValues?.id?.toString() ?? '',
+    params: {
+      limit: 100,
+      group_step_number: true,
+    },
+  });
+
   const showApprovalButton =
     approvalStep !== null && approvalStep >= 1 && approvalStep <= 3;
 
   const canDeleteItems = useMemo(() => {
     if (!initialValues?.approval) return false;
-    return initialValues.approval.step_number === 3;
-  }, [initialValues?.approval]);
+
+    const currentStep = initialValues.approval.step_number;
+
+    const hasReachedStep5 = rawDataApprovals?.some(
+      (approval) => approval.step_number === 5
+    );
+
+    return currentStep === 3 && !hasReachedStep5;
+  }, [initialValues?.approval, rawDataApprovals]);
 
   const handleApprovalClick = () => {
     if (!approvalStep) return;
@@ -212,22 +235,6 @@ const PurchaseOrderDetail = ({
     return currentStep === 5;
   }, [initialValues?.approval]);
 
-  const {
-    approvals,
-    isLoading: approvalsLoading,
-    rawDataApprovals,
-    refresh: refreshApprovals,
-  } = useApprovalSteps({
-    latestApproval: initialValues?.approval,
-    approvalLines: PURCHASE_ORDER_APPROVAL_LINE,
-    moduleName: 'PURCHASES',
-    moduleId: initialValues?.id?.toString() ?? '',
-    params: {
-      limit: 100,
-      group_step_number: true,
-    },
-  });
-
   const totalBeforeTax = useMemo(() => {
     return purchaseOrderItems.reduce(
       (sum, item) => sum + (item.total_price || 0),