diff --git a/src/components/pages/dashboard/DashboardProduction.tsx b/src/components/pages/dashboard/DashboardProduction.tsx index 674f3719..27db0039 100644 --- a/src/components/pages/dashboard/DashboardProduction.tsx +++ b/src/components/pages/dashboard/DashboardProduction.tsx @@ -150,33 +150,39 @@ const DashboardProduction = () => { }, }); + const { resetForm } = formik; + const handleResetFilter = useCallback(() => { - formik.resetForm(); + resetForm(); resetFilterValues(); // Clear stored filter values setAnalysisMode('OVERVIEW'); setEndpointUrl('/dashboards'); setSelectedLocationIds([]); - }, [resetFilterValues, filterValues, selectedLocationIds]); + }, [resetForm, resetFilterValues]); - const handleApplyFilter = (values: DashboardFilter) => { - // Build query params object, only include non-empty values - const params: Record = {}; + const handleApplyFilter = useCallback( + (values: DashboardFilter) => { + // Build query params object, only include non-empty values + const params: Record = {}; - if (values.start_date) params.start_date = values.start_date; - if (values.end_date) params.end_date = values.end_date; - if (values.analysis_mode) params.analysis_mode = values.analysis_mode; - if (values.location_ids.length > 0) - params.location_ids = values.location_ids.toString(); - if (values.flock_ids.length > 0) - params.flock_ids = values.flock_ids.toString(); - if (values.kandang_ids.length > 0) - params.kandang_ids = values.kandang_ids.toString(); - if (values.comparison_type) params.comparison_type = values.comparison_type; + if (values.start_date) params.start_date = values.start_date; + if (values.end_date) params.end_date = values.end_date; + if (values.analysis_mode) params.analysis_mode = values.analysis_mode; + if (values.location_ids.length > 0) + params.location_ids = values.location_ids.toString(); + if (values.flock_ids.length > 0) + params.flock_ids = values.flock_ids.toString(); + if (values.kandang_ids.length > 0) + params.kandang_ids = values.kandang_ids.toString(); + if (values.comparison_type) + params.comparison_type = values.comparison_type; - setEndpointUrl(`/dashboards?${new URLSearchParams(params).toString()}`); - filterModal.closeModal(); - refreshDashboardProductionData(); - }; + setEndpointUrl(`/dashboards?${new URLSearchParams(params).toString()}`); + filterModal.closeModal(); + refreshDashboardProductionData(); + }, + [filterModal, refreshDashboardProductionData] + ); // ===== Load filter from store on mount ===== useEffect(() => { @@ -190,20 +196,20 @@ const DashboardProduction = () => { kandang_ids: normalizeToArray(filterValues.kandang), comparison_type: filterValues.comparisonType, }); - }, [filterValues]); + }, [filterValues, handleApplyFilter]); // ===== Formik Error List ===== const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); // ===== Export PDF ===== - const handleExportPDF = async () => { + const handleExportPDF = useCallback(async () => { await generateDashboardPDF({ filterValues: formik.values, allStatsRef, allChartsRef, setExporting, }); - }; + }, [formik.values]); // ===== Register Navbar Actions ===== const openFilterModalRef = useRef(filterModal.openModal); @@ -253,7 +259,7 @@ const DashboardProduction = () => { ); - }, [formik.values, exporting, setNavbarActions]); + }, [formik.values, exporting, setNavbarActions, handleExportPDF]); // Cleanup only on unmount useEffect(() => {