Filter Transactions by the Selected Month

Open client/src/hooks/useMonthTransactions.js.

The complete transaction list stays in context. This hook creates the smaller list the Ledger needs for the selected month.

The starter converts each YYYY-MM-DD string into a JavaScript Date. Replace that conversion with direct parts from the date string:

return transactions
  .filter((transaction) => {
    const [year, month] = transaction.date.split("-").map(Number);
    return year === cursor.year && month - 1 === cursor.month;
  })
  .sort((a, b) => (a.date < b.date ? 1 : -1));

Why month - 1 is necessary

Our stored date uses normal calendar numbers:

September = 09

JavaScript’s Date object uses zero-based month indexes when you read them with getMonth():

January   = 0
September = 8
December  = 11

The stored value 09 therefore needs to become 8 before it can be compared with cursor.month.

Why we can compare the parts directly

The transaction date is already stored in the predictable YYYY-MM-DD format. Splitting the string gives us the calendar year and month without asking JavaScript to interpret a date and without introducing time-zone behavior into a simple month filter.

The final .sort() keeps the newest date first. A later transaction date sorts before an earlier one because YYYY-MM-DD strings sort chronologically in their stored format.

Test it

With the sample data visible, move the Ledger from September 2026 to August 2026. September rows should disappear because none belong to August.

Move back to September. The sample rows should return in descending date order.

Checkpoint

The Ledger keeps the complete transaction collection in shared state but displays only the records whose dates belong to the selected month.