3 Commits

Author	SHA1	Message	Date
Guillem Arias Fauste	9d3879a859	feat(plan): unify Budgets and Goals under a single Plan tab (#2687) ... * feat(plan): unify Budgets and Goals under a single Plan tab Preview users get one "Plan" nav entry (compass icon) in place of the separate Budgets and preview-gated Goals items. It fronts a new /plan hub with two summary cards — this month's budget (spent vs budgeted, days left, top categories) and active goals (total saved vs targets, behind/pending counts, per-goal rows) — each drilling into the existing /budgets and /goals pages, whose breadcrumbs now start Home > Plan. The two features share a home, not a model: no schema changes, no URL changes. Users without preview features keep exactly the pre-Plan nav (Budgets entry, Goals hidden), and /plan falls through to /budgets for them. Supporting changes: - Goal.active_prepared_for: index-style sorted active goals with the family-wide pooled-allocations + market-flows injection reused - Goal::FUNDABLE_ACCOUNT_TYPES and Goal::ACTIVE_DISPLAY_STATUS_RANK extracted from GoalsController - Budget#days_remaining (same day math as suggested_daily_spending) - Breadcrumbable#plan_breadcrumb_prefix for the conditional Plan crumb - New BudgetsController web tests (previously untested) + Plans tests * fix(plan): address review feedback on the Plan hub - Keep the "All goals" footer link rendered when the family has only completed/archived goals — the hub is a preview user's only route to the goals index now that the Goals nav entry is gone (Codex P2) - Replace the two hand-rolled footer button-links with DS::Link (variant secondary, full_width, right icon) per DS Drift Patrol - Fix DS::Link template comparing icon_position against the string "right" — the initializer symbolizes it, so right-positioned icons never rendered on links (DS::Button already compared symbols); existing callers passing icon_position now get the layout they asked for - Clamp progress-bar percentages to 0..100 instead of capping only the upper bound (CodeRabbit) * refactor(plan): single source of truth for goal loading, sorting, and counts Addresses jjmata's draft review notes: - GoalsController#index now builds on the shared Goal loaders instead of hand-rolling its own copy: Goal.prepared_for (preloads + family- wide backing-math injection, scope-able) and Goal.active_display_sort carry the algorithm once; active_prepared_for composes them for the hub. The controller-side constant alias is gone - One definition of "behind pace": Goal#behind_pace? (excludes paused — pausing stops the pace clock on purpose). Both the Plan hub summary and GoalsController#kpi_payload's behind/needs-this-month figures use it, so adjacent pages can't disagree. While there, the kpi on-track numerator also excludes paused goals — it was counted against a paused-excluding denominator, so the "X of Y" fraction could exceed its own total - BudgetCategory#suggested_daily_spending calls Budget#days_remaining instead of keeping an inline copy of the day math - Per the fat-model convention, the hub's aggregation moved off the controller: Budget#top_spending_categories(limit:) and Goal.summary_for(goals, currency:) * fix(plan): move Edit budget/New goal into their own cards Both actions lived in the hub's shared page header, unlinked to either card and, on mobile, wrapping above all content before any real data appeared. Each now lives in its own card's header instead: Edit budget as a compact icon-only control next to the status pill (only when a budget exists — the uninitialized state already has its own "Set up" CTA), New goal as a small outline button next to the goals count (only once there's a goal to sit beside; the empty state keeps its own CTA). Also swaps the edit icon from "pencil" to "square-pen" — at the sizes these header controls render, lucide's plain pencil is a thin diagonal stroke that reads noticeably smaller than a neighboring bold glyph like "plus", even in the same size box. square-pen carries more visual mass and reads clearly at the same footprint. * fix(plan): match established DS precedent for the card header actions Edit budget was a bare icon-only button; verified against the app's own precedent for this exact action (app/views/budgets/_budget_donut.html.erb, the budget card already shipped on /budgets) and it's a labeled secondary link with a trailing pencil, not icon-only and not a three-dot menu. Matched that: DS::Link, variant secondary, size sm, icon right. New goal gets the same treatment for consistency between the two cards' header actions, rather than the full-page-scoped "primary" weight goals/index.html.erb uses for its own create button — that's calibrated for a whole page's sole CTA, not a compact card. Adding a labeled button (wider than the bare icon this replaces) crowded the header row on mobile enough to wrap "This month" onto two lines and truncate the "· July 2026" meta away entirely. Header rows now wrap as a whole (flex-wrap) with the title pinned (shrink-0) so the action cluster drops to its own line instead of squeezing the title and meta text. Also drops the hub's footer note ("Budgets cap your spend; goals track what you're saving toward...") — redundant with the subtitle right above the cards. * fix(plan): lead the budget card header with status, not the edit action On Track/Over/Warning is what a glance at the card wants first; Edit budget is the secondary action. Swapped their order so status leads and the edit control trails, gap-2 unchanged. * fix(plan): put the status pill on the left, next to the title Meant the left side of the card, not just left of the edit button. On Track/Over/Warning now sits beside "This month · July 2026" in normal flow; ml-auto carries only the Edit budget link, alone on the right — matching the goals card's own left-meta/right-action split ("· 7 active" left, "New goal" right). * fix(plan): lead Edit budget with its icon, matching same-shape precedent Wrong axis on the earlier match: _budget_donut's trailing pencil labels the VALUE itself ("$12,850 ✎"), not a static action. Our button's label is a static "Edit budget", and that shape takes a leading icon everywhere else it appears — the categories "Edit" on budgets/show.html.erb (icon: settings-2) and "Edit split" in transactions/show.html.erb both lead with their icon. Drops icon_position: :right so it defaults to left, matching New goal's shape in the sibling card. * fix(plan): use the divider token for row separators, not border-primary Traced against the dashboard outflows list (pages/dashboard/_outflows_donut.html.erb), which renders its row separators via shared/_ruler → border-divider (border-tertiary: black/8%, white/10%). Our category and goal rows used border-b border-primary instead (black/15%, white/30%) — 2-3x heavier than the established row-separator weight elsewhere in the app. Swapped both to border-divider. * fix(plan): lift the duplicated card shell into DS::Card Codex P1: _budget_card.html.erb and _goals_card.html.erb hand-rolled the identical "bg-container rounded-xl shadow-border-xs p-5 flex flex-col" shell twice, with no DS:: card primitive to reach for instead. Extracted a minimal wrapper — content-only, no header/footer slots — matching what both cards actually need right now; the roadmap cards (envelopes #2153, retirement #2044) can adopt it too instead of copying the class string a third time. Verified pixel-identical in a browser: same classes, same DOM shape, just rendered through the component. * fix(plan): batch pace queries before sorting goals Codex P2: active_display_sort calls goal.status per goal to build the sort key; Goal#status reaches Goal#pace for any goal with a target_date, which fired its own Entry.sum(:amount) query per goal. The /plan hub renders only the first 5 of active_prepared_for's list, but paid the full O(N) query cost sorting all of them. Adds Goal.pace_for(family) (account_id => 90-day net inflow), grouped in one query and injected via inject_backing_math! alongside the existing pooled_allocations/market_flows pattern. #pace now sums from that shared map instead of firing its own query — same math, same 90-day window, same exclusions, just computed once per family instead of once per goal.	2026-08-01 08:51:08 +02:00
Guillem Arias Fauste	f2782901d3	fix(design-system): DS::Link a11y — distinguishable default, icon-only label, external-link hardening (#1844) ... * fix(design-system): DS::Link a11y — distinguishable default, icon-only label, external-link hardening Closes #1739. DS::Link extends Buttonish, so the styled variants (`:primary`, `:secondary`, `:icon`, `:ghost`, etc.) inherit the Buttonish styling pipeline. The `default` variant is the bare inline link, which had multiple a11y gaps: 1. **WCAG 1.4.1 — color is not the only difference.** The default variant had `container_classes: ""`, so a link rendered as plain text-color text with no underline, no weight change, nothing. Color-only differentiation fails WCAG 1.4.1 for low-vision and colorblind users. Now: `text-link underline underline-offset-2 hover:no-underline` — underlined at rest, underline removed on hover for a polish hint, plus the `text-link` token (blue-600 light / blue-500 dark) for color. 2. **Focus ring.** `<a>` doesn't pick up the `button` focus rule from base.css (#1738). Add `focus-visible:outline-2 outline-offset-2 outline-gray-900 theme-dark:outline-white` directly on the default variant. The Buttonish-derived variants render as buttons visually but as `<a>` in markup — out of scope here; covered by their own callsites styling. 3. **Icon-only accessible name.** Mirror the DS::Button fix from #1738: derive a humanized `aria-label` from the icon key when the caller doesn't provide one, so AT users hear "More horizontal" instead of just the URL. 4. **External-link hardening.** `target="_blank"` without `rel="noopener"` exposes `window.opener` to the new tab (reverse-tabnabbing). Always set `noopener noreferrer` when the target is `_blank`. Authors can override by passing `rel:` explicitly. 5. **sr-only "(opens in new tab)" hint.** Append an `sr-only` span after the link text when `target="_blank"` so AT users hear the navigation behavior. Visual indication (e.g. an external-link icon) stays at the caller's discretion. Locale key: `ds.link.opens_in_new_tab` (en only — other locales in a separate translation pass per repo norm). API unchanged. No existing callsites use `target="_blank"` or icon-only links, so no migration needed. * fix(review): fold new-tab cue into icon-only aria-label When an icon-only DS::Link also targets `_blank`, the generated `aria-label` was overriding the descendant accessible name, masking the sr-only "(opens in new tab)" span. Include the cue directly in the generated label so AT users hear the warning. Also switch `capitalize` to `humanize` so multi-word icon keys like `external-link` read as "External link" rather than "External link" already worked but `humanize` is the more idiomatic Rails choice and keeps us aligned with the suggested patch. Flagged by Codex P2 + CodeRabbit on PR #1844. * fix(review): swap raw outline palette to alpha-ring tokens Codex P1 follow-up after the ready-for-review transition: the default \`DS::Link\` focus ring used raw \`outline-gray-900\` + \`theme-dark:focus-visible:outline-white\`, which violates the DS-hygiene rule that bans raw Tailwind palette utilities in component styling. Swap to the established alpha-ring pattern already used by DS::Toggle (#1843), DS::Tooltip (#1845), provider_card, and form-field — \`focus-visible:ring-2 focus-visible:ring-alpha-black-300\` + \`theme-dark:focus-visible:ring-alpha-white-300\`. Same visual contract (WCAG 1.4.11), theme tokens centralized.	2026-05-20 18:16:20 +02:00
Zach Gollwitzer	ab6fdbbb68	Component namespacing (#2463) ... * [claudesquad] update from 'component-namespacing' on 18 Jul 25 07:23 EDT * [claudesquad] update from 'component-namespacing' on 18 Jul 25 07:30 EDT * Update stimulus controller references to use namespace * Fix remaining tests	2025-07-18 08:30:00 -04:00