feat(snapshot): status moments review page - #6581
Open
tomeredlich wants to merge 8 commits into
Open
Conversation
Splits the "Status moments" section out of #6544 so it can be reviewed on its own. Seven win moments that end in a dismiss — reading streak, achievements, leaderboard rank, top reader badge, streak tiers, being awarded, and post analytics — each drawn today / recommended / push. Lives at /dev/status-moments alongside the existing /dev/buttons and /dev/checkbox-radio review surfaces, so it renders in the real app shell rather than in Storybook. Gated to non-production builds and noindex. Adds the Snapshot icon the control needs. Everything on the page is inert: no data wiring, no capture, no feature flag. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
The six surface docblocks walked through the JSX beneath them, and two restated copy that the page already renders in its own `note` and `verdict` props. The achievement block also described hover behaviour this page does not implement. Replaced with the one-line source reference the analytics screen already used, so each screen names the real component it redraws and nothing else. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The screens hand-rolled five parts the design system already ships: the reminder toggle, the opt-out checkbox, the achievement progress bar, the leaderboard avatars and the rank badges were raw spans with styling typed in directly. Swapped for Switch, Checkbox, ProgressBar, ProfilePicture and TopRankBadge. The rank column changes visibly and deliberately: TopRankBadge draws the gold/silver/bronze medals the real leaderboard draws, replacing a 🥇 emoji and "#2"/"#3" text. Mockup-to-eng-pass: 1 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
tomeredlich
added a commit
that referenced
this pull request
Sep 3, 2026
…o choose from The Snapshot button becomes a Share button: the icon and label are the ones people already recognise, and pressing it opens a menu that previews the designed 1080² card before offering it. The menu opens immediately with a skeleton rather than waiting on the render. Rasterizing takes a second or two, and a control that does nothing visible for that long reads as broken — so the capture is deferred a tick, letting the menu paint first, and Copy link stays usable while the card is still rendering. Seven layouts are up for review in Features/Snapshot/Menu styles, all live against the same card: rows, rows-centred, an overlay pill on the card, a compact no-preview variant, Tsahi's split button from #6369, and the two ways the image can sit in the share modal — its own section or a single tile. The `menuVariant` prop exists to serve that page and comes out with the losers. The image is one action, not a mode over the sheet's other targets. A link needs a destination, which is why there are twenty of them; an image does not, because the OS share sheet and the clipboard are the destinations, and no web share intent takes an image anyway. So the image owns its own action and the squads and external tiles keep sharing the link — which is what keeps this on one screen instead of two. Pressing it hands the PNG to the native sheet where the platform takes files, copies it to the clipboard otherwise (with a toast, since the clipboard has no UI of its own), and downloads it only as a last resort. Capture moves into `useSnapshotCapture` so the dropdown and the modal section render from one implementation. Its `isActive` gate matters twice: a feed never carries a 1080px card per item until someone asks to share, and because the modal pre-renders on open, the click handler reaches `clipboard.write` with no await in front of it — still inside the user gesture the clipboard requires. Two surfaces had no card at all, from the #6579 and #6581 reviews: - `FeedSnapshotCard` carries a shared feed's recipe — tags and source count — rather than its posts, which are a standing filter and would go stale. - `AwardSnapshotCard` names the sender. It is the only status moment that comes from someone else, and a gift with no giver reads as self-congratulation. Tsahi's `SplitShareButton` and `CopyStateIcon` come across from #6369 unchanged apart from four additive props — `onOpenChange`, `header`, `menuLayout` and a width override — so his grid is untouched when nobody passes them. `SocialShareList`, `SocialShareButton` and `SocialShareContainer` gain optional size and compact props, defaulting to today's values, so the dropdown can tighten without moving anything else in the app. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
…sign The streak screens were drawn from the old popup: a 🔥 emoji with the count overlaid, a text tier pill and a hand-built day row. The milestone-rewards review (claude/milestone-rewards-storybook-764fa6, Milestone Rewards/Final review) supersedes it. Both screens now use that celebration panel — the Inferno tier artwork over an ember wash, the tier chip, a tabular day count and the week strip — with the first-party decision column under it: Cores and freezes as option rows, then No thanks. The streak popup no longer has a reminder toggle or a "never show this again" checkbox, so Switch and Checkbox are gone with them. Not brought over: the sponsored-gift half of that review (partner offers, claim sheet, gift vault) and the ember and entrance animations. This page compares control placement across eleven screens. Mockup-to-eng-pass: 2 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
tomeredlich
force-pushed
the
snapshot-status-moments
branch
from
September 3, 2026 09:11
9e99d6a to
076561b
Compare
Every moment was drawn as a triplet — the surface as it ships, the placement we want, and a louder push option — plus three moments listed without a drawing at all. That made a page about a decision read as a menu of decisions still open. Each moment now shows the placement it argues for and nothing else. The props that switched between the three states go with them, as does the rail that only existed to sit before/after pairs side by side. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
The screen drew the control twice: an icon in the header and a labelled control under the stats. The header placement asks before the numbers have made the case, so it goes; the control under the stats stays. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
An icon-only Tertiary control beside the close button, matching its weight, so the moment can be captured from the header as well as from the cores row. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
tomeredlich
marked this pull request as ready for review
September 3, 2026 13:50
The page gated on isDevelopment, so the Vercel preview showed the gate message instead of the screens it exists to review. It now blocks the canonical production hosts only, matching /dev/snapshot-happening-now. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The Status moments section of #6544, split out so it can be reviewed on its own.
It lives at
/dev/status-moments, next to the existing/dev/buttonsand/dev/checkbox-radioreview surfaces, so the screens render in the real app shell rather than in Storybook.What it argues
Seven surfaces share one property: there is no page to send anyone to. A link to your streak, your rank or your unlocked achievement means nothing to the person receiving it. Snapshot is not the louder option on these — it is the only one.
Each moment is drawn once, showing the placement it argues for:
Changes
packages/webapp/pages/dev/status-moments.tsx— the page.packages/shared/src/components/icons— the only shared change.packages/webapp/public/streak-tiers/.Screens reuse the design system rather than hand-rolled markup:
ProgressBar,ProfilePicture,TopRankBadge,Button.The page carries
noindex/nofollowand blocks the canonical production hosts, the same gate/dev/snapshot-happening-nowuses. It previously gated onisDevelopment, which meant the Vercel preview showed the gate message instead of the screens the page exists to review.Not in this PR
Design review only. Every screen is inert: no capture, no data wiring, no feature flag.
Events
None.
Experiment
None.
Testing
typecheck:strict:changedclean.next dev: all sections render, the tier art loads, no console errors.Review links
Features/Snapshot/Surfaces/Status momentson feat(snapshot): square share images for every daily.dev surface #6544's build: https://storybook-git-snapshot-share-images-dailydotdev.vercel.app/?path=/story/features-snapshot-surfaces-status-moments--variationsPreview domain
https://snapshot-status-moments.preview.app.daily.dev