Merge pull request #356 from storybookjs/fix-images-page-tabs

kylegach · web-flow · commit ffa9309c1f30 · 2025-11-24T15:05:18.000-07:00
Fix broken images in sub-pages
diff --git a/apps/frontpage/components/docs/mdx/img.tsx b/apps/frontpage/components/docs/mdx/img.tsx
@@ -15,9 +15,7 @@ interface ImgProps extends ImageProps {
 }
 
 export function Img({ src, alt, activeVersion }: ImgProps) {
-  const pathWithoutRoot = src
-    ?.replace('../../_assets/', '')
-    .replace('../_assets/', '');
+  const pathWithoutRoot = src?.replace(/^(?:\.\.\/)+_assets\//, '');
   const path = `/docs-assets/${activeVersion}/${pathWithoutRoot ?? ''}`;
   const localPath = `public${path}`;
 

Original file line number	Diff line number	Diff line change
`@@ -15,9 +15,7 @@ interface ImgProps extends ImageProps {`
`15`	`15`	`}`
`16`	`16`
`17`	`17`	`export function Img({ src, alt, activeVersion }: ImgProps) {`
`18`		`- const pathWithoutRoot = src`
`19`		`- ?.replace('../../_assets/', '')`
`20`		`- .replace('../_assets/', '');`
	`18`	`+ const pathWithoutRoot = src?.replace(/^(?:\.\.\/)+_assets\//, '');`
`21`	`19`	const path = `/docs-assets/${activeVersion}/${pathWithoutRoot ?? ''}`;
`22`	`20`	const localPath = `public${path}`;
`23`	`21`