Dynamic Open Graph share cards for profiles, orgs & leaderboards#111
Open
peetzweg wants to merge 3 commits into
Open
Dynamic Open Graph share cards for profiles, orgs & leaderboards#111peetzweg wants to merge 3 commits into
peetzweg wants to merge 3 commits into
Conversation
Give the high-traffic pages their own share previews instead of the single static site card: - Developer pages (/$user): avatar, name, overall + public-commits rank. - Organization pages (/paritytech): avatar, name, place on the org board. - Leaderboards: distinct "Developer" vs "Organization" cards, picked by ?kind. Per-entity cards render at runtime on /og/$kind/$login (satori + resvg, same pattern and durable-CDN headers as /embed); the two leaderboard cards are fixed content so they're baked at build time. All rendering lives in a shared, fs-free lib/og-card module reused by the build script and the route. - lib/og-card.ts: shared satori/resvg card builders (font + crown inlined). - routes/og.$kind.$login.tsx: runtime PNG route; unknown/building logins 302 to the static site card. - lib/org.ts: orgRankFor() for a login's org-board place; export resolveOrg. - generate-og.ts now also emits the two leaderboard cards; runs via tsx so it can import the shared #/ module (plain node can't resolve the TS paths). - $user/index head(): wire og:image to the new endpoints/cards. - satori + @resvg/resvg-js moved to dependencies (needed in the server bundle); tsx added as a devDependency.
|
The preview deployment for peetzweg/commit-history:coolify-bwc8csg4w8gkkgcg8s404cks is ready. 🟢 Open Preview | Open Build Logs | Open Application Logs Last updated at: 2026-07-10 13:48:23 CET |
Per design feedback: rank numbers render in the ink colour, not the accent green, on both cards. The developer card drops the overall rank and shows only its public-commits place.
The single developer rank is the public-commits place; when the profile has no
public commits to rank, it falls back to the private-contributions place
("#N by private contributions") instead of dropping the line.
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.
Gives the DB-driven pages real share previews instead of everyone getting the one static site card.
Why: sharing a profile, an org, or the org leaderboard to X/Slack/LinkedIn currently shows the generic
og.png— no signal about who or what board you're linking to.How: per-entity cards render at runtime on
/og/$kind/$login(satori + resvg, mirroring the existing/embedroute and its durable-CDN headers); the two fixed leaderboard cards are baked at build time. All card drawing lives in one fs-freelib/og-cardmodule shared by the build script and the route, so the build-time and runtime images stay identical.head()on/$userand/wiresog:imageto the right endpoint/card (org board picked by?kind=org).One judgment call: the developer card shows two ranks (overall + public-commits) and no commit count, per the brief. Non-latin/missing display names fall back to the
@handleso nothing renders as tofu.satori+@resvg/resvg-jsmoved todependencies(server bundle needs them; the native binding traces into.output). Verified end-to-end againstpnpm build && pnpm start.public/og/is gitignored — cards regenerate on deploy (pnpm build, which the Coolify Dockerfile already runs).