diff --git a/src/components/Expenses/ExpenseFilterChips.jsx b/src/components/Expenses/ExpenseFilterChips.jsx index c44dd7a5..f8058cc7 100644 --- a/src/components/Expenses/ExpenseFilterChips.jsx +++ b/src/components/Expenses/ExpenseFilterChips.jsx @@ -1,89 +1,90 @@ import React, { useMemo } from "react"; const ExpenseFilterChips = ({ filters, filterData, removeFilterChip }) => { - // Build chips from filters - const filterChips = useMemo(() => { - const chips = []; - - const buildGroup = (ids, list, label, key) => { - if (!ids?.length) return; - const items = ids.map((id) => ({ - id, - name: list.find((item) => item.id === id)?.name || id, - })); - chips.push({ key, label, items }); - }; - - buildGroup(filters.projectIds, filterData.projects, "Project", "projectIds"); - buildGroup(filters.createdByIds, filterData.createdBy, "Submitted By", "createdByIds"); - buildGroup(filters.paidById, filterData.paidBy, "Paid By", "paidById"); - buildGroup(filters.statusIds, filterData.status, "Status", "statusIds"); - buildGroup(filters.ExpenseTypeIds, filterData.expensesType, "Category", "ExpenseTypeIds"); - - if (filters.startDate || filters.endDate) { - const start = filters.startDate - ? new Date(filters.startDate).toLocaleDateString() - : ""; - const end = filters.endDate - ? new Date(filters.endDate).toLocaleDateString() - : ""; - chips.push({ - key: "dateRange", - label: "Date Range", - items: [{ id: "dateRange", name: `${start} - ${end}` }], - }); - } - - return chips; - }, [filters, filterData]); - - if (!filterChips.length) return null; - - return ( -
-
-
- {filterChips.map((chip) => ( -
- {/* Chip Label */} - {chip.label}: - - {/* Chip Items */} -
- {chip.items.map((item) => ( - - {item.name} -
-
- ))} -
-
-
- - + const filterChips = useMemo(() => { + if (!filterData?.projects?.length) return []; + const chips = []; + const projectExists = filters.projectIds?.every((pid) => + filterData.projects.some((p) => p.id === pid) ); + + if (!projectExists) return []; + + const buildGroup = (ids, list, label, key) => { + if (!ids?.length) return; + const items = ids.map((id) => ({ + id, + name: list.find((item) => item.id === id)?.name || id, + })); + chips.push({ key, label, items }); + }; + + buildGroup(filters.projectIds, filterData.projects, "Project", "projectIds"); + buildGroup(filters.createdByIds, filterData.createdBy, "Submitted By", "createdByIds"); + buildGroup(filters.paidById, filterData.paidBy, "Paid By", "paidById"); + buildGroup(filters.statusIds, filterData.status, "Status", "statusIds"); + buildGroup(filters.ExpenseTypeIds, filterData.expensesType, "Category", "ExpenseTypeIds"); + + if (filters.startDate || filters.endDate) { + const start = filters.startDate + ? new Date(filters.startDate).toLocaleDateString() + : ""; + const end = filters.endDate + ? new Date(filters.endDate).toLocaleDateString() + : ""; + chips.push({ + key: "dateRange", + label: "Date Range", + items: [{ id: "dateRange", name: `${start} - ${end}` }], + }); + } + + return chips; + }, [filters, filterData]); + + if (!filterChips.length) return null; + + return ( +
+
+
+ {filterChips.map((chip) => ( +
+ {chip.label}: +
+ {chip.items.map((item) => ( + + {item.name} +
+
+ ))} +
+
+
+ ); }; + export default ExpenseFilterChips; diff --git a/src/components/Expenses/ExpenseFilterPanel.jsx b/src/components/Expenses/ExpenseFilterPanel.jsx index 8b1f8bb6..82bff421 100644 --- a/src/components/Expenses/ExpenseFilterPanel.jsx +++ b/src/components/Expenses/ExpenseFilterPanel.jsx @@ -119,34 +119,45 @@ const ExpenseFilterPanel = forwardRef(({ onApply, handleGroupBy, setFilterdata } const [appliedStatusId, setAppliedStatusId] = useState(null); useEffect(() => { - if (!status || !data) return; + if (!status || !data) return; + + const projectExists = selectedProjectId + ? data?.projects?.some((p) => p.id === selectedProjectId) + : false; + + if (!projectExists) { + console.warn("Project not found, skipping ExpenseStatus filter."); + return; // stop processing + } + + if (status !== appliedStatusId) { + const filterWithStatus = { + ...dynamicDefaultFilter, + projectIds: [selectedProjectId], + startDate: dynamicDefaultFilter.startDate + ? moment.utc(dynamicDefaultFilter.startDate, "DD-MM-YYYY").toISOString() + : undefined, + endDate: dynamicDefaultFilter.endDate + ? moment.utc(dynamicDefaultFilter.endDate, "DD-MM-YYYY").toISOString() + : undefined, + }; + + onApply(filterWithStatus); + handleGroupBy(selectedGroup.id); + setAppliedStatusId(status); + } +}, [ + status, + data, + dynamicDefaultFilter, + onApply, + handleGroupBy, + selectedGroup.id, + appliedStatusId, + selectedProjectId, +]); - if (status !== appliedStatusId) { - const filterWithStatus = { - ...dynamicDefaultFilter, - projectIds: selectedProjectId ? [selectedProjectId] : dynamicDefaultFilter.projectIds || [], - startDate: dynamicDefaultFilter.startDate - ? moment.utc(dynamicDefaultFilter.startDate, "DD-MM-YYYY").toISOString() - : undefined, - endDate: dynamicDefaultFilter.endDate - ? moment.utc(dynamicDefaultFilter.endDate, "DD-MM-YYYY").toISOString() - : undefined, - }; - onApply(filterWithStatus); - handleGroupBy(selectedGroup.id); - setAppliedStatusId(status); - } - }, [ - status, - data, - dynamicDefaultFilter, - onApply, - handleGroupBy, - selectedGroup.id, - appliedStatusId, - selectedProjectId, - ]); if (isLoading || isFetching) return ; if (isError && isFetched) diff --git a/src/router/AppRoutes.jsx b/src/router/AppRoutes.jsx index adc58771..14095170 100644 --- a/src/router/AppRoutes.jsx +++ b/src/router/AppRoutes.jsx @@ -98,9 +98,9 @@ const router = createBrowserRouter( { path: "/activities/task", element: }, { path: "/activities/reports", element: }, { path: "/gallary", element: }, + { path: "/expenses", element: }, { path: "/expenses/:status?/:project?", element: }, { path: "/collection", element: }, - { path: "/expenses", element: }, { path: "/payment-request", element: }, { path: "/advance-payment", element: }, { path: "/recurring-payment", element: },