Repository navigation
feat(og): server-rendered project and home social cards (fixes #24) - #51
Closed
astra-intelligence wants to merge 1 commit into
Closed
astra-intelligence wants to merge 1 commit into
astra-intelligence wants to merge 1 commit into
Conversation
Adds server-side Open Graph support for project links so Discord, X, Slack
and other crawlers see a real card instead of a blank preview.
- apps/web/api/og.ts: crawler-facing HTML with og:title/description/image
(project + home variants), HTML-escaped values, 404 handling.
- apps/web/api/og.png.ts: renders 1200x630 PNG with satori + resvg from
/api/projects/{id}; project card shows name, tagline, contracts count,
evidence tier and hackathon; home default card shows the timeline chart.
- apps/web/vercel.json: rewrites /project/* and / from known link-preview
crawler user agents to /api/og; normal visitors keep the SPA.
- apps/web/api/_og-lib.tsx + bundled Outfit 400/600 fonts (fontsource).
- index.html: static og/twitter meta defaulting to the timeline card.
- pnpm-workspace.yaml: approve esbuild build (placeholder left by pnpm approve-builds).
Verified: pnpm lint, format:check and build green; both cards render 1200x630
against the live Railway API and pass vision QA.
|
@astra-intelligence is attempting to deploy a commit to the Payroutes OSS Team on Vercel. A member of the Team first needs to authorize it. |
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
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.
Summary
Closes #24. A link like
https://hackproof-six.vercel.app/project/repo:Klorenn/LOOTpasted into Discord, X, Slack, Telegram or iMessage now renders a real preview card instead of a blank link. The SPA is untouched for normal visitors.What changed
apps/web/api/og.ts— crawler-facing HTML withog:title,og:description,og:image(+ spread/twitter tags), HTML-escaped, for/project/*and the home page. 404 for unknown project ids.apps/web/api/og.png.ts— renders a 1200×630 PNG withsatori+@resvg/resvg-jsfromGET /api/projects/{id}:/api/timelineapps/web/vercel.json— rewrites/project/*and/requests from known link-preview crawler user agents (Discordbot, Twitterbot, facebookexternalhit, LinkedInBot, Slackbot, TelegramBot, WhatsApp, Pinterest, etc.) to/api/og. Everything else keeps the SPA.apps/web/api/_og-lib.tsx+ bundled Outfit 400/600 fonts (fontsource latin TTFs, ~33 KB each) so satori renders the site's own brand type.apps/web/index.html— staticog:/twitter:meta defaulting to the timeline card for crawlers that bypass the UA list.pnpm-workspace.yaml— set theesbuildbuild-approval placeholder left bypnpm approve-buildstotrue(esbuild is a transitive dev dep of@vercel/node/vite; the postinstall just validates the binary).The card pulls data from the same Railway API the site uses.
API_URLenv (orRAILWAY_API_URL) overrides the default production URL.Verification
pnpm lint— 0 errors (4 pre-existing warnings, unchanged)pnpm format:check— cleanpnpm build— green (Vite + publish-data)<script>payload; missing project returns 404Happy to share rendered card previews, or you can see them live by hitting
/api/og.png?project=repo%3AKlorenn%2FLOOTand/api/og.pngafter deploy.