refactor(FE): Refactor modal action handling in order form modals

This commit is contained in:
rstubryan
2026-02-07 09:32:34 +07:00
parent 3dee5c1828
commit 3b42709577
2 changed files with 39 additions and 40 deletions
@@ -59,6 +59,10 @@ const DeliveryOrderFormModal = ({
const modalAction = searchParams.get('action');
const marketingId = searchParams.get('id');
const [currentModalAction, setCurrentModalAction] = useState<string | null>(
modalAction
);
const isModalActionForForm =
modalAction === 'add_delivery' ||
modalAction === 'edit_delivery' ||
@@ -420,18 +424,7 @@ const DeliveryOrderFormModal = ({
const deliveryRejected = useMemo(() => {
return (
isResponseSuccess(marketing) &&
((marketing.data.latest_approval.step_number === 3 &&
marketing.data.latest_approval.action === 'REJECTED') ||
(marketing.data.latest_approval.step_number === 2 &&
marketing.data.latest_approval.action === 'REJECTED'))
);
}, [marketing]);
const isPending = useMemo(() => {
return (
isResponseSuccess(marketing) &&
marketing.data.latest_approval.step_number === 1 &&
marketing.data.latest_approval.action === 'PENDING'
marketing.data.latest_approval.action === 'REJECTED'
);
}, [marketing]);
@@ -442,6 +435,7 @@ const DeliveryOrderFormModal = ({
modalAction === 'edit_delivery' ||
modalAction === 'detail'
) {
setCurrentModalAction(modalAction);
formModal.openModal();
}
}, [modalAction]);
@@ -670,13 +664,7 @@ const DeliveryOrderFormModal = ({
<div className='px-4'>
<MemoizedDeliveryOrderProductTable
marketing={marketing.data}
formType={
deliveryRejected
? 'rejected'
: isPending
? 'pending'
: modalAction
}
formType={deliveryRejected ? 'rejected' : modalAction}
data={deliveryOrderValues}
onEdit={handleEditDO}
onDelete={handleDeleteDO}
@@ -726,7 +714,7 @@ const DeliveryOrderFormModal = ({
variant='outline'
color='none'
onClick={() => rejectModal.openModal()}
disabled={deliveryRejected || isPending}
disabled={deliveryRejected}
className='p-3 border-base-content/10 shadow-button-soft rounded-lg text-sm text-base-content/50 font-semibold'
>
Reject
@@ -738,7 +726,7 @@ const DeliveryOrderFormModal = ({
formRef.current?.requestSubmit();
}}
className='p-3 shadow-button-soft text-base-100 rounded-lg text-sm font-semibold'
disabled={deliveryRejected || isPending}
disabled={deliveryRejected}
>
Approve
</Button>
@@ -753,8 +741,8 @@ const DeliveryOrderFormModal = ({
ref={successModal.ref}
iconPosition='left'
type='success'
text={`${modalAction === 'add' ? 'Data Berhasil Disimpan' : 'Data Berhasil Diubah'}`}
subtitleText={`${modalAction === 'add' ? 'Data delivery order telah berhasil disimpan.' : 'Data delivery order telah berhasil diubah.'}`}
text={`${currentModalAction === 'add' ? 'Data Berhasil Disimpan' : 'Data Berhasil Diubah'}`}
subtitleText={`${currentModalAction === 'add' ? 'Data delivery order telah berhasil disimpan.' : 'Data delivery order telah berhasil diubah.'}`}
primaryButton={{
text: 'Oke',
color: 'primary',
@@ -764,14 +752,18 @@ const DeliveryOrderFormModal = ({
},
}}
>
<MemoizedDeliveryOrderProductTable
marketing={isResponseSuccess(marketing) ? marketing.data : undefined}
formType={'success'}
data={deliveryOrderValues}
onDelete={handleDeleteDO}
onEdit={handleEditDO}
onAddProductClick={handleAddDOClick}
/>
<div className='max-h-[46vh] overflow-y-auto'>
<MemoizedDeliveryOrderProductTable
marketing={
isResponseSuccess(marketing) ? marketing.data : undefined
}
formType={'success'}
data={deliveryOrderValues}
onDelete={handleDeleteDO}
onEdit={handleEditDO}
onAddProductClick={handleAddDOClick}
/>
</div>
</ConfirmationModal>
<ConfirmationModalWithNotes
@@ -63,6 +63,10 @@ const SalesOrderFormModal = ({
const modalAction = searchParams.get('action');
const marketingId = searchParams.get('id');
const [currentModalAction, setCurrentModalAction] = useState<string | null>(
modalAction
);
const isModalActionForForm =
modalAction === 'add' ||
modalAction === 'edit' ||
@@ -412,6 +416,7 @@ const SalesOrderFormModal = ({
// ================== EFFECT ==================
useEffect(() => {
if (modalAction === 'add' || modalAction === 'edit') {
setCurrentModalAction(modalAction);
formModal.openModal();
}
}, [modalAction]);
@@ -724,8 +729,8 @@ const SalesOrderFormModal = ({
ref={successModal.ref}
iconPosition='left'
type='success'
text={`${modalAction === 'add' ? 'Data Berhasil Ditambahkan' : 'Data Berhasil Diubah'}`}
subtitleText={`${modalAction === 'add' ? 'Data sales order telah berhasil disimpan.' : 'Data sales order telah berhasil diubah.'}`}
text={`${currentModalAction === 'add' ? 'Data Berhasil Ditambahkan' : 'Data Berhasil Diubah'}`}
subtitleText={`${currentModalAction === 'add' ? 'Data sales order telah berhasil disimpan.' : 'Data sales order telah berhasil diubah.'}`}
primaryButton={{
text: 'Oke',
color: 'primary',
@@ -735,13 +740,15 @@ const SalesOrderFormModal = ({
},
}}
>
<MemoizedSalesOrderProductTable
formType={'success'}
data={memoSalesOrder}
onDelete={handleDeleteSO}
onEdit={handleEditSO}
onAddProductClick={handleAddSOClick}
/>
<div className='max-h-[46vh] overflow-y-auto'>
<MemoizedSalesOrderProductTable
formType={'success'}
data={memoSalesOrder}
onDelete={handleDeleteSO}
onEdit={handleEditSO}
onAddProductClick={handleAddSOClick}
/>
</div>
</ConfirmationModal>
<ConfirmationModal