Repository navigation
feat(seo): give the home, playstyle and reveals pages their own link preview images (#1135) - #1137
Conversation
…preview images (#1135) The deploy build now draws three more kinds of preview image beside the card images: the home page's (the six featured cards under "Find the cards that work together"), each of the 25 playstyle pages' (the gallery tile's fan, its name, tagline and card count) and, in reveal season only, /reveals' (the set, how many of its cards are out, and the five newest). Every other page the crawl writes, a card without art included, names the home image instead of the old wordmark banner. Check 13 fails the deploy when a page names anything but its image. PLAYSTYLE_UI and PER_INK live in the app's TypeScript, so the helper reads them as text, and its tests fail when either stops parsing. Closes #1135 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DjrxDUg8t6RHUrGiKw1neQ
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
🎨 Design-surface change detected This PR touches files mirrored by the Inkweave design system project. What changed:
To refresh: open the design system Claude project and prompt:
This is a reminder, not a blocker. Configured in |
size-limit report 📦
|
There was a problem hiding this comment.
cubic analysis
All reported issues were addressed across 14 files
Linked issue analysis
Linked issue: Doberjohn/inkweave#1135: Give the reveals, playstyle and home pages their own link preview images
| Status | Acceptance criteria | Notes |
|---|---|---|
| ✅ | Give home and playstyle pages their own images | The generator creates per-route page images, and the crawl writes them with alt text into the captured pages. |
| ✅ | Give reveals its own in-season image | The shared season test gates generation and capture; the image includes the set, revealed count, total, and newest cards. |
| ✅ | Use the home image for other prerendered pages | ogImageForRoute falls back to the home image, and check 13 verifies each captured route’s expected image. |
| ✅ | Use byte-hashed image URLs served as immutable | Page images use ogFileName to hash JPEG bytes; the existing immutable rule for /og/ remains in place. |
| ✅ | Fail deploy checks for missing page images | Check 13 verifies expected filenames and build files, and its tests remove an image to prove the failure. |
| ✅ | Test parsing of playstyle and reveal configuration | Tests parse both real TypeScript files and assert catalog playstyles have entries and the reveal total is positive. |
| Keep staging builds from drawing images | The generator comments say SKIP_PRERENDER skips image drawing, but the diff shows no staging guard or test for it. | |
| ✅ | Leave app JavaScript and card data unchanged | The PR reports no app JavaScript or card data changes, and the supplied diff changes scripts and documentation only. |
Reply with feedback, questions, or to request a fix.
View guided diff | Fix all with cubic | Re-trigger cubic
…check 13 (#1135) The page images now read preview-only cards as the app's loader does, so a featured or playstyle card from the next set is drawn and counted. Check 13 fails a page it expects that the crawl never wrote, and expects /reveals only in season. The reveal season test moves into pageOgImage.mjs as a boolean, one ogImageUrl builder serves both image folders, and capturedPageFile is shared by every check that opens a captured page. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DjrxDUg8t6RHUrGiKw1neQ
There was a problem hiding this comment.
Gates Passed
6 Quality Gates Passed
See analysis details in CodeScene
Quality Gate Profile: Pay Down Tech Debt
Install CodeScene MCP: safeguard and uplift AI-generated code. Catch issues early with our IDE extension and CLI tool.
Closes #1135
What changes
A link to the home page, a playstyle page or, in reveal season,
/revealsnow previews with an image of its own, and every other page previews with the new home image instead of the old wordmark banner (/og-image.png). Each image is 1200x630:Details:
scripts/generate-og-images.mjsdraws the page images on a fifth page beside the four card pages, withscripts/og/page-template.html. It writesdist/og/page/{home|reveals|playstyle-<id>}.{sha256 prefix}.jpgand a second record,apps/web/node_modules/.cache/og-pages.json. Locally: 26 page images (27 in a faked season), 2.0 MiB, with no change to the run's 30 s.scripts/lib/pageOgImage.mjsholds the pure parts: what each image shows, its alt text, which image a route names (pageOgKey,ogImageForRoute), the season test, and the parsers forPLAYSTYLE_UIandPER_INK. Its tests are inscripts/lib/__tests__/pageOgImage.test.mjs, and they parse the app's realplaystyleUi.tsandrevealSet.ts.scripts/prerender.mjswrites each page's own image, or the home image, into every page it captures.isRevealSeasonActivenow calls the helper'srevealSeasonSet, so the crawl and the generator always agree on the season.scripts/check-rendered-html.mjsfails the deploy when/, a playstyle page or/reveals(when the crawl wrote it) doesn't name its own/og/page/image, or another prerendered route doesn't name the home image. It also fails whentwitter:imagediffers fromog:image, or when the build lacks the file. Check 12's image test is now shared with it.withCardOgImageis renamedwithOgImage, since every page uses it now.deploy.yml's dry-run paths add the new helper.build:vercel's fallback message names both checks.CLAUDE.md's Link previews note andIMAGES.md.Where it differs from the issue
homeOgDatatakes the featured ids and the card list. The issue had it readfeaturedCards.json's cards directly, but that file's cards carry no image hash.Verification
pnpm test:scripts: 1195 passed (10 new helper tests, 5 for check 13)lint:root, knip, and the CodeScene gate (Code Health 10 on every changed script)/and/playstyles/lore-denialname their own/og/page/image in both tags with alt text,/revealsnames its own, and/browse,/playstyles,/ink/amberand/votename the home imageplaystyle-lore-denial.*.jpgmakes check 13 fail, naming that page/revealswith five reveals, two reveals, and Locations among the newest, looked right to me. It goes to the owner before merge.After deploy:
curlthe og:image of/and/playstyles/bounce, check one image's headers, and Scrape Again on/in Facebook's Sharing Debugger.Generated by Claude Code
Summary by cubic
Gives the home, playstyle, and
/revealspages their own link preview images, so links to them no longer show the site-wide wordmark banner. Every other page the crawl writes now previews with the new home image./revealsin reveal season only) from a new template and pure helper; featured and playstyle cards from the next reveal set are drawn and counted too, preview-only cards read as the app's loader merges them.twitter:imagediffers fromog:image, when the file is missing from the build, or when a route the crawl should have written has no page at all.playstyleUi.tsandrevealSet.tsas text; their tests fail when either file stops parsing./revealsis drawn and expected exactly when it is captured.withCardOgImageis renamedwithOgImage, since every page now uses it.Written for commit 45c7f49. Summary will update on new commits.