mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
refactor(FE): Refactor formik field updates to use destructured methods
This commit is contained in:
@@ -279,6 +279,8 @@ const UniformityForm = ({
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const { setFieldValue, setFieldTouched } = formik;
|
||||||
|
|
||||||
const handleValidateForm = async () => {
|
const handleValidateForm = async () => {
|
||||||
const errors = await formik.validateForm();
|
const errors = await formik.validateForm();
|
||||||
|
|
||||||
@@ -301,10 +303,10 @@ const UniformityForm = ({
|
|||||||
const location = val as OptionType | null;
|
const location = val as OptionType | null;
|
||||||
const locationId = Number(location?.value);
|
const locationId = Number(location?.value);
|
||||||
|
|
||||||
formik.setFieldTouched('location', true);
|
setFieldTouched('location', true);
|
||||||
formik.setFieldValue('location', location);
|
setFieldValue('location', location);
|
||||||
formik.setFieldTouched('location_id', true);
|
setFieldTouched('location_id', true);
|
||||||
formik.setFieldValue('location_id', locationId);
|
setFieldValue('location_id', locationId);
|
||||||
|
|
||||||
setSelectedLocation(location);
|
setSelectedLocation(location);
|
||||||
setSelectedProjectFlock(null);
|
setSelectedProjectFlock(null);
|
||||||
@@ -312,7 +314,7 @@ const UniformityForm = ({
|
|||||||
location ? location.value.toString() : ''
|
location ? location.value.toString() : ''
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
[]
|
[setFieldTouched, setFieldValue]
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleProjectFlockChange = useCallback(
|
const handleProjectFlockChange = useCallback(
|
||||||
@@ -320,14 +322,14 @@ const UniformityForm = ({
|
|||||||
const projectFlock = val as OptionType | null;
|
const projectFlock = val as OptionType | null;
|
||||||
const projectFlockId = Number(projectFlock?.value);
|
const projectFlockId = Number(projectFlock?.value);
|
||||||
|
|
||||||
formik.setFieldTouched('project_flock', true);
|
setFieldTouched('project_flock', true);
|
||||||
formik.setFieldValue('project_flock', projectFlock);
|
setFieldValue('project_flock', projectFlock);
|
||||||
formik.setFieldTouched('project_flock_id', true);
|
setFieldTouched('project_flock_id', true);
|
||||||
formik.setFieldValue('project_flock_id', projectFlockId);
|
setFieldValue('project_flock_id', projectFlockId);
|
||||||
|
|
||||||
setSelectedProjectFlock(projectFlock);
|
setSelectedProjectFlock(projectFlock);
|
||||||
},
|
},
|
||||||
[]
|
[setFieldTouched, setFieldValue]
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleKandangChange = useCallback(
|
const handleKandangChange = useCallback(
|
||||||
@@ -335,24 +337,24 @@ const UniformityForm = ({
|
|||||||
const kandang = val as OptionType | null;
|
const kandang = val as OptionType | null;
|
||||||
const kandangId = Number(kandang?.value);
|
const kandangId = Number(kandang?.value);
|
||||||
|
|
||||||
formik.setFieldTouched('kandang', true);
|
setFieldTouched('kandang', true);
|
||||||
formik.setFieldValue('kandang', kandang);
|
setFieldValue('kandang', kandang);
|
||||||
formik.setFieldTouched('kandang_id', true);
|
setFieldTouched('kandang_id', true);
|
||||||
formik.setFieldValue('kandang_id', kandangId);
|
setFieldValue('kandang_id', kandangId);
|
||||||
|
|
||||||
setSelectedKandang(kandang);
|
setSelectedKandang(kandang);
|
||||||
},
|
},
|
||||||
[]
|
[setFieldTouched, setFieldValue]
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleFileChange = useCallback(
|
const handleFileChange = useCallback(
|
||||||
(e: React.ChangeEvent<HTMLInputElement>) => {
|
(e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
const document = e.target.files?.[0];
|
const document = e.target.files?.[0];
|
||||||
|
|
||||||
formik.setFieldTouched('document', true);
|
setFieldTouched('document', true);
|
||||||
|
|
||||||
if (!document) {
|
if (!document) {
|
||||||
formik.setFieldValue('document', undefined);
|
setFieldValue('document', undefined);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -372,24 +374,24 @@ const UniformityForm = ({
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
formik.setFieldValue('document', document);
|
setFieldValue('document', document);
|
||||||
},
|
},
|
||||||
[]
|
[setFieldTouched, setFieldValue]
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleDateChange = useCallback(
|
const handleDateChange = useCallback(
|
||||||
(e: React.ChangeEvent<HTMLInputElement>) => {
|
(e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
formik.setFieldValue('date', e.target.value);
|
setFieldValue('date', e.target.value);
|
||||||
},
|
},
|
||||||
[]
|
[setFieldValue]
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleRemoveFile = useCallback(() => {
|
const handleRemoveFile = useCallback(() => {
|
||||||
formik.setFieldValue('document', undefined);
|
setFieldValue('document', undefined);
|
||||||
if (fileInputRef.current) {
|
if (fileInputRef.current) {
|
||||||
fileInputRef.current.value = '';
|
fileInputRef.current.value = '';
|
||||||
}
|
}
|
||||||
}, [formik]);
|
}, [setFieldValue]);
|
||||||
|
|
||||||
const handleDownloadTemplate = useCallback(() => {
|
const handleDownloadTemplate = useCallback(() => {
|
||||||
const population = projectFlockKandangLookup?.population;
|
const population = projectFlockKandangLookup?.population;
|
||||||
@@ -442,9 +444,9 @@ const UniformityForm = ({
|
|||||||
|
|
||||||
const weeksDiff = Math.floor(daysDiff / 7);
|
const weeksDiff = Math.floor(daysDiff / 7);
|
||||||
|
|
||||||
formik.setFieldValue('week', initialWeek + weeksDiff);
|
setFieldValue('week', initialWeek + weeksDiff);
|
||||||
} else {
|
} else {
|
||||||
formik.setFieldValue('week', initialWeek);
|
setFieldValue('week', initialWeek);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [
|
}, [
|
||||||
@@ -452,6 +454,7 @@ const UniformityForm = ({
|
|||||||
projectFlockKandangLookup?.project_flock_kandang_id,
|
projectFlockKandangLookup?.project_flock_kandang_id,
|
||||||
recordingsData,
|
recordingsData,
|
||||||
formik.values.date,
|
formik.values.date,
|
||||||
|
setFieldValue,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user