Skip to content

Add build-time Open Graph image generation for documentation pages #484

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
Copilot wants to merge 22 commits into
base: main
Choose a base branch
from
+720 −4
Draft

Add build-time Open Graph image generation for documentation pages #484

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
22 commits
Select commit Hold shift + click to select a range
33c8172
Initial plan
Copilot Jan 25, 2026
d920c95
Add dynamic OG image generation via API route
Copilot Jan 25, 2026
8fd4e07
Improve error handling in OG image generation
Copilot Jan 25, 2026
86bd0d8
Remove API route incompatible with static export
Copilot Jan 25, 2026
d2e9db5
Restore original page metadata without API route reference
Copilot Jan 25, 2026
89c4485
Implement build-time OG image generation
Copilot Jan 25, 2026
55774e8
Include generated OG images for Chromatic visual testing
Copilot Jan 25, 2026
807e5a7
Move OG images to gitignore as build artifacts
Copilot Jan 25, 2026
3dd31e2
Add Chromatic test for generated OG images
Copilot Jan 25, 2026
5d9e3f8
Move OG image tests to page.test.ts with individual tests per page
Copilot Jan 25, 2026
6d3577c
Simplify build script by inlining OG image generation
Copilot Jan 25, 2026
a40a06a
Merge branch 'main' into copilot/add-dynamic-generated-thumbs
abernier Jan 25, 2026
a5bb795
Refactor OG image generation to use Next.js native opengraph-image.tsx
Copilot Jan 26, 2026
1c91b58
Revert to external script approach - opengraph-image.tsx incompatible…
Copilot Jan 26, 2026
1ba0517
Fix broken OG image snapshots by ensuring images are copied to out/ d…
Copilot Jan 26, 2026
5ea3eae
Add scripts README documenting OG image generation process
Copilot Jan 26, 2026
263e891
Improve error handling in copy-og-images script
Copilot Jan 26, 2026
5ecbfa9
Fix broken OG image snapshots by using img tags instead of direct PNG…
Copilot Jan 26, 2026
e5cd050
Cleanup: remove copy-og-images script and simplify OG test template
Copilot Jan 26, 2026
d07ba60
Remove package-lock.json and simplify OG image template
Copilot Jan 26, 2026
96705a8
Skip responsive viewport tests for OG images
Copilot Jan 26, 2026
80266a9
Fix test.skip syntax error - remove unused browserName parameter
Copilot Jan 26, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@ out/
tmp/
temp/

# Generated OG images (build artifacts)
public/og/

tsconfig.tsbuildinfo

# Playwright
Expand All @@ -34,3 +37,4 @@ chromatic-archives/
*storybook.log
*archive.log
storybook-static
.env.local
6 changes: 4 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,9 @@
"tailwindcss": "^4.1.18",
"tailwindcss-animate": "^1.0.7",
"tw-animate-css": "^1.4.0",
"typescript": "^5.6.2"
"typescript": "^5.6.2",
"@vercel/og": "^0.6.3",
"tsx": "^4.19.0"
},
"dependencies": {
"@codesandbox/sandpack-react": "^2.20.0",
Expand Down Expand Up @@ -72,7 +74,7 @@
"scripts": {
"dev": "NODE_OPTIONS='--inspect' next",
"start": "next start",
"build": "next build",
"build": "tsx scripts/generate-og-images.mts && next build",
"format": "prettier -w src/",
"lint": "eslint src/**/*.{ts,tsx} && prettier . --check",
"prepare": "husky && (test -f scripts/copy-fonts.sh && sh scripts/copy-fonts.sh || true)",
Expand Down
Loading