refactor(FE): Refactor form handlers to use consistent formik utilities

This commit is contained in:
rstubryan
2026-03-05 13:45:01 +07:00
parent a4cb4e202b
commit 4b49cd18f5
2 changed files with 186 additions and 174 deletions
@@ -95,62 +95,6 @@ const PurchaseOrderAcceptApprovalForm = ({
};
};
// ===== SUBMISSION HANDLERS =====
const createAcceptApprovalHandler = useCallback(
async (payload: CreateAcceptApprovalRequestPayload) => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
setPurchaseOrderFormErrorMessage('Purchase Request ID is required');
return;
}
const res = await PurchaseApi.acceptApproval.create(
purchaseRequestId,
payload
);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
formik.resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[
initialValues?.id,
searchParams,
refreshApprovals,
onModalClose,
onRefetchData,
]
);
const updateAcceptApprovalHandler = useCallback(
async (purchaseId: number, payload: CreateAcceptApprovalRequestPayload) => {
const res = await PurchaseApi.acceptApproval.create(purchaseId, payload);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
formik.resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[refreshApprovals, onModalClose, onRefetchData]
);
// ===== SELECT INPUT DATA =====
const {
options: expeditionVendors,
@@ -244,6 +188,67 @@ const PurchaseOrderAcceptApprovalForm = ({
},
});
const { resetForm, setFieldValue } = formik;
// ===== SUBMISSION HANDLERS =====
const createAcceptApprovalHandler = useCallback(
async (payload: CreateAcceptApprovalRequestPayload) => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
setPurchaseOrderFormErrorMessage('Purchase Request ID is required');
return;
}
const res = await PurchaseApi.acceptApproval.create(
purchaseRequestId,
payload
);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[
initialValues?.id,
searchParams,
refreshApprovals,
onModalClose,
onRefetchData,
onCancel,
router,
resetForm,
]
);
const updateAcceptApprovalHandler = useCallback(
async (purchaseId: number, payload: CreateAcceptApprovalRequestPayload) => {
const res = await PurchaseApi.acceptApproval.create(purchaseId, payload);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[refreshApprovals, onModalClose, onRefetchData, onCancel, router, resetForm]
);
const handleValidateForm = async () => {
const errors = await formik.validateForm();
@@ -307,9 +312,9 @@ const PurchaseOrderAcceptApprovalForm = ({
transport_per_item: item.transport_per_item || '',
};
});
formik.setFieldValue('items', updatedItems);
setFieldValue('items', updatedItems);
}
}, [purchaseItems, initialValues, key]);
}, [purchaseItems, initialValues, key, setFieldValue]);
// ===== HELPER FUNCTIONS =====
const getQuantityExceededError = useCallback(
@@ -146,120 +146,6 @@ const PurchaseOrderStaffApprovalForm = ({
return !item.purchase_item_id || item.purchase_item_id === 0;
};
// ===== SUBMISSION HANDLERS =====
const createStaffApprovalHandler = useCallback(
async (payload: CreateStaffApprovalRequestPayload) => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
setPurchaseOrderFormErrorMessage('Purchase Request ID is required');
return;
}
const res = await PurchaseApi.staffApproval.create(
purchaseRequestId,
payload
);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
formik.resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[
initialValues?.id,
searchParams,
refreshApprovals,
onModalClose,
onRefetchData,
]
);
const updateStaffApprovalHandler = useCallback(
async (purchaseId: number, payload: UpdateStaffApprovalRequestPayload) => {
const res = await PurchaseApi.staffApproval.update(purchaseId, payload);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
formik.resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[refreshApprovals, onModalClose, onRefetchData]
);
// ===== DELETE HANDLER =====
const deleteItemsHandler = useCallback(async () => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
toast.error('Purchase Request ID is required');
return;
}
const itemIdsToDelete = selectedItemForDelete
? [selectedItemForDelete]
: [];
if (itemIdsToDelete.length === 0) {
toast.error('Tidak ada item yang dipilih untuk dihapus');
return;
}
try {
const res = await PurchaseApi.items.delete(purchaseRequestId, {
item_ids: itemIdsToDelete,
});
if (isResponseError(res)) {
toast.error(res.message || 'Gagal menghapus item pembelian');
return;
}
const successMessage = 'Item pembelian berhasil dihapus';
toast.success(successMessage);
refreshApprovals?.();
onRefetchData?.();
deleteModal.closeModal();
setSelectedItemForDelete(null);
setSelectedItemIndex(null);
if (selectedItemIndex !== null) {
const updatedPurchaseItems = formik.values.items?.filter(
(_, i) => i !== selectedItemIndex
);
formik.setFieldValue('items', updatedPurchaseItems);
}
} catch {
toast.error('Terjadi kesalahan saat menghapus item pembelian');
}
}, [
initialValues?.id,
searchParams,
selectedItemForDelete,
selectedItemIndex,
refreshApprovals,
onRefetchData,
deleteModal,
]);
// ===== API DATA FETCHING FOR SUPPLIER PRODUCTS =====
const { data: supplierData, isLoading: isLoadingSupplierProducts } = useSWR(
initialValues?.supplier?.id
@@ -418,6 +304,127 @@ const PurchaseOrderStaffApprovalForm = ({
},
});
const { resetForm, setFieldValue } = formik;
// ===== SUBMISSION HANDLERS =====
const createStaffApprovalHandler = useCallback(
async (payload: CreateStaffApprovalRequestPayload) => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
setPurchaseOrderFormErrorMessage('Purchase Request ID is required');
return;
}
const res = await PurchaseApi.staffApproval.create(
purchaseRequestId,
payload
);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[
initialValues?.id,
searchParams,
refreshApprovals,
onModalClose,
onRefetchData,
resetForm,
onCancel,
router,
]
);
const updateStaffApprovalHandler = useCallback(
async (purchaseId: number, payload: UpdateStaffApprovalRequestPayload) => {
const res = await PurchaseApi.staffApproval.update(purchaseId, payload);
if (isResponseError(res)) {
setPurchaseOrderFormErrorMessage(res.message);
return;
}
toast.success(res?.message as string);
refreshApprovals?.();
onRefetchData?.();
resetForm();
onCancel?.();
onModalClose?.();
router.refresh();
},
[refreshApprovals, onModalClose, onRefetchData, resetForm, onCancel, router]
);
// ===== DELETE HANDLER =====
const deleteItemsHandler = useCallback(async () => {
const purchaseRequestId = searchParams.get('purchaseId')
? parseInt(searchParams.get('purchaseId')!)
: initialValues?.id || 1;
if (!purchaseRequestId) {
toast.error('Purchase Request ID is required');
return;
}
const itemIdsToDelete = selectedItemForDelete
? [selectedItemForDelete]
: [];
if (itemIdsToDelete.length === 0) {
toast.error('Tidak ada item yang dipilih untuk dihapus');
return;
}
try {
const res = await PurchaseApi.items.delete(purchaseRequestId, {
item_ids: itemIdsToDelete,
});
if (isResponseError(res)) {
toast.error(res.message || 'Gagal menghapus item pembelian');
return;
}
const successMessage = 'Item pembelian berhasil dihapus';
toast.success(successMessage);
refreshApprovals?.();
onRefetchData?.();
deleteModal.closeModal();
setSelectedItemForDelete(null);
setSelectedItemIndex(null);
if (selectedItemIndex !== null) {
const updatedPurchaseItems = formik.values.items?.filter(
(_, i) => i !== selectedItemIndex
);
setFieldValue('items', updatedPurchaseItems);
}
} catch {
toast.error('Terjadi kesalahan saat menghapus item pembelian');
}
}, [
initialValues?.id,
searchParams,
selectedItemForDelete,
selectedItemIndex,
refreshApprovals,
onRefetchData,
deleteModal,
setFieldValue,
formik.values.items,
]);
const handleValidateForm = async () => {
const errors = await formik.validateForm();
@@ -519,9 +526,9 @@ const PurchaseOrderStaffApprovalForm = ({
};
return itemData;
});
formik.setFieldValue('items', updatedItems);
setFieldValue('items', updatedItems);
}
}, [purchaseItems, type, initialValues]);
}, [purchaseItems, type, initialValues, setFieldValue]);
// ===== PURCHASE ITEM OPERATIONS =====
const addPurchaseItem = () => {