/home/mrjunejune/zenbu: hg-web/src/repo-browser.tsx comparison

comparison 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

comparison

equal deleted inserted replaced

-:32ce881452fa
+:a2725419f988
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
-import renderMarkdown from './markdown_to_html_bin.js';
+import createMarkdownModule from 'markdown_converter/markdown_to_html_wasm/markdown_to_html_bin.js';
-console.log(renderMarkdown);
 // --- ICONS (Using CDN Links) ---
 const ICONS = {
 folder: "https://cdn-icons-png.flaticon.com/512/11471/11471391.png",
 file: "https://raw.githubusercontent.com/PKief/vscode-material-icon-theme/main/icons/document.svg",
 }
 /**
 * 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 (
 <div id="readmeSection">
 <div className="readme-header">
 <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>
 );
 }
 /**
 const url = path
 ? `${API_BASE}/list?path=${encodeURIComponent(path)}`
 : `${API_BASE}/list`;
 const response = await fetch(url);
-const data = await response.json();
+let data;
+if (response.ok)
-if (data.error) throw new Error(data.error);
+data = await response.json();
+if (data.error)
+throw new Error(data.error);
 setContent({
 files: data.files || [],
 directories: data.directories || []
 });
 setLoading(false);
 }
 };
 const fetchReadme = async (path) => {
-setReadme(null);
+const readmePath = path ? `${path}/README.md` : 'README.md';
-try {
+const response = await fetch(`${API_BASE}/file?path=${encodeURIComponent(readmePath)}`);
-const readmePath = path ? `${path}/README.md` : 'README.md';
+console.log(response);
-const response = await fetch(`${API_BASE}/readme?path=${encodeURIComponent(readmePath)}`);
+if (response.ok)
+{
-if (response.ok) {
+const text = await response.text();
-const text = await response.text();
+setReadme(text);
-setReadme(text);
+}
-}
-} catch (err) { /* Silently fail */ }
 };
 return (
 <>
 <GlobalStyles />

Mercurial

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