From dd080b1d19c355f7c3168eec00d92cf3fd2f07da Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Thu, 15 Jan 2026 14:08:09 +0700
Subject: [PATCH] refactor(FE): Add record_date and DateInput to recording form

---
 .../recording/form/RecordingForm.schema.ts    |  7 +++++
 .../recording/form/RecordingForm.tsx          | 29 +++++++++++++++----
 2 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/src/components/pages/production/recording/form/RecordingForm.schema.ts b/src/components/pages/production/recording/form/RecordingForm.schema.ts
index 4901b349..8ebd4aa2 100644
--- a/src/components/pages/production/recording/form/RecordingForm.schema.ts
+++ b/src/components/pages/production/recording/form/RecordingForm.schema.ts
@@ -7,6 +7,7 @@ import {
 } from '@/types/api/production/recording';
 
 type RecordingGrowingFormSchemaType = {
+  record_date: string;
   project_flock_kandang: {
     value: number;
     label: string;
@@ -85,6 +86,9 @@ const EggObjectSchema: Yup.ObjectSchema<EggSchema> = Yup.object({
 
 export const RecordingGrowingFormSchema: Yup.ObjectSchema<RecordingGrowingFormSchemaType> =
   Yup.object({
+    record_date: Yup.string()
+      .required('Tanggal recording wajib diisi!')
+      .typeError('Tanggal recording wajib diisi!'),
     project_flock_kandang: Yup.object({
       value: Yup.number().min(1).required(),
       label: Yup.string().required(),
@@ -179,6 +183,9 @@ type RecordingFormData = Partial<Recording> & {
 export const getRecordingGrowingFormInitialValues = (
   initialValues?: RecordingFormData
 ): RecordingGrowingFormValues => ({
+  record_date: initialValues?.record_datetime
+    ? new Date(initialValues.record_datetime).toISOString().split('T')[0]
+    : new Date().toISOString().split('T')[0],
   project_flock_kandang: initialValues?.project_flock_kandang_id
     ? {
         value: initialValues.project_flock_kandang_id,
diff --git a/src/components/pages/production/recording/form/RecordingForm.tsx b/src/components/pages/production/recording/form/RecordingForm.tsx
index db61080e..c418c5b2 100644
--- a/src/components/pages/production/recording/form/RecordingForm.tsx
+++ b/src/components/pages/production/recording/form/RecordingForm.tsx
@@ -12,6 +12,7 @@ import RequirePermission from '@/components/helper/RequirePermission';
 import Card from '@/components/Card';
 import Badge from '@/components/Badge';
 import NumberInput from '@/components/input/NumberInput';
+import DateInput from '@/components/input/DateInput';
 import SelectInput, {
   OptionType,
   useSelect,
@@ -135,10 +136,9 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
   // ===== PAYLOAD CREATION HELPERS =====
   const createGrowingPayload = useCallback(
     (values: RecordingGrowingFormValues) => {
-      const today = new Date().toISOString().split('T')[0];
       return {
         project_flock_kandang_id: values.project_flock_kandang_id,
-        record_date: today,
+        record_date: values.record_date,
         stocks: (values.stocks ?? []).map((stock) => ({
           product_warehouse_id: stock.product_warehouse_id,
           qty: Number(stock.qty) || 0,
@@ -154,10 +154,9 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
 
   const createLayingPayload = useCallback(
     (values: RecordingLayingFormValues) => {
-      const today = new Date().toISOString().split('T')[0];
       return {
         project_flock_kandang_id: values.project_flock_kandang_id,
-        record_date: today,
+        record_date: values.record_date,
         stocks: (values.stocks ?? []).map((stock) => ({
           product_warehouse_id: stock.product_warehouse_id,
           qty: Number(stock.qty) || 0,
@@ -971,6 +970,13 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     formik.setFieldTouched('project_flock_kandang_id', true);
   };
 
+  const handleRecordDateChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      formik.setFieldValue('record_date', e.target.value);
+    },
+    [formik]
+  );
+
   useEffect(() => {
     if (projectFlockKandangLookup?.project_flock_kandang_id) {
       const projectFlockKandangId =
@@ -1364,8 +1370,21 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                 body: 'flex flex-col gap-6',
               }}
             >
-              <div className={'grid grid-cols-3 gap-4'}>
+              <div className={'grid grid-cols-4 gap-4'}>
                 <>
+                  <DateInput
+                    required
+                    label='Tanggal Recording'
+                    name='record_date'
+                    value={formik.values.record_date}
+                    onChange={handleRecordDateChange}
+                    onBlur={formik.handleBlur}
+                    isError={
+                      formik.touched.record_date &&
+                      Boolean(formik.errors.record_date)
+                    }
+                    errorMessage={formik.errors.record_date as string}
+                  />
                   <SelectInput
                     key={`location-select-${selectedLocation?.value || 'default'}`}
                     required