diff --git a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx index c8bae43a..397dac5e 100644 --- a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx +++ b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx @@ -1,4 +1,4 @@ -import { useEffect, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { DeliveryOrderProductFormValues, DeliveryOrderProductSchema, @@ -271,15 +271,18 @@ const DeliveryOrderProductForm = ({ // setSelectedProduct(null); }; - const handleBlurField = (field: string) => { - setCurrentInput(field); + const handleBlurField = useCallback( + (field: string) => { + setCurrentInput(field); - handleMarketingCalculation(field, { - values: formik.values, - setFieldValue: formik.setFieldValue, - hasSisaBerat, - }); - }; + handleMarketingCalculation(field, { + values: formik.values, + setFieldValue: formik.setFieldValue, + hasSisaBerat, + }); + }, + [formik.values, formik.setFieldValue, hasSisaBerat] + ); // Handler untuk onChange - auto calculation real-time untuk field yang mempengaruhi total_price (total_peti, weight_per_convertion, price_per_convertion, sisa_berat, price_sisa_berat, price_per_qty, qty) const handleFieldChange = ( @@ -324,8 +327,12 @@ const DeliveryOrderProductForm = ({ const { setValues: setFormikValues } = formik; + const processedInitialValuesRef = useRef(null); useEffect(() => { if (initialValues) { + if (processedInitialValuesRef.current === initialValues.id) return; + processedInitialValuesRef.current = initialValues.id as number; + if (!Boolean(initialValues.qty)) { handleResetForm(); } else { @@ -338,7 +345,7 @@ const DeliveryOrderProductForm = ({ } } } - }, [initialValues]); + }, [handleResetForm, initialValues, setFormikValues]); // ===== Formik Error List ===== const { formErrorList, close, handleFormSubmit } = useFormikErrorList( @@ -356,8 +363,10 @@ const DeliveryOrderProductForm = ({ ); useEffect(() => { - handleBlurField('week'); - }, [formik.values.week]); + if (formik.values.week) { + handleBlurField('week'); + } + }, [formik.values.week, handleBlurField]); return ( <> diff --git a/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProductForm.tsx b/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProductForm.tsx index 8da873e5..f7d70a02 100644 --- a/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProductForm.tsx +++ b/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProductForm.tsx @@ -5,7 +5,7 @@ import { SalesOrderProductFormValues, SalesOrderProductSchema, } from '@/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema'; -import { RefObject, useEffect, useMemo, useState } from 'react'; +import { RefObject, useCallback, useEffect, useMemo, useState } from 'react'; import { OptionType, useSelect } from '@/components/input/SelectInput'; import { Kandang } from '@/types/api/master-data/kandang'; import { WarehouseApi } from '@/services/api/master-data'; @@ -240,15 +240,18 @@ const SalesOrderProductForm = ({ }); }; - const handleBlurField = (field: string) => { - setCurrentInput(field); + const handleBlurField = useCallback( + (field: string) => { + setCurrentInput(field); - handleMarketingCalculation(field, { - values: formik.values, - setFieldValue: formik.setFieldValue, - hasSisaBerat, - }); - }; + handleMarketingCalculation(field, { + values: formik.values, + setFieldValue: formik.setFieldValue, + hasSisaBerat, + }); + }, + [formik.values, formik.setFieldValue, hasSisaBerat] + ); // Handler untuk onChange - auto calculation real-time untuk field yang mempengaruhi total_price (total_peti, weight_per_convertion, price_per_convertion, sisa_berat, price_sisa_berat, price_per_qty, qty) const handleFieldChange = ( @@ -307,8 +310,10 @@ const SalesOrderProductForm = ({ ); useEffect(() => { - handleBlurField('week'); - }, [formik.values.week]); + if (formik.values.week) { + handleBlurField('week'); + } + }, [formik.values.week, handleBlurField]); return ( <>