Generate base user website via template directory

web-app/.gitignore

@@ -1,5 +1,6 @@
 node_modules
 user-uploads
+user-websites
 
 # Output
 .output

web-app/src/lib/components/WebsiteEditor.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
   import type { Snippet } from "svelte";
-  import markdownit from "markdown-it";
-  import hljs from "highlight.js";
+  import { md } from "$lib/utils";
 
   const {
     id,
@@ -16,20 +15,6 @@
     fullPreview?: boolean;
     previewContent: string;
   }>();
-
-  const md = markdownit({
-    linkify: true,
-    typographer: true,
-    highlight: (str, lang) => {
-      if (lang && hljs.getLanguage(lang)) {
-        try {
-          return hljs.highlight(str, { language: lang }).value;
-        } catch (_) {}
-      }
-
-      return "";
-    }
-  });
 </script>
 
 <div class="operations">
@@ -46,7 +31,10 @@
 
 <div class="preview">
   {#if fullPreview}
-    <iframe src={previewContent} title="Preview"></iframe>
+    <iframe
+      src="http://localhost:5173/user-websites/e6710116-f2b7-4318-82de-35a25d22ed2e/0015130f-3024-402b-8421-aaee4a6f0890/index.html"
+      title="Preview"
+    ></iframe>
   {:else}
     {@html md.render(previewContent)}
   {/if}

web-app/src/lib/utils.ts

@@ -1,3 +1,6 @@
+import markdownit from "markdown-it";
+import hljs from "highlight.js";
+
 export const sortOptions = [
   { value: "creation-time", text: "Creation time" },
   { value: "last-modified", text: "Last modified" },
@@ -6,3 +9,17 @@ export const sortOptions = [
 ];
 
 export const ALLOWED_MIME_TYPES = ["image/jpeg", "image/png", "image/svg+xml", "image/webp"];
+
+export const md = markdownit({
+  linkify: true,
+  typographer: true,
+  highlight: (str, lang) => {
+    if (lang && hljs.getLanguage(lang)) {
+      try {
+        return hljs.highlight(str, { language: lang }).value;
+      } catch (_) {}
+    }
+
+    return "";
+  }
+});

web-app/src/routes/(authenticated)/website/[websiteId]/publish/+page.server.ts

@@ -1,12 +1,60 @@
-import { randomUUID } from "node:crypto";
-import { mkdir, writeFile } from "node:fs/promises";
-import { extname, join, relative } from "node:path";
+import { readFile, mkdir, writeFile } from "node:fs/promises";
+import { join } from "node:path";
+import { md } from "$lib/utils";
 
-export const load = async ({ parent }) => {
-  const { website } = await parent();
+export const load = async ({ params, fetch, cookies, locals }) => {
+  const websiteOverviewData = await fetch(
+    `http://localhost:3000/website_overview?id=eq.${params.websiteId}`,
+    {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${cookies.get("session_token")}`,
+        Accept: "application/vnd.pgrst.object+json"
+      }
+    }
+  );
+
+  const websiteOverview = await websiteOverviewData.json();
+
+  const templatePath = join(
+    process.cwd(),
+    "..",
+    "templates",
+    websiteOverview.content_type.toLowerCase()
+  );
+
+  const indexFile = await readFile(join(templatePath, "index.html"), { encoding: "utf-8" });
+  const articleFileContents = await readFile(join(templatePath, "article.html"), {
+    encoding: "utf-8"
+  });
+
+  const indexFileContents = indexFile
+    .replace("{{title}}", `<h1>${websiteOverview.title}</h1>`)
+    .replace("{{main_content}}", md.render(websiteOverview.main_content))
+    .replace("{{additional_text}}", md.render(websiteOverview.additional_text));
+
+  const uploadDir = join(
+    process.cwd(),
+    "static",
+    "user-websites",
+    locals.user.id,
+    params.websiteId
+  );
+  await mkdir(uploadDir, { recursive: true });
+
+  await writeFile(join(uploadDir, "index.html"), indexFileContents);
+
+  await mkdir(join(uploadDir, "articles"), { recursive: true });
+
+  for (const article of websiteOverview.articles) {
+    const articleFileName = article.title.toLowerCase().split(" ").join("-");
+
+    await writeFile(join(uploadDir, "articles", `${articleFileName}.html`), articleFileContents);
+  }
 
   return {
-    website
+    websiteOverview
   };
 };