diff --git a/src/pages/Expense/ExpensePage.jsx b/src/pages/Expense/ExpensePage.jsx index 05354733..0a9b1661 100644 --- a/src/pages/Expense/ExpensePage.jsx +++ b/src/pages/Expense/ExpensePage.jsx @@ -21,6 +21,7 @@ import { useFab } from "../../Context/FabContext"; import { useHasUserPermission } from "../../hooks/useHasUserPermission"; import { CREATE_EXEPENSE, + EXPENSE_STATUS, VIEW_ALL_EXPNESE, VIEW_SELF_EXPENSE, } from "../../utils/constants"; @@ -74,6 +75,30 @@ const ExpensePage = () => { const [filterData, setFilterdata] = useState(defaultFilter); const tableRef = useRef(null); const [filteredData, setFilteredData] = useState([]); + const [showStatus, setShowStatus] = useState(false); + + + useEffect(() => { + if (showStatus) { + // ON → show only draft + payment_processed + setFilters((prev) => ({ + ...prev, + statusIds: [ + EXPENSE_STATUS.daft, + EXPENSE_STATUS.payment_processed, + ], + })); + } else { + // OFF → show ALL (remove statusIds filter) + setFilters((prev) => { + const updated = { ...prev }; + delete updated.statusIds; + return updated; + }); + } + }, [showStatus]); + + const removeFilterChip = (key, id) => { setFilters((prev) => { const updated = { ...prev }; @@ -136,7 +161,9 @@ const ExpensePage = () => {
-
+
+ + {/* Search Input */} { value={searchText} onChange={(e) => setSearchText(e.target.value)} /> + + {/* Status Switch */} +
+ setShowStatus(e.target.checked)} + /> + +
+
+
{IsCreatedAble && (