From 92217a57768924371ec613af155f51a256d81018 Mon Sep 17 00:00:00 2001 From: Martin Date: Thu, 19 Mar 2026 23:11:17 +0100 Subject: [PATCH] Update spec: shared period state between dashboard columns Co-Authored-By: Claude Sonnet 4.6 --- .../specs/2026-03-19-finance-tracker-design.md | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/docs/superpowers/specs/2026-03-19-finance-tracker-design.md b/docs/superpowers/specs/2026-03-19-finance-tracker-design.md index 26af961..1dc1c11 100644 --- a/docs/superpowers/specs/2026-03-19-finance-tracker-design.md +++ b/docs/superpowers/specs/2026-03-19-finance-tracker-design.md @@ -226,7 +226,9 @@ JWT and `expiresAt` stored in `localStorage`. Vue Router navigation guard checks All widgets show a skeleton loader while fetching and a subtle error indicator on failure. -The year selection (left toolbar) and month selection (right toolbar) are independent — changing one does not affect the other. +**Shared period state** — both columns share a single `{ year, month }` value. The toolbars are two views of the same state: +- Next/prev **month** (right toolbar): increments/decrements the month, wrapping the year (e.g. Dec 2024 → Jan 2025 updates both columns to year=2025, month=1) +- Next/prev **year** (left toolbar): increments/decrements the year, keeping the current month (e.g. year 2025, month=1 → next year → year=2026, month=1, right column updates to Jan 2026) ### Transactions Page @@ -239,9 +241,8 @@ Vuetify data table: ### State Management (Pinia) - `auth` — token, expiresAt, login/logout actions, 401 handler -- `dashYear` — selected year for the year summary column -- `dashMonth` / `dashMonthYear` — selected month+year for the month summary column -- `txPeriod` — selected year/month for the transactions page +- `dashPeriod` — `{ year, month }` shared by both dashboard columns; next/prev month wraps year, next/prev year keeps month +- `txPeriod` — selected year/month for the transactions page (independent) --- @@ -283,7 +284,7 @@ account-tracking/ - **Deduplication via `transaction_id`** — format `transhist-v-YYYY-MM_`; VARCHAR(512) utf8mb4_bin (case-sensitive) for correctness and future-proofing. - **CSV header detection** — scan for line starting with `číslo účtu`; do not hardcode line number. - **Spending totals exclude positive amounts per category** — refunds within a spending category are excluded from totals. -- **Dashboard is two independent columns** — year summary (left) and month summary (right) each have their own period toolbar; they do not share state. +- **Dashboard columns share one period** — a single `{ year, month }` drives both columns; month toolbar wraps the year on overflow, year toolbar keeps the month. - **Upload CSV in app bar** — file picker dialog in-place, no separate import page; result shown as snackbar. - **Month summary line chart is cumulative spending** — running total of expenses day by day through the selected month; gaps filled so line is continuous. - **Monthly balances bar chart** — closing balance per month for the year (sparse, months with no data omitted).