feat(layout-v2): reading-focused sidebar redesign

[tsahimatsliah]

What

Engineering-ready migration of the v2 reading-layout sidebar redesign (design exploration in #6177), rebuilt cleanly on top of main. Addresses the top council feedback: "everything is hidden, you have to remember the icons, and streak/cores/reputation aren't visible."

All behavior is gated behind the v2 layout (useLayoutVariant, laptop+). v1 is untouched.

Highlights

• Labelled rail icons — Home, Squads, Discover, Saved, Quests, Profile, Alerts. No more guessing.
• Profile avatar at the rail top with a reading-streak status ring + Plus badge, opening a production-style profile dropdown (reputation/cores strip, theme toggle, support menu).
• Home panel hub — Pinned squads, Recent pages, and an Explore entry that folds Discover in. Reddit-style hover-to-peek for the collapsed sidebar, with a rail→panel pointer safe zone.
• Explore hub — section tabs + a Sort dropdown (replaces the second tab row), extended to the Discussions feed.
• New-post rail button opens a create menu; single-panel settings with "Back to app"; always-visible streak ring on the avatar.

Engineering notes (polish over the design branch)

This branch is the design exploration (~100 commits, several add-then-revert cycles) distilled to its final net state, with the following cleanups applied so it's review-ready:

• Reverted spurious pnpm-lock.yaml churn — the @floating-ui/react hover-intent experiment was reverted; the only remaining lock delta was an incidental transitive @floating-ui/dom bump with no package.json change. Removed.
• No shared-primitive leak into v1 — the design branch changed fields/Dropdown's iconOnly styling, which also affected the v1 FeedExploreHeader date filter. Reverted Dropdown to main and scoped the square styling to the new ExploreSortDropdown via className.button (per the "don't add context to shared primitives" guideline).
• Removed dead code — deleted the superseded SidebarRailStats component (the streak now lives on the avatar via StreakRing), simplified StreakPopover to its single used placement, and stripped the EarnPop animation-comparison lab from the Storybook story (kept the real stories).
• Wired the pin icon into the v2 Squads list — the design built the pin infrastructure (createSquadMenuItem, PinnedSection, SquadFavoriteButton's asPin) but NetworkSection still rendered the v1 star. Routed its rows through createSquadMenuItem (removing a duplicated inline builder) and pass asPin only from the v2 sidebar — v1 keeps the star.

Shared components — v2 polish gated behind opt-in props (v1/production unchanged)

The redesign is v2-only, so the shared-component tweaks the design introduced are gated behind props that default to the existing v1 behavior:

• Section — hover-only collapse arrow + 1px item gap behind a compact prop (set only by the v2 sidebar); v1 keeps its always-visible arrow. Also fixes title-less sections getting stuck hidden.
• ProfileSectionItem / ProfileSection — external-link icon reveal-on-hover behind a linkIconHoverOnly prop; the v2 profile/support menus opt in, production keeps the always-visible icon. (Internal-route hover-prefetch kept — invisible perf win.)
• ProfileMenuHeader — tighter name/handle gap behind a compact prop; also returns null when there's no user (strict-typecheck guard).
• NotificationsBell — new rail/railHideLabel props are confined to the if (rail) branch (v2 only); the v1/mobile Button path is unchanged.

Correctness & cleanup fixes (engineering review)

• Global Escape scoped to the sidebar — the pinned panel no longer resets to Home when Escape is pressed elsewhere (closing a modal, blurring a field).
• Streak escalation interval gated — useStreakRingState's 5-minute timer only runs when it can change state (enabled, not yet read today, at-risk day).
• Cleared isCreateHovered on blur; removed the orphaned directoryTabs branch from FeedExploreHeader; drop empty group sets from the useInteractivePopup registry; direct largeNumberFormat import; max-w-3xl token.

Testing

• node ./scripts/typecheck-strict-changed.js — clean.
• eslint on all changed shared + webapp files — clean.
• Sidebar / squads / ProfileMenu / layout specs — 60/60 pass.
• Not yet eyeballed in a running browser.

🤖 Generated with Claude Code

Preview domain

https://claude-competent-leakey-6f742a.preview.app.daily.dev

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
daily-webapp	Ready	Preview	Jun 17, 2026 11:13am
storybook	Building	Preview	Jun 17, 2026 11:13am