diff hg-web/src/repo-browser.tsx @ 190:a2725419f988 hg-web

Updated so that bun builds will with already existing js files.
author MrJuneJune <me@mrjunejune.com>
date Sat, 24 Jan 2026 21:06:42 -0800
parents 32ce881452fa
children a06710325c30
line wrap: on
line diff
--- a/hg-web/src/repo-browser.tsx	Fri Jan 23 22:50:28 2026 -0800
+++ b/hg-web/src/repo-browser.tsx	Sat Jan 24 21:06:42 2026 -0800
@@ -1,7 +1,5 @@
-import React, { useState, useEffect } from 'react';
-import renderMarkdown from './markdown_to_html_bin.js';
-
-console.log(renderMarkdown);
+import React, { useState, useEffect, useRef } from 'react';
+import createMarkdownModule from 'markdown_converter/markdown_to_html_wasm/markdown_to_html_bin.js';
 
 // --- ICONS (Using CDN Links) ---
 const ICONS = {
@@ -273,7 +271,31 @@
 /**
  * Component: ReadmeViewer
  */
-function ReadmeViewer({ content }) {
+function ReadmeViewer({ content }: { content: string | null }) {
+  const contentRef = useRef<HTMLDivElement>(null);
+  const moduleRef = useRef<any>(null);
+  const [wasmReady, setWasmReady] = useState(false);
+
+  useEffect(() => {
+    createMarkdownModule().then((Module) => {
+      moduleRef.current = Module;
+      setWasmReady(true);
+    });
+  }, []);
+
+  useEffect(() => {
+    if (!content || !wasmReady || !contentRef.current || !moduleRef.current) return;
+
+    const Module = moduleRef.current;
+    const markdownToHtmlPtr = Module.cwrap('markdown_to_html', 'number', ['string']);
+    const markdownFree = Module.cwrap('markdown_free', null, ['number']);
+
+    const ptr = markdownToHtmlPtr(content);
+    const html = Module.UTF8ToString(ptr);
+    markdownFree(ptr);
+    contentRef.current.innerHTML = html;
+  }, [content, wasmReady]);
+
   if (!content) return null;
 
   return (
@@ -282,7 +304,9 @@
         <img src="https://img.icons8.com/material-outlined/24/000000/menu--v1.png" width="16" alt="" style={{opacity:0.5}} />
         README.md
       </div>
-      <div id="readmeContent"></div>
+      <div id="readmeContent" ref={contentRef}>
+        {!wasmReady && 'Loading...'}
+      </div>
     </div>
   );
 }
@@ -328,9 +352,12 @@
         : `${API_BASE}/list`;
       
       const response = await fetch(url);
-      const data = await response.json();
+      let data;
+      if (response.ok)
+        data = await response.json();
 
-      if (data.error) throw new Error(data.error);
+      if (data.error)
+        throw new Error(data.error);
       
       setContent({
         files: data.files || [],
@@ -345,16 +372,14 @@
   };
 
   const fetchReadme = async (path) => {
-    setReadme(null);
-    try {
-      const readmePath = path ? `${path}/README.md` : 'README.md';
-      const response = await fetch(`${API_BASE}/readme?path=${encodeURIComponent(readmePath)}`);
-      
-      if (response.ok) {
-        const text = await response.text();
-        setReadme(text);
-      }
-    } catch (err) { /* Silently fail */ }
+    const readmePath = path ? `${path}/README.md` : 'README.md';
+    const response = await fetch(`${API_BASE}/file?path=${encodeURIComponent(readmePath)}`);
+    console.log(response);
+    if (response.ok)
+    {
+      const text = await response.text();
+      setReadme(text);
+    }
   };
 
   return (