Description: The BudgetsDisplay component currently uses the useExpenses hook to fetch all expenses and then filters them for the current month/year client-side. It also separately calls getBudgetStatus. This can be inefficient if the user has many expenses and creates dependencies (BudgetsDisplay relies on data structure from useExpenses).
Proposed Solution:
Modify the useExpenses hook (or create a new one, e.g., useFilteredExpenses) to accept year and month as arguments. This hook should then call the backend endpoint GET /api/expenses with these parameters (the backend endpoint already supports this). The hook would return only the relevant expenses for the period.
The BudgetsDisplay component would then use this modified/new hook to get only the necessary expenses.
Consider if getBudgetStatus on the backend could be more efficient if expenses were fetched only once (potential future backend optimization).
Remove the manual filtering of expenses in the currentMonthExpenses useMemo within BudgetsDisplay.
Related Files: frontend/src/hooks/useExpenses.js (or new hook), frontend/src/components/Budgeting/BudgetsDisplay.jsx, backend/app/services/expense_service.py (verify get_all_expenses), backend/app/routes/expense_routes.py (verify get_expenses_route).
Difficulty: Medium (Requires modifying React hooks, API calls, and potentially backend logic)
Description: The BudgetsDisplay component currently uses the useExpenses hook to fetch all expenses and then filters them for the current month/year client-side. It also separately calls getBudgetStatus. This can be inefficient if the user has many expenses and creates dependencies (BudgetsDisplay relies on data structure from useExpenses).
Proposed Solution:
Modify the useExpenses hook (or create a new one, e.g., useFilteredExpenses) to accept year and month as arguments. This hook should then call the backend endpoint GET /api/expenses with these parameters (the backend endpoint already supports this). The hook would return only the relevant expenses for the period.
The BudgetsDisplay component would then use this modified/new hook to get only the necessary expenses.
Consider if getBudgetStatus on the backend could be more efficient if expenses were fetched only once (potential future backend optimization).
Remove the manual filtering of expenses in the currentMonthExpenses useMemo within BudgetsDisplay.
Related Files: frontend/src/hooks/useExpenses.js (or new hook), frontend/src/components/Budgeting/BudgetsDisplay.jsx, backend/app/services/expense_service.py (verify get_all_expenses), backend/app/routes/expense_routes.py (verify get_expenses_route).
Difficulty: Medium (Requires modifying React hooks, API calls, and potentially backend logic)