Skip to content

Fix stale Plan tab on plan switch; replace segmented toggle with title picker - #17

Merged
bmingles merged 1 commit into
mainfrom
claude/book-group-tags-bckdee
Jul 17, 2026
Merged

Fix stale Plan tab on plan switch; replace segmented toggle with title picker#17
bmingles merged 1 commit into
mainfrom
claude/book-group-tags-bckdee

Conversation

@bmingles

Copy link
Copy Markdown
Member

Bug fix

Switching the active plan while the Plan tab stayed mounted showed stale content — the previously active plan's day/chapter breakdown kept rendering instead of the newly selected plan's.

Root cause: ChapterGroupList's <For> over group names snapshotted each group's chapters into a plain const chapters = props.data[groupName] before returning JSX. Day names ("Day 1", "Day 2", ...) are identical strings across every plan, so <For> — which is keyed by value — never re-invoked that callback on a plan switch. The snapshot froze at whichever plan was active on first render.

I confirmed the underlying activePlanId/perDayTagData signal chain was already firing correctly (instrumented planGroups's createMemo and watched it recompute on every toggle) — only the rendered output was stale. The fix keeps the props.data[groupName] lookup inline in the JSX instead of pre-computing it, so it compiles to a reactive getter rather than a frozen snapshot.

UX change

Replaced the segmented-control plan toggle (from the previous PR) with PlanPicker, an iOS "tap the title to switch context" menu — the pattern Mail and Reminders use for their inbox/list pickers. The segmented control didn't scale past a couple of plans (not enough horizontal room); this does, and it only appears once there's more than one plan to switch between.

Test plan

  • npm run build passes
  • tsc --noEmit passes
  • Reproduced the stale-content bug in a headless browser before the fix (Day 1 kept showing the old plan's chapters — Genesis 1-3, Matthew 1-2 — after switching to a Genesis-only plan), confirmed the fix resolves it, and confirmed it round-trips cleanly switching back and forth several times
  • Verified the new PlanPicker: hidden with one plan (shows plain "Plan" title), shows "{active plan name} ▾" with 2+ plans, opens a menu with a checkmark on the active plan, closes on selection or on an outside click, and correctly updates both the title and the rendered day content — tested with 5 plans to confirm it doesn't run into the segmented control's space problem

Generated by Claude Code

…e picker

Bug fix: switching the active plan while the Plan tab stayed mounted
showed stale content — the previously active plan's day/chapter
breakdown kept rendering. Root cause: ChapterGroupList's <For> over
group names snapshotted each group's chapters into a plain `const`
before returning JSX. Day names ("Day 1", "Day 2", ...) are identical
across every plan, so <For> (keyed by value) never re-invoked that
callback on a plan switch, freezing the snapshot at whichever plan
was active on first render. Fix: do the props.data[groupName] lookup
inline in the JSX so it stays a reactive getter instead of a frozen
snapshot. (The underlying activePlanId/perDayTagData signal chain was
already correct — confirmed via instrumentation — only the rendered
output was stale.)

UX: replaced the segmented-control plan toggle with PlanPicker, an
iOS "tap the title to switch context" menu (the pattern Mail and
Reminders use for their inbox/list pickers). The segmented control
didn't scale past a couple of plans; this does, and only appears when
there's more than one plan to switch between.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01K2wCTwwVhhkSDxQxWo7UoH
@bmingles
bmingles merged commit 456be8e into main Jul 17, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants