From 8bfce061e6f2cc37cfc4fa039d3776a3024510e4 Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Wed, 15 Oct 2025 17:53:08 +0700
Subject: [PATCH] refactor(FE-114,136): improve location and coop field
 handling in RecordingForm

---
 .../flock/recording/form/RecordingForm.tsx    | 36 +++++++++++++++----
 1 file changed, 29 insertions(+), 7 deletions(-)

diff --git a/src/components/pages/flock/recording/form/RecordingForm.tsx b/src/components/pages/flock/recording/form/RecordingForm.tsx
index afc9cd84..d8656b2b 100644
--- a/src/components/pages/flock/recording/form/RecordingForm.tsx
+++ b/src/components/pages/flock/recording/form/RecordingForm.tsx
@@ -150,21 +150,42 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
 
   // Handlers
   const locationChangeHandler = (val: OptionType | OptionType[] | null) => {
-    formik.setFieldTouched('location', true);
+    const locationValue = (val as OptionType)?.value;
+
     formik.setFieldValue('location', val);
-    formik.setFieldTouched('location_id', true);
-    formik.setFieldValue('location_id', (val as OptionType)?.value);
-    // Reset coop selection when location changes
+    formik.setFieldValue('location_id', locationValue || 0);
+
+    // Only set touched if there's a value
+    if (locationValue) {
+      formik.setFieldTouched('location', true);
+      formik.setFieldTouched('location_id', true);
+    } else {
+      formik.setFieldTouched('location', false);
+      formik.setFieldTouched('location_id', false);
+    }
+
+    // Reset coop selection when location changes or is cleared
     formik.setFieldValue('coop', null);
     formik.setFieldValue('coop_id', 0);
+    formik.setFieldTouched('coop', false);
+    formik.setFieldTouched('coop_id', false);
     setCoopSelectInputValue('');
   };
 
   const coopChangeHandler = (val: OptionType | OptionType[] | null) => {
-    formik.setFieldTouched('coop', true);
+    const coopValue = (val as OptionType)?.value;
+
     formik.setFieldValue('coop', val);
-    formik.setFieldTouched('coop_id', true);
-    formik.setFieldValue('coop_id', (val as OptionType)?.value);
+    formik.setFieldValue('coop_id', coopValue || 0);
+
+    // Only set touched if there's a value
+    if (coopValue) {
+      formik.setFieldTouched('coop', true);
+      formik.setFieldTouched('coop_id', true);
+    } else {
+      formik.setFieldTouched('coop', false);
+      formik.setFieldTouched('coop_id', false);
+    }
   };
 
   const isRepeaterInputError = <T extends keyof CreateRecordingPayload>(
@@ -423,6 +444,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                 />
 
                 <SelectInput
+                  key={`coop-select-${formik.values.location_id || 'no-location'}`}
                   required
                   label='Kandang'
                   value={formik.values.coop ?? undefined}