From 5dac900a1ae3890ccbaadbd285f8315d3af1199d Mon Sep 17 00:00:00 2001
From: rstubryan <restubumirr@gmail.com>
Date: Thu, 5 Mar 2026 14:11:58 +0700
Subject: [PATCH] refactor(FE): Refactor date filter state management in
 UniformityTable

---
 .../production/uniformity/UniformityTable.tsx | 26 ++++++++++++++++---
 .../uniformity/detail/UniformityDetail.tsx    | 14 +++++++---
 2 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/src/components/pages/production/uniformity/UniformityTable.tsx b/src/components/pages/production/uniformity/UniformityTable.tsx
index 55d74955..9f148bfb 100644
--- a/src/components/pages/production/uniformity/UniformityTable.tsx
+++ b/src/components/pages/production/uniformity/UniformityTable.tsx
@@ -249,6 +249,10 @@ const UniformityTable = () => {
   const [isSubmitted, setIsSubmitted] = useState(false);
 
   // ===== FILTER STATE =====
+  const [filterDateValues, setFilterDateValues] = useState({
+    start_date: tableFilterState.start_date,
+    end_date: tableFilterState.end_date,
+  });
   const [filterLocation, setFilterLocation] = useState<OptionType | null>(null);
   const [filterProjectFlock, setFilterProjectFlock] =
     useState<OptionType | null>(null);
@@ -343,8 +347,8 @@ const UniformityTable = () => {
   // ===== FORMIK FILTER =====
   const filterFormik = useFormik<UniformityTableFilterValues>({
     initialValues: {
-      start_date: tableFilterState.start_date,
-      end_date: tableFilterState.end_date,
+      start_date: filterDateValues.start_date,
+      end_date: filterDateValues.end_date,
       location: filterLocation,
       project_flock: filterProjectFlock,
       project_flock_kandang_id: filterProjectFlockKandangId,
@@ -381,6 +385,13 @@ const UniformityTable = () => {
   const { formErrorList, close, handleFormSubmit } =
     useFormikErrorList(filterFormik);
 
+  useEffect(() => {
+    setFilterDateValues({
+      start_date: tableFilterState.start_date,
+      end_date: tableFilterState.end_date,
+    });
+  }, [tableFilterState.start_date, tableFilterState.end_date]);
+
   // ===== BUILD SWR KEY WITH FILTERS =====
   const uniformitySwrKey = useMemo(() => {
     const basePath = UniformityApi.basePath;
@@ -494,6 +505,7 @@ const UniformityTable = () => {
     setFilterKandang(null);
     setFilterProjectFlockKandangId(undefined);
     setFilterErrors({});
+    setFilterDateValues({ start_date: '', end_date: '' });
 
     updateFilter('start_date', '');
     updateFilter('end_date', '');
@@ -1293,7 +1305,7 @@ const UniformityTable = () => {
             <div className='flex flex-col p-4 gap-1.5'>
               {/* Rentang Waktu */}
               <div>
-                <label className='flex text-xs items-center gap-2 py-2 font-semibold'>
+                <label className='flex text-xs items-center gap-1 py-2 font-semibold after:content-["*"] after:text-red-500'>
                   Tanggal
                 </label>
                 <div className='flex items-center gap-2'>
@@ -1305,6 +1317,10 @@ const UniformityTable = () => {
                     onChange={(e) => {
                       const value = e.target.value;
                       filterFormik.setFieldValue('start_date', value);
+                      setFilterDateValues((prev) => ({
+                        ...prev,
+                        start_date: value,
+                      }));
 
                       if (value && filterFormik.values.end_date) {
                         const startDate = new Date(value);
@@ -1348,6 +1364,10 @@ const UniformityTable = () => {
                     onChange={(e) => {
                       const value = e.target.value;
                       filterFormik.setFieldValue('end_date', value);
+                      setFilterDateValues((prev) => ({
+                        ...prev,
+                        end_date: value,
+                      }));
 
                       if (value && filterFormik.values.start_date) {
                         const startDateObj = new Date(
diff --git a/src/components/pages/production/uniformity/detail/UniformityDetail.tsx b/src/components/pages/production/uniformity/detail/UniformityDetail.tsx
index 7772e91b..adda86a1 100644
--- a/src/components/pages/production/uniformity/detail/UniformityDetail.tsx
+++ b/src/components/pages/production/uniformity/detail/UniformityDetail.tsx
@@ -99,14 +99,22 @@ const UniformityDetail: React.FC<UniformityDetailProps> = ({
         setExpandedDrawerOpen(true);
       }, 0);
     }
-  }, [shouldFetchDetails, uniformity_details, hasFetchedDetails]);
+  }, [
+    shouldFetchDetails,
+    uniformity_details,
+    hasFetchedDetails,
+    setExpandedDrawerContent,
+    setExpandedDrawerOpen,
+    initialValues.info_umum,
+    initialValues.id,
+  ]);
 
   useEffect(() => {
     return () => {
       setExpandedDrawerOpen(false);
       setExpandedDrawerContent(null);
     };
-  }, []);
+  }, [setExpandedDrawerOpen, setExpandedDrawerContent]);
 
   const infoUmumTableData: DetailOptionType[] = useMemo(() => {
     if (!initialValues) return [];
@@ -223,7 +231,7 @@ const UniformityDetail: React.FC<UniformityDetailProps> = ({
         },
       },
     ],
-    [initialValues]
+    [initialValues, handleViewUniformityDetails, isLoading]
   );
 
   const samplingTableData: DetailOptionType[] = useMemo(() => {