feat: add more filters

src/components/pages/report/expense/tab/ReportDepreciationFilterModal.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { RefObject, useMemo, useState } from 'react';
+import { RefObject, useEffect, useMemo, useState } from 'react';
 import { useFormik } from 'formik';
 import * as yup from 'yup';
 
@@ -60,6 +60,11 @@ const ReportDepreciationFilterModal = ({
     string | undefined
   >(initialValues?.location_id || undefined);
 
+  useEffect(() => {
+    setSelectedAreaId(initialValues?.area_id || undefined);
+    setSelectedLocationId(initialValues?.location_id || undefined);
+  }, [initialValues?.area_id, initialValues?.location_id]);
+
   const closeModalHandler = () => {
     ref.current?.close();
   };
@@ -97,6 +102,7 @@ const ReportDepreciationFilterModal = ({
 
   const formik = useFormik<ReportDepreciationFilterValues>({
     initialValues: initialValues || defaultInitialValues,
+    enableReinitialize: true,
     validationSchema: ReportDepreciationFilterSchema,
     onSubmit: async (values) => {
       onSubmit?.(values);

src/components/pages/report/expense/tab/ReportExpenseTab.tsx

@@ -126,8 +126,35 @@ const ReportExpenseTab = ({ tabId }: ReportExpenseTabProps) => {
   });
 
   handleFilterModalOpenRef.current = () => {
+    const restoredLocation = filterParams.location_id
+      ? locationOptions.find((opt) => String(opt.value) === filterParams.location_id) ||
+        { value: filterParams.location_id, label: filterParams.location_id }
+      : null;
+    const restoredSupplier = filterParams.supplier_id
+      ? supplierOptions.find((opt) => String(opt.value) === filterParams.supplier_id) ||
+        { value: filterParams.supplier_id, label: filterParams.supplier_id }
+      : null;
+    const restoredKandang = filterParams.kandang_id
+      ? projectFlockKandangOptions.find((opt) => String(opt.value) === filterParams.kandang_id) ||
+        { value: filterParams.kandang_id, label: filterParams.kandang_id }
+      : null;
+    const restoredNonstock = filterParams.nonstock_id
+      ? nonstockOptions.find((opt) => String(opt.value) === filterParams.nonstock_id) ||
+        { value: filterParams.nonstock_id, label: filterParams.nonstock_id }
+      : null;
+    const restoredCategory = filterParams.category
+      ? categoryOptions.find((opt) => opt.value === filterParams.category) || null
+      : null;
+
+    formik.setValues({
+      location_id: restoredLocation,
+      supplier_id: restoredSupplier,
+      kandang_id: restoredKandang,
+      nonstock_id: restoredNonstock,
+      realization_date: filterParams.realization_date || null,
+      category: restoredCategory,
+    });
     filterModal.openModal();
-    formik.validateForm();
   };
 
   // ===== OPTIONS =====