Skip to content

feat(storybook): Open Graph share-preview review & recommendations#6231

Closed
tsahimatsliah wants to merge 1 commit into
mainfrom
claude/eager-leavitt-bfba54
Closed

feat(storybook): Open Graph share-preview review & recommendations#6231
tsahimatsliah wants to merge 1 commit into
mainfrom
claude/eager-leavitt-bfba54

Conversation

@tsahimatsliah

@tsahimatsliah tsahimatsliah commented Jun 22, 2026

Copy link
Copy Markdown
Member

Changes

Adds a new Open Graph Storybook section that audits daily.dev's outbound link previews across every share surface and proposes a unified, on-brand recommended template ("Layout A").

  • Current vs Recommended for each share type — article, shared post, profile/DevCard, squad, squad invite, source, tag, comment, referral, Plus, homepage.
  • The Current column renders the real images daily.dev serves today (raw, not re-created). The Recommended column renders the Layout A cover for the same real entity (real post engagement, real DevCard stats, WebDev squad, freeCodeCamp source, real commenter) so the before/after is apples-to-apples.
  • Supporting pages: platform unfurl previews (X/LinkedIn/Slack/Discord/etc.) with per-platform meta-tag length warnings, guidelines & research, an X (Twitter) deep dive, a Satori template spec, a benchmark of how the best platforms share, and a link copy/metadata page.
  • Single source of truth in cover.tsx (Layout A atoms + OgCover); RecommendedOg in dailyOgImages.tsx is the adapter every page consumes.

Docs/review only — no app/runtime code paths are touched (Storybook stories under packages/storybook plus one preview.tsx sidebar entry).

Events

No new tracking events.

Experiment

No new experiments.

Manual Testing

Storybook-only change. Verified pnpm --filter storybook build succeeds and the strict typecheck guard passes for changed files. Covers render full-width across the section; all referenced real image assets resolve.

Preview domain

https://claude-eager-leavitt-bfba54.preview.app.daily.dev

Adds a new "Open Graph" Storybook section that audits daily.dev's
outbound link previews across every share surface (article, shared
post, profile/DevCard, squad, squad invite, source, tag, comment,
referral, Plus, homepage) and proposes a unified "Layout A" recommended
template.

- Current column renders the real images daily.dev serves today; the
  recommended column renders the Layout A cover for the same real entity
  so the before/after is apples-to-apples (real engagement, DevCard
  stats, WebDev squad, freeCodeCamp source, etc.).
- Includes guidelines/research, an X (Twitter) deep dive, a Satori
  template spec, a benchmark of how the best platforms unfurl, and a
  link copy/metadata page.

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

vercel Bot commented Jun 22, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
daily-webapp Ready Ready Preview Jun 22, 2026 9:49am
storybook Building Building Preview Jun 22, 2026 9:49am

Request Review

@tsahimatsliah

Copy link
Copy Markdown
Member Author

Superseded by #6232 — the engineering-ready version of this work, opened fresh off main.

#6232 ports all the share-surface review/comparison pages and the unified Layout A recommended template, cleaned up for merge:

  • Dropped the exploratory "Recognizable Covers" direction-picking page and its dead code (coverDna.tsx, the standalone Cover/Source/Headline/ArtBox atoms, unused colors, OgFrame).
  • Fixed the stale Overview TOC and page numbering.
  • Refactored nested ternaries; eslint + prettier clean, strict typecheck passes, storybook build green.

Closing this mock-up in favor of #6232.

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