From 97acc17ca55e6d60e3c1ee11097eb0bee829647d Mon Sep 17 00:00:00 2001
From: ValdiANS <rvdans002@gmail.com>
Date: Wed, 3 Jun 2026 14:05:06 +0700
Subject: [PATCH] feat: add inline edit for chick-in date in chickin logs

- Add updateChickinDate method to ChickinService (PATCH /production/chickins/chick-in-date)
- Add pencil icon button next to each chickin date in ChickLogsView
- Clicking the icon toggles an inline DateInput with Simpan/Batal buttons
- Save button is disabled and shows loading state while request is in flight

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../chickin/form/tabs/ChickLogsView.tsx       | 74 ++++++++++++++++++-
 src/services/api/production/chickin.ts        | 24 ++++++
 2 files changed, 94 insertions(+), 4 deletions(-)

diff --git a/src/components/pages/production/chickin/form/tabs/ChickLogsView.tsx b/src/components/pages/production/chickin/form/tabs/ChickLogsView.tsx
index acb8c18b..6fbde87a 100644
--- a/src/components/pages/production/chickin/form/tabs/ChickLogsView.tsx
+++ b/src/components/pages/production/chickin/form/tabs/ChickLogsView.tsx
@@ -2,16 +2,17 @@ import Alert from '@/components/Alert';
 import Button from '@/components/Button';
 import Card from '@/components/Card';
 import RequirePermission from '@/components/helper/RequirePermission';
+import DateInput from '@/components/input/DateInput';
 import PillBadge from '@/components/PillBadge';
 import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
 import { formatDate, formatNumber } from '@/lib/helper';
 import { ChickinApi } from '@/services/api/production/chickin';
+import { useChickinStore } from '@/stores/production/chickin/chickin.store';
 import { BaseApproval } from '@/types/api/api-general';
 import { ProjectFlockKandang } from '@/types/api/production/project-flock-kandang';
 import { Icon } from '@iconify/react';
 import { useState } from 'react';
 import toast from 'react-hot-toast';
-import { useChickinStore } from '@/stores/production/chickin/chickin.store';
 
 const ChickinLogsView = ({
   initialValues,
@@ -23,6 +24,9 @@ const ChickinLogsView = ({
   rawDataApprovals: BaseApproval[];
 }) => {
   const [chickinErrorMessage, setChickinErrorMessage] = useState('');
+  const [editingChickinId, setEditingChickinId] = useState<number | null>(null);
+  const [editDate, setEditDate] = useState('');
+  const [isEditLoading, setIsEditLoading] = useState(false);
   const { openChickinApproveModal, openChickinDeleteModal } = useChickinStore();
 
   const handleClickApprove = () => {
@@ -44,6 +48,23 @@ const ChickinLogsView = ({
     });
   };
 
+  const handleSaveChickinDate = async () => {
+    setIsEditLoading(true);
+    const res = await ChickinApi.updateChickinDate(
+      initialValues.id as number,
+      formatDate(editDate, 'YYYY-MM-DD')
+    );
+    setIsEditLoading(false);
+    if (isResponseSuccess(res)) {
+      toast.success(res?.message as string);
+      setEditingChickinId(null);
+      afterSubmit && afterSubmit();
+    }
+    if (isResponseError(res)) {
+      toast.error(res?.message as string);
+    }
+  };
+
   const handleDeleteChickin = (chickinId: number) => {
     openChickinDeleteModal(chickinId, async () => {
       const deleteRes = await ChickinApi.delete(chickinId);
@@ -133,9 +154,54 @@ const ChickinLogsView = ({
                       <Icon icon={'mdi:calendar'} width={14} height={14} />{' '}
                       <span>Tanggal Chick In</span>
                     </div>
-                    <div className='text-end text-gray-500'>
-                      {formatDate(chickin.chick_in_date, 'DD MMM YYYY')}
-                    </div>
+                    {editingChickinId === chickin.id ? (
+                      <div className='flex flex-col gap-2 items-end w-1/2'>
+                        <DateInput
+                          name='edit_chick_in_date'
+                          value={editDate}
+                          isNestedModal
+                          onChange={(e) => setEditDate(e.target.value)}
+                        />
+                        <div className='flex flex-row gap-1'>
+                          <Button
+                            color='none'
+                            className='btn-xs btn-ghost text-gray-500'
+                            onClick={() => setEditingChickinId(null)}
+                            disabled={isEditLoading}
+                          >
+                            Batal
+                          </Button>
+                          <Button
+                            color='success'
+                            className='btn-xs text-base-100'
+                            onClick={handleSaveChickinDate}
+                            isLoading={isEditLoading}
+                            disabled={!editDate || isEditLoading}
+                          >
+                            Simpan
+                          </Button>
+                        </div>
+                      </div>
+                    ) : (
+                      <div className='flex flex-row gap-2 items-center'>
+                        <span className='text-gray-500'>
+                          {formatDate(chickin.chick_in_date, 'DD MMM YYYY')}
+                        </span>
+                        <button
+                          className='btn btn-ghost btn-xs p-0 text-gray-400 hover:text-primary'
+                          onClick={() => {
+                            setEditingChickinId(chickin.id);
+                            setEditDate(chickin.chick_in_date);
+                          }}
+                        >
+                          <Icon
+                            icon='mdi:pencil-outline'
+                            width={13}
+                            height={13}
+                          />
+                        </button>
+                      </div>
+                    )}
                   </div>
 
                   {/* Kandang */}
diff --git a/src/services/api/production/chickin.ts b/src/services/api/production/chickin.ts
index 0efaa0f9..d250e450 100644
--- a/src/services/api/production/chickin.ts
+++ b/src/services/api/production/chickin.ts
@@ -6,6 +6,7 @@ import {
 import { BaseApiService } from '@/services/api/base';
 import { BaseApiResponse } from '@/types/api/api-general';
 import { httpClient } from '@/services/http/client';
+import axios from 'axios';
 
 export class ChickinService extends BaseApiService<
   Chickin,
@@ -16,6 +17,29 @@ export class ChickinService extends BaseApiService<
     super(basePath);
   }
 
+  async updateChickinDate(
+    projectFlockKandangId: number,
+    chickInDate: string
+  ): Promise<BaseApiResponse<{ message: string }> | undefined> {
+    try {
+      return await httpClient<BaseApiResponse<{ message: string }>>(
+        `${this.basePath}/chick-in-date`,
+        {
+          method: 'PATCH',
+          body: {
+            project_flock_kandang_id: projectFlockKandangId,
+            chick_in_date: chickInDate,
+          },
+        }
+      );
+    } catch (error: unknown) {
+      if (axios.isAxiosError<BaseApiResponse<{ message: string }>>(error)) {
+        return error.response?.data;
+      }
+      return undefined;
+    }
+  }
+
   /**
    * Approve single marketing data
    */