diff --git a/src/components/pages/inventory/movement/form/MovementForm.tsx b/src/components/pages/inventory/movement/form/MovementForm.tsx index e5c90f4a..5d69f03e 100644 --- a/src/components/pages/inventory/movement/form/MovementForm.tsx +++ b/src/components/pages/inventory/movement/form/MovementForm.tsx @@ -38,24 +38,6 @@ interface MovementFormProps { initialValues?: Movement; } -function getEkspedisiFieldError( - formik: FormikProps, - idx: number, - field: keyof EkspedisiSchema -) { - const errorObj = formik.errors.ekspedisi?.[idx]; - const touched = formik.touched.ekspedisi?.[idx]?.[field]; - const isError = - touched && - typeof errorObj === 'object' && - !!(errorObj as Record)?.[field]; - const errorMessage = - typeof errorObj === 'object' - ? (errorObj as Record)?.[field] - : undefined; - return { isError, errorMessage }; -} - const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { const [, setMovementFormErrorMessage] = useState(''); const [selectedProducts, setSelectedProducts] = useState([]); @@ -212,16 +194,22 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { !formik.touched[arrayName] || !Array.isArray(formik.touched[arrayName]) ) { - return false; + return { + isError: false, + errorMessage: undefined, + }; } const touchedField = formik.touched[arrayName]?.[idx]?.[column as string]; const errorField = formik.errors[arrayName]?.[idx] as Record< string, - unknown + string >; - return touchedField && Boolean(errorField?.[column as string]); + return { + isError: touchedField && Boolean(errorField?.[column as string]), + errorMessage: touchedField ? errorField?.[column as string] : undefined, + }; }; interface WarehouseOptionType extends OptionType { @@ -571,11 +559,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { isLoading={isLoadingProducts} isDisabled={type === 'detail'} isClearable - isError={isRepeaterInputError( - 'product', - 'product', - idx - )} + {...isRepeaterInputError('product', 'product', idx)} /> @@ -586,7 +570,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={product.qty_product ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - isError={isRepeaterInputError( + {...isRepeaterInputError( 'product', 'qty_product', idx @@ -734,13 +718,13 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { formik.setFieldValue(`ekspedisi.${idx}.qty`, ''); }} options={getFilteredProductOptions()} - isDisabled={type === 'detail'} - isClearable - isError={isRepeaterInputError( + {...isRepeaterInputError( 'ekspedisi', 'product', idx )} + isDisabled={type === 'detail'} + isClearable /> @@ -751,7 +735,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={ekspedisi.qty ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError(formik, idx, 'qty')} + {...isRepeaterInputError('ekspedisi', 'qty', idx)} readOnly={type === 'detail'} className={{ wrapper: 'w-full min-w-24', @@ -777,7 +761,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { isLoading={isLoadingSuppliers} isDisabled={type === 'detail'} isClearable - isError={isRepeaterInputError( + {...isRepeaterInputError( 'ekspedisi', 'supplier', idx @@ -791,10 +775,10 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={ekspedisi.plat_nomor ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError( - formik, - idx, - 'plat_nomor' + {...isRepeaterInputError( + 'ekspedisi', + 'plat_nomor', + idx )} readOnly={type === 'detail'} className={{ @@ -809,10 +793,10 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={ekspedisi.no_surat_jalan ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError( - formik, - idx, - 'no_surat_jalan' + {...isRepeaterInputError( + 'ekspedisi', + 'no_surat_jalan', + idx )} readOnly={type === 'detail'} className={{ @@ -848,7 +832,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { ); } }} - isError={isRepeaterInputError( + {...isRepeaterInputError( 'ekspedisi', 'dokumen', idx @@ -867,10 +851,10 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={ekspedisi.biaya_ekspedisi ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError( - formik, - idx, - 'biaya_ekspedisi' + {...isRepeaterInputError( + 'ekspedisi', + 'biaya_ekspedisi', + idx )} readOnly={type === 'detail'} className={{ @@ -883,10 +867,10 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { disabled onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError( - formik, - idx, - 'biaya_ekspedisi_per_item' + {...isRepeaterInputError( + 'ekspedisi', + 'biaya_ekspedisi_per_item', + idx )} name={`ekspedisi.${idx}.biaya_ekspedisi_per_item`} value={ @@ -910,10 +894,10 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => { value={ekspedisi.nama_sopir ?? ''} onChange={formik.handleChange} onBlur={formik.handleBlur} - {...getEkspedisiFieldError( - formik, - idx, - 'nama_sopir' + {...isRepeaterInputError( + 'ekspedisi', + 'nama_sopir', + idx )} readOnly={type === 'detail'} className={{