disable useeffecto for now

nextjs/src/services/htmlMarkdownUtils.ts

@@ -3,18 +3,40 @@ import { marked } from "marked";
 import * as DOMPurify from "isomorphic-dompurify";
 import { LocalCourseSettings } from "@/models/local/localCourseSettings";
 
-function extractImageSources(html: string) {
-  const parser = new DOMParser();
-  const doc = parser.parseFromString(html, "text/html");
-  const imgElements = doc.querySelectorAll("img");
-  const srcUrls = Array.from(imgElements).map((img) => img.src);
+export function extractImageSources(htmlString: string) {
+  const srcUrls = [];
+  const regex = /<img[^>]+src=["']?([^"'>]+)["']?/g;
+  let match;
+
+  while ((match = regex.exec(htmlString)) !== null) {
+    srcUrls.push(match[1]);
+  }
+
   return srcUrls;
 }
-
-function handleImages(html: string, settings: LocalCourseSettings) {
+export function convertImagesToCanvasImages(
+  html: string,
+  settings: LocalCourseSettings
+) {
   const imageSources = extractImageSources(html);
-  console.log(imageSources);
+  let mutableHtml = html;
+  // console.log(imageSources);
+
+  const imageLookup = settings.assets.reduce((acc, asset) => {
+    return { ...acc, [asset.sourceUrl]: asset.canvasUrl };
+  }, {} as { [key: string]: string });
+
+  for (const imageSrc of imageSources) {
+    const destinationUrl = imageLookup[imageSrc];
+    if (typeof destinationUrl === "undefined") {
+      throw `cannot convert to html, no canvas url for  ${imageSrc} in settings`;
+    }
+    mutableHtml = mutableHtml.replaceAll(imageSrc, destinationUrl);
+  }
+  // console.log(imageSources, imageLookup, mutableHtml);
+  return mutableHtml;
 }
+
 export function markdownToHTMLSafe(
   markdownString: string,
   settings: LocalCourseSettings
@@ -22,6 +44,13 @@ export function markdownToHTMLSafe(
   const clean = DOMPurify.sanitize(
     marked.parse(markdownString, { async: false, pedantic: false, gfm: true })
   );
-  handleImages(clean, settings);
+  return convertImagesToCanvasImages(clean, settings);
+  // return clean;
+}
+
+export function markdownToHtmlNoImages(markdownString: string) {
+  const clean = DOMPurify.sanitize(
+    marked.parse(markdownString, { async: false, pedantic: false, gfm: true })
+  );
   return clean;
 }