Skip to content

feat(storybook): Sources hub redesign - #6961

Draft
tomeredlich wants to merge 3 commits into
mainfrom
claude/sources-page-redesign-bb829c
Draft

tomeredlich wants to merge 3 commits into
mainfrom
claude/sources-page-redesign-bb829c

Conversation

@tomeredlich

@tomeredlich tomeredlich commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

What

The /sources page redesign as Storybook stories, under Sources/Redesign. Storybook only: every file is in packages/storybook/stories/sources/, with no app, shared or config changes.

  • Overview covers today's page, the redesigned hub and the reasoning behind it.
  • All states covers every width (1440, 1024, 768, 375, 360), signed in and out, light and dark, plus a flow map of where each press goes.

The hub

  • Frame: it sits on the squads directory's new frame. From tablet up, the header has search, then the tabs (Discover and the squad directory's 13 categories), then Suggest a source.
  • Discover: Trending, Most followed and Recently added in Popular Squads' layout, a sideways Top video row, and a tile for each topic.
  • Category pages: a bordered list with Squads, developers and Most followed widgets. The widgets sit beside the list on laptop and below it on smaller screens.
  • Phones: production's phone shell, with /sources as an Explore view. The categories open from the lit Sources segment in a sheet, the same way Happening now works.
  • Follow and Join: one XSmall primary size. After you press it, the button goes away and the toast offers Undo. Signed out, these actions ask you to sign up.
  • Search: opens Spotlight already filtered to a new Sources scope, the same way the squads directory opens it filtered to Squads. The backend for that scope still has to be built.
  • Source page: opened from any row, tile or search result. It has Back and a breadcrumb, Follow, Copy link and ⋯, topics, latest posts, and similar sources that open their own page. It also covers a blocked source (with Unblock) and sources with no posts or no description.
  • Leaving the sources pages: presses that go somewhere else (a post, a tag, a Squad, the rail) show a toast naming the destination.

All data is real, fetched from api.daily.dev into raw.ts.

🤖 Generated with Claude Code

Preview domain

https://claude-sources-page-redesign-bb8.preview.app.daily.dev

Storybook only, no app code. "Sources/Redesign" holds two stories:

- Overview: today's /sources, the redesigned hub on the squads
  directory's frame (Discover lists in Popular Squads' layout, a Top
  video row, the squad directory's 13 categories), and the reasoning.
- All states: every width, account, theme and state, plus a flow map
  of where each press goes.

The hub runs on real api.daily.dev data in device-width iframes, so
each frame shows its true breakpoint. Phones use production's phone
shell; the category tabs ride on the Sources segment in a sheet, as
Happening now does. Search opens Spotlight scoped to a new Sources
scope (mocked until the backend lands). Rows, tiles and search results
open a source page, and presses that leave the sources pages name
their destination in a toast.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@vercel

vercel Bot commented Oct 19, 2026 •

Copy link
Copy Markdown

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

Project Deployment Actions Updated
daily-webapp Ready Ready Preview Oct 19, 2026 4:40pm UTC
storybook Ready Ready Preview Oct 19, 2026 4:40pm UTC

Request Review

Every Suggest button in the hub now opens production's NewSourceModal,
drawn in the device frame since the real one needs the app's auth and
react-modal mounts it outside the frame. Same copy and fields (TextField,
Radio, Alert) and the same steps: Check link, pick a feed, Submit for
review, then the thanks toast. The scrape is mocked from the link, so
"already exists" (linking to the source's page), the fetch error with
Contact, and the reputation lock are all reachable. The All states page
gains a Suggest section at laptop and phone.

A new "Suggest a source · 6 directions" story explores six redesigns of
the popup on the same mocked flow: command bar, live preview, stepper,
invitation, kinds and timeline, and an anchored popover.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The suggest popup stays as production's NewSourceModal.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

This branch was successfully deployed

2 active deployments
Preview – daily-webapp — 49babe24 Deployed Oct 19, 2026 by vercel[bot]
Preview – storybook — 49babe24 Deployed Oct 19, 2026 by vercel[bot]
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.

1 participant