Attempt at fix of html loading

Author: Bouwmeester, Kevin

app/knowledge-hub/ECS/page.tsx

@@ -3,20 +3,39 @@ import Image from 'next/image';
 
 import Navbar from '../../components/Navbar';
 import Footer from '../../components/Footer';
-import html from '../../public/knowledge-hub/ECS/paper.html';
+
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import Script from 'next/script';
+
 import { KevinContact } from '@/app/person-constants';
+
 import ECSImage from '../../public/knowledge-hub/ECS/ECS.jpg'
 
-// const menuItems = [
-//   { name: 'SEiGS 2025', route: '../seigs25' },
-//   { name: 'Industrial Projects', route: '../industrial-projects' },
-//   { name: 'Academic Projects', route: '../projects' },
-//   { name: 'Positions', route: '../openings' },
-//   { name: 'Contact us', route: '../contacts' }
-// ];
 import { MENU_ITEMS as menuItems } from '../../constants';
 
-export default function Home() {
+
+// Prefix for where the assets live under /public
+const PUBLIC_PREFIX = '/knowledge-hub/ECS';
+
+async function loadHtml(): Promise<string> {
+  // Read the prebuilt HTML from /public
+  const filePath = path.join(process.cwd(), 'public', 'knowledge-hub', 'ECS', 'paper.html');
+  let html = await fs.readFile(filePath, 'utf8');
+
+  // --- Rewrite relative asset URLs so they work when embedded ---
+  // Matches src/href attributes that are relative (not starting with http(s)://, //, /, or #)
+  html = html.replace(
+    /\b(src|href)="'([^"']+)["']/gi,
+    (_m, attr, url) => `${attr}="${PUBLIC_PREFIX}/${url}"`
+  );
+
+  return html;
+}
+
+
+export default async function Home() {
+  const HTML = await loadHtml();
   return (
     <div>
       <Navbar menuItems={menuItems} pageSelected="" />
@@ -36,7 +55,7 @@ export default function Home() {
           <a href="https://doi.org/10.1016/j.simpat.2020.102243"> Vico: An entity-component-system based co-simulation framework</a>
 
           <main className="prose max-w-none">
-            <article dangerouslySetInnerHTML={{ __html: html }} />
+            <article dangerouslySetInnerHTML={{ __html: HTML }} />
           </main>
 
           {/* Contact Section */}