Skip to content

Commit b833f87

Browse files
jaysooclaude
andauthored
fix(nx-dev): fix Open Graph image 404s (#32360)
Open Graph images on nx.dev are returning 404 errors for several pages: - `/ai-chat` and `/changelog` reference non-existent `/images/nx-media.jpg` - `/extending-nx` references non-existent `/images/open-graph/extending-nx.jpg` - Pages with anchors have broken og:image URLs All pages should have working Open Graph images for proper social media sharing. Fixes DOC-98 🤖 Generated with [Claude Code](https://claude.ai/code) Co-authored-by: Claude <noreply@anthropic.com>
1 parent 34e1bad commit b833f87

4 files changed

Lines changed: 26 additions & 8 deletions

File tree

nx-dev/feature-doc-viewer/src/lib/doc-viewer.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@ export function DocViewer({
2424
widgetData: { githubStarsCount: number };
2525
}): JSX.Element {
2626
const router = useRouter();
27-
const [currentPath, setCurrentPath] = useState<string>('');
28-
const [basePath, setBasePath] = useState<string>('');
27+
const [currentPath, setCurrentPath] = useState<string>(router.asPath);
28+
const [basePath, setBasePath] = useState<string>(router.basePath);
2929

3030
useEffect(() => {
3131
setCurrentPath(router.asPath);
@@ -91,8 +91,10 @@ export function DocViewer({
9191
images: [
9292
{
9393
url: `https://nx.dev/images/open-graph/${currentPath
94-
.replace('/', '')
95-
.replace(/\//gi, '-')}.${
94+
.split('#')[0]
95+
.split('?')[0]
96+
.replace(/^\//, '')
97+
.replace(/\//g, '-')}.${
9698
vm.mediaImage ? getExtension(vm.mediaImage) : 'jpg'
9799
}`,
98100
width: 1600,

nx-dev/nx-dev/pages/_app.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,11 +38,11 @@ export default function CustomApp({
3838
'An AI-first build platform that connects everything from your editor to CI. Helping you deliver fast, without breaking things.',
3939
images: [
4040
{
41-
url: 'https://nx.dev/images/nx-media.jpg',
41+
url: 'https://nx.dev/socials/nx-media.png',
4242
width: 800,
4343
height: 421,
4444
alt: 'Nx: Smart Repos · Fast Builds',
45-
type: 'image/jpeg',
45+
type: 'image/png',
4646
},
4747
],
4848
siteName: 'Nx',

nx-dev/nx-dev/pages/ai-chat/index.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,22 @@ export default function AiDocs(): JSX.Element {
2222
maxImagePreview: 'none',
2323
maxVideoPreview: -1,
2424
}}
25+
openGraph={{
26+
url: 'https://nx.dev/ai-chat',
27+
title: 'Nx AI Chat',
28+
description: 'AI chat powered by Nx docs.',
29+
images: [
30+
{
31+
url: 'https://nx.dev/socials/nx-media.png',
32+
width: 800,
33+
height: 421,
34+
alt: 'Nx: Smart Repos · Fast Builds',
35+
type: 'image/png',
36+
},
37+
],
38+
siteName: 'Nx',
39+
type: 'website',
40+
}}
2541
/>
2642
<div
2743
id="shell"

nx-dev/nx-dev/pages/changelog.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -207,11 +207,11 @@ export default function Changelog(props: ChangeLogProps): JSX.Element {
207207
description: 'Learn about all the changes',
208208
images: [
209209
{
210-
url: 'https://nx.dev/images/nx-media.jpg',
210+
url: 'https://nx.dev/socials/nx-media.png',
211211
width: 800,
212212
height: 421,
213213
alt: 'Nx: Smart Repos · Fast Builds',
214-
type: 'image/jpeg',
214+
type: 'image/png',
215215
},
216216
],
217217
siteName: 'Nx',

0 commit comments

Comments
 (0)