Skip to content

bento home: redesigned home, track detail, playground gallery, uikit nav

jedmund requested to merge jedmund/bento-home into main

Created by: jedmund

Summary

Rebuilds the home screen around the handoff's bento design and the supporting navigation machinery underneath it.

  • Bento home replaces the tree-expanding HomeScreen. New chips (streak, module, style), a continue-learning hero card with five animated hero medias (spectrum, waveform, harmonics, piano roll, arrangement), an up-next reco card, per-track tiles with progress strips, and a playground rail of pill cards.
  • Push destinations for deeper navigation: TrackDetailScreen (full curriculum listing with inline lesson rows + per-status circles) and PlaygroundGalleryScreen (the "See all" target showing every tool grouped into Instruments / Explorers / Exercises with blurbs and a "coming soon" badge for unfinished ones).
  • Design system: centralizes Typography, ColorTokens, and TrackPalette tokens plus a debug DesignSystemGallery view. Foreground tokens are ShapeStyle values that pick up the user's filter palette as a subtle hue tint.
  • Routing: CurriculumStore switches from a single NavigationState enum to a [Route] path. Adds PlaygroundCatalog as the single source of tool classification + ready/coming-soon status.
  • UIKit NavigationHost: UIViewControllerRepresentable wrapping a UINavigationController with a custom slide-with-fade transition animator and a UIPercentDrivenInteractiveTransition-driven edge-pan. Gives us real interactive-pop physics while keeping the GenerativeBackground persistent behind every pushed screen (previous NavigationStack approach caused ghosting with transparent hosting controllers).
  • Dark mode: filter palette auto-inverts from the user's light pick; foreground tokens still resolve to near-white with a subtle hue shift.
  • Legacy HomeScreen, TrackScreen, ModuleScreen, and PlaygroundGrid retired.

Test plan

  • Home renders over the filter wallpaper (light + dark)
  • Tap a track tile: track detail pushes, filter stays constant, no ghosting
  • Tap a lesson row: pushes into LessonScreen
  • Back chip + edge-swipe both pop with proper physics
  • Tap "See all" in Playground header: gallery pushes
  • Gallery coming-soon cards are faded and non-tappable
  • Style chip on home opens the background diagnostics panel
  • Debug toolbar (DEBUG only): hero media switcher, lesson picker, design system gallery all work
  • Filter darkColor changes visibly tint text (warmer / cooler)

Merge request reports

Loading