fix(pages): remove incorrect publicPath prefix from absolute image paths (#428) (#438)

MarkdownRenderer.image computed a publicPath from window.location.pathname and prepended it to absolute image hrefs. On pages nested more than one level deep (e.g. /blog/introducing-ocr-blog), this produced broken URLs like /blog/images/blog/... resulting in 404s.

Since webpack publicPath is '/' (root deployment), absolute paths are already correct. Remove the publicPath computation and use href directly as src.

Closes #428

Author: Kunal jaiswal

pages/src/components/MarkdownRenderer.tsx

@@ -78,14 +78,12 @@ const MarkdownRenderer: React.FC<MarkdownRendererProps> = ({ content }) => {
   }, [toastVisible]);
 
   const html = useMemo(() => {
-    const publicPath = (window.location.pathname.replace(/\/[^/]*$/, '') || '').replace(/\/$/, '');
     // Custom renderer to generate heading IDs matching the TOC extraction logic
     const renderer = new Renderer();
     renderer.image = function ({ href, title, text }: { href: string; title?: string | null; text: string }) {
       const escapeAttr = (s: string) => s.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
-      const src = href.startsWith('/') ? `${publicPath}${href}` : href;
       const titleAttr = title ? ` title="${escapeAttr(title)}"` : '';
-      return `<img src="${escapeAttr(src)}" alt="${escapeAttr(text)}"${titleAttr} />`;
+      return `<img src="${escapeAttr(href)}" alt="${escapeAttr(text)}"${titleAttr} />`;
     };
     renderer.heading = function ({ text, depth }: { text: string; depth: number }) {
       const id = generateHeadingId(text);