Export with share theme (#5830)

Author: eliandoran

apps/client/src/share.ts

@@ -9,16 +9,6 @@ async function ensureJQuery() {
     (window as any).$ = $;
 }
 
-async function applyMath() {
-    const anyMathBlock = document.querySelector("#content .math-tex");
-    if (!anyMathBlock) {
-        return;
-    }
-
-    const renderMathInElement = (await import("./services/math.js")).renderMathInElement;
-    renderMathInElement(document.getElementById("content"));
-}
-
 async function formatCodeBlocks() {
     const anyCodeBlock = document.querySelector("#content pre");
     if (!anyCodeBlock) {
@@ -31,54 +21,4 @@ async function formatCodeBlocks() {
 
 async function setupTextNote() {
     formatCodeBlocks();
-    applyMath();
-
-    const setupMermaid = (await import("./share/mermaid.js")).default;
-    setupMermaid();
-}
-
-/**
- * Fetch note with given ID from backend
- *
- * @param noteId of the given note to be fetched. If false, fetches current note.
- */
-async function fetchNote(noteId: string | null = null) {
-    if (!noteId) {
-        noteId = document.body.getAttribute("data-note-id");
-    }
-
-    const resp = await fetch(`api/notes/${noteId}`);
-
-    return await resp.json();
 }
-
-document.addEventListener(
-    "DOMContentLoaded",
-    () => {
-        const noteType = determineNoteType();
-
-        if (noteType === "text") {
-            setupTextNote();
-        }
-
-        const toggleMenuButton = document.getElementById("toggleMenuButton");
-        const layout = document.getElementById("layout");
-
-        if (toggleMenuButton && layout) {
-            toggleMenuButton.addEventListener("click", () => layout.classList.toggle("showMenu"));
-        }
-    },
-    false
-);
-
-function determineNoteType() {
-    const bodyClass = document.body.className;
-    const match = bodyClass.match(/type-([^\s]+)/);
-    return match ? match[1] : null;
-}
-
-// workaround to prevent webpack from removing "fetchNote" as dead code:
-// add fetchNote as property to the window object
-Object.defineProperty(window, "fetchNote", {
-    value: fetchNote
-});

apps/client/src/translations/en/translation.json

@@ -104,7 +104,8 @@
     "export_status": "Export status",
     "export_in_progress": "Export in progress: {{progressCount}}",
     "export_finished_successfully": "Export finished successfully.",
-    "format_pdf": "PDF - for printing or sharing purposes."
+    "format_pdf": "PDF - for printing or sharing purposes.",
+    "share-format": "HTML for web publishing - uses the same theme that is used shared notes, but can be published as a static website."
   },
   "help": {
     "title": "Cheatsheet",

apps/client/src/widgets/dialogs/export.tsx

@@ -79,7 +79,8 @@ export default function ExportDialog() {
                         values={[
                             { value: "html", label: t("export.format_html_zip") },
                             { value: "markdown", label: t("export.format_markdown") },
-                            { value: "opml", label: t("export.format_opml") }
+                            { value: "opml", label: t("export.format_opml") },
+                            { value: "share", label: t("export.share-format") }
                         ]}
                     />
 

apps/desktop/scripts/build.ts

@@ -11,6 +11,7 @@ async function main() {
     // Copy assets.
     build.copy("src/assets", "assets/");
     build.copy("/apps/server/src/assets", "assets/");
+    build.triggerBuildAndCopyTo("packages/share-theme", "share-theme/assets/");
     build.copy("/packages/share-theme/src/templates", "share-theme/templates/");
 
     // Copy node modules dependencies

apps/edit-docs/src/edit-docs.ts

@@ -6,7 +6,7 @@ import { initializeTranslations } from "@triliumnext/server/src/services/i18n.js
 import debounce from "@triliumnext/client/src/services/debounce.js";
 import { extractZip, importData, initializeDatabase, startElectron } from "./utils.js";
 import cls from "@triliumnext/server/src/services/cls.js";
-import type { AdvancedExportOptions } from "@triliumnext/server/src/services/export/zip.js";
+import type { AdvancedExportOptions, ExportFormat } from "@triliumnext/server/src/services/export/zip/abstract_provider.js";
 import { parseNoteMetaFile } from "@triliumnext/server/src/services/in_app_help.js";
 import type NoteMeta from "@triliumnext/server/src/services/meta/note_meta.js";
 
@@ -75,7 +75,7 @@ async function setOptions() {
     optionsService.setOption("compressImages", "false");
 }
 
-async function exportData(noteId: string, format: "html" | "markdown", outputPath: string, ignoredFiles?: Set<string>) {
+async function exportData(noteId: string, format: ExportFormat, outputPath: string, ignoredFiles?: Set<string>) {
     const zipFilePath = "output.zip";
 
     try {

apps/server/package.json

@@ -36,6 +36,7 @@
     "@triliumnext/commons": "workspace:*",
     "@triliumnext/express-partial-content": "workspace:*",
     "@triliumnext/turndown-plugin-gfm": "workspace:*",
+    "@triliumnext/highlightjs": "workspace:*",
     "@types/archiver": "7.0.0",
     "@types/better-sqlite3": "7.6.13",
     "@types/cls-hooked": "4.3.9",

apps/server/scripts/build.ts

@@ -7,6 +7,7 @@ async function main() {
 
     // Copy assets
     build.copy("src/assets", "assets/");
+    build.triggerBuildAndCopyTo("packages/share-theme", "share-theme/assets/");
     build.copy("/packages/share-theme/src/templates", "share-theme/templates/");
 
     // Copy node modules dependencies

apps/server/src/becca/entities/bbranch.ts

@@ -278,6 +278,11 @@ class BBranch extends AbstractBeccaEntity<BBranch> {
             });
         }
     }
+
+    getParentNote() {
+        return this.parentNote;
+    }
+
 }
 
 export default BBranch;

apps/server/src/becca/entities/bnote.ts

@@ -1758,6 +1758,26 @@ class BNote extends AbstractBeccaEntity<BNote> {
         return childBranches;
     }
 
+    get encodedTitle() {
+        return encodeURIComponent(this.title);
+    }
+
+    getVisibleChildBranches() {
+        return this.getChildBranches().filter((branch) => !branch.getNote().isLabelTruthy("shareHiddenFromTree"));
+    }
+
+    getVisibleChildNotes() {
+        return this.getVisibleChildBranches().map((branch) => branch.getNote());
+    }
+
+    hasVisibleChildren() {
+        return this.getVisibleChildNotes().length > 0;
+    }
+
+    get shareId() {
+        return this.noteId;
+    }
+
     /**
      * Return an attribute by it's attributeId.  Requires the attribute cache to be available.
      * @param attributeId - the id of the attribute owned by this note

apps/server/src/etapi/notes.ts

@@ -14,6 +14,7 @@ import type { ParsedQs } from "qs";
 import type { NoteParams } from "../services/note-interface.js";
 import type { SearchParams } from "../services/search/services/types.js";
 import type { ValidatorMap } from "./etapi-interface.js";
+import type { ExportFormat } from "../services/export/zip/abstract_provider.js";
 
 function register(router: Router) {
     eu.route(router, "get", "/etapi/notes", (req, res, next) => {
@@ -149,8 +150,8 @@ function register(router: Router) {
         const note = eu.getAndCheckNote(req.params.noteId);
         const format = req.query.format || "html";
 
-        if (typeof format !== "string" || !["html", "markdown"].includes(format)) {
-            throw new eu.EtapiError(400, "UNRECOGNIZED_EXPORT_FORMAT", `Unrecognized export format '${format}', supported values are 'html' (default) or 'markdown'.`);
+        if (typeof format !== "string" || !["html", "markdown", "share"].includes(format)) {
+            throw new eu.EtapiError(400, "UNRECOGNIZED_EXPORT_FORMAT", `Unrecognized export format '${format}', supported values are 'html' (default), 'markdown' or 'share'.`);
         }
 
         const taskContext = new TaskContext("no-progress-reporting", "export", null);
@@ -159,7 +160,7 @@ function register(router: Router) {
         // (e.g. branchIds are not seen in UI), that we export "note export" instead.
         const branch = note.getParentBranches()[0];
 
-        zipExportService.exportToZip(taskContext, branch, format as "html" | "markdown", res);
+        zipExportService.exportToZip(taskContext, branch, format as ExportFormat, res);
     });
 
     eu.route(router, "post", "/etapi/notes/:noteId/import", (req, res, next) => {