feat(snapshot): snapshot an expanded highlight on Happening Now - #6570
Open
tomeredlich wants to merge 3 commits into
Open
feat(snapshot): snapshot an expanded highlight on Happening Now#6570tomeredlich wants to merge 3 commits into
tomeredlich wants to merge 3 commits into
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
tomeredlich
force-pushed
the
snapshot-happening-now
branch
from
September 2, 2026 15:07
e11ab2f to
220744a
Compare
tomeredlich
force-pushed
the
snapshot-happening-now
branch
from
September 3, 2026 09:30
220744a to
bbe1546
Compare
tomeredlich
force-pushed
the
snapshot-happening-now
branch
from
September 3, 2026 13:09
e0216a8 to
cc74e39
Compare
Every highlight is a self-contained claim with sources behind it, and today none of them can be lifted out. The page also has the shortest shelf life we publish, which is why the image beats the link: a URL sends someone to a page that has already moved on. Snapshot and copy link sit opposite Read more once a highlight is open. Expansion is the intent signal, so a scan of the feed stays a scan. Behind snapshot_highlight_expanded, off. The card takes its timestamp from the formatter the row already renders, so the two cannot disagree about how old the claim is, and it no longer prints the channel, which is a slug rather than the tab's display name. /dev/snapshot-happening-now renders the production row with the flag pinned through the harness context, so the review surface exercises the shipped component instead of restating its markup. Mockup-to-eng-pass: 1
Snapshot on an expanded highlight now matches the copy link beside it — tertiary and icon-only, so the footer reads as two peers rather than one button and one afterthought. Marking text inside a highlight's TLDR raises the same selection bar the post page uses: snapshot the quote, copy it, or copy the link. The bar, the card and the selection hook come over from the post page branch; whichever lands second drops its copy. Copy link joins three more places, each pointing at what the reader is looking at: the feed card header on hover, a headline row on hover (carrying that highlight's id), and the page header. The flag becomes happening_now_share, since it no longer gates only the expanded snapshot. Still off by default. Mockup-to-eng-pass: 2
Every copy control on Happening Now swapped its glyph for nothing: the toast was the only acknowledgement, and it lands in a corner away from the press. The icon now crossfades to a green check and back after a second, so the confirmation arrives where the eye already is. CopyStateIcon comes from the split share button work, widened to take the resting glyph so a link button can use it too. It ships there as well; whichever lands second drops its copy. Mockup-to-eng-pass: 3
tomeredlich
force-pushed
the
snapshot-happening-now
branch
from
September 3, 2026 13:52
cc74e39 to
1269d52
Compare
tomeredlich
marked this pull request as ready for review
September 3, 2026 13:57
tomeredlich
added a commit
that referenced
this pull request
Sep 3, 2026
Replace the spinning avocado arrow with CopyStateIcon, taken verbatim from snapshot-happening-now so the two branches cannot drift: the link glyph and a green check share one grid cell and cross-fade over 200ms on easeOutExpo, collapsing to an instant swap under prefers-reduced-motion. Nothing resizes mid-swap, which the spin could not promise. Drop the copy-confirm keyframes with it, now that nothing references them. On the squad directory cards the control loses its fill and stroke, and takes the Medium size SquadActionButton leaves Button on, so it lines up with Join rather than sitting a step smaller beside it.
tomeredlich
added a commit
that referenced
this pull request
Sep 3, 2026
#6570 extends CopyStateIcon for the same reason — a copy control that rests on a link glyph — and lands on a green VIcon that fades in, with the resting glyph passed as `icon`. This branch had an avocado UpvoteIcon spinning 360° through a `copy-confirm` keyframe, under a prop called `idle`. Both PRs touch the same file, so this takes #6570's component and spec verbatim and renames the call sites. The keyframe goes with the spin: nothing references it once the check lands. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This was referenced Sep 3, 2026
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.
Every highlight on Happening Now is a self-contained claim with sources behind it, and today none of them can be lifted out. The page also has the shortest shelf life we publish, which is why the image beats the link: a URL sends someone to a page that has already moved on.
The placement
Expanding a highlight ends the row with copy link and a Snapshot button, opposite "Read more". Snapshot rasterizes that highlight — headline, TLDR, relative time — into a 1080² card and puts it on the clipboard with the link. Collapsed rows are untouched, so a scan of the feed stays a scan.
Behind
snapshot_highlight_expanded, defaulting to off.Copy confirmation
Both copy controls — the one in the expanded row and the one in the page header — discarded
useCopyText's copying flag, so a press left only a toast behind. They now shareCopyLinkIcon: on a copy the link icon swaps to the upvote button's filled avocado arrow and spins throughcopy-confirm, the same 0.4s curve as itsspinAndScale, off underprefers-reduced-motion. The tooltip switches to "Copied!" with it.Files
The placement is four files:
HighlightSnapshotCard— the 1080 square: a live "Happening now" eyebrow, the headline as the hero with its size stepping down as it grows, the TLDR, and the timestamp.HighlightSnapshotButton— stages the card off-screen at full size, since the capture reads live DOM.HighlightShareActions— the copy-link + Snapshot pair. Separate souseCopyTextstays out ofHighlightItem, which would otherwise need a QueryClient for a placement that is off by default.HighlightItem— four imports, one hook, and one block in the expanded footer.The rest is the snapshot foundation —
SnapshotFrame,snapshotGradient,snapshotText,shutterSound,SnapshotButton,captureShareImage/copyShareImage/downloadShareImage, the icon, the shutter CSS and@zumer/snapdom. None of it is onmainyet.snapshot-post-page-variations(#6556) introduces the same files; whichever lands second drops its copy.Two things the mock-up hid
Both were only visible against the real feed, and both are fixed here:
highlight.channel, which is a slug (vibes), not the tab's display name (Agentic). The card no longer prints the channel at all.postDateFormat, which returns "Today" / "Now", while the row rendersgetLastActivityDateFormat→ "2h ago". Both now read the same formatter and the same 72-hour window, so a card cannot disagree with the row it came from.Reviewing it
The review page renders the production
HighlightItemwith the flag pinned through the exported harness context, so it exercises the shipped component rather than restating its markup.noindex/nofollow, blocked on the canonical production hosts.Only
.preview.app.daily.devworks. The same build is served fromvercel.app, butapi.daily.devrejects that origin on CORS, so the app never boots there.Review links
Features/Snapshot/Surfaces/Happening nowon 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-happening-now--variationsPreview domain
https://snapshot-happening-now.preview.app.daily.dev