From 14cbbdb8a2f69ebc51cd53a82b50206c543778b0 Mon Sep 17 00:00:00 2001
From: Oskar Manhart <52569953+oskardotglobal@users.noreply.github.com>
Date: Thu, 14 Sep 2023 03:55:59 +0000
Subject: [PATCH] feat: display tag in graph view (#466)

---
 quartz/components/renderPage.tsx |   58 ++++++++++++++++++++++++++++++++++++++++++++++++----------
 1 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/quartz/components/renderPage.tsx b/quartz/components/renderPage.tsx
index ab93709..451813b 100644
--- a/quartz/components/renderPage.tsx
+++ b/quartz/components/renderPage.tsx
@@ -2,8 +2,10 @@
 import { QuartzComponent, QuartzComponentProps } from "./types"
 import HeaderConstructor from "./Header"
 import BodyConstructor from "./Body"
-import { JSResourceToScriptElement, StaticResources } from "../resources"
-import { CanonicalSlug, pathToRoot } from "../path"
+import { JSResourceToScriptElement, StaticResources } from "../util/resources"
+import { FullSlug, RelativeURL, joinSegments } from "../util/path"
+import { visit } from "unist-util-visit"
+import { Root, Element } from "hast"
 
 interface RenderComponents {
   head: QuartzComponent
@@ -16,18 +18,20 @@
 }
 
 export function pageResources(
-  slug: CanonicalSlug,
+  baseDir: FullSlug | RelativeURL,
   staticResources: StaticResources,
 ): StaticResources {
-  const baseDir = pathToRoot(slug)
-
-  const contentIndexPath = baseDir + "/static/contentIndex.json"
+  const contentIndexPath = joinSegments(baseDir, "static/contentIndex.json")
   const contentIndexScript = `const fetchData = fetch(\`${contentIndexPath}\`).then(data => data.json())`
 
   return {
-    css: [baseDir + "/index.css", ...staticResources.css],
+    css: [joinSegments(baseDir, "index.css"), ...staticResources.css],
     js: [
-      { src: baseDir + "/prescript.js", loadTime: "beforeDOMReady", contentType: "external" },
+      {
+        src: joinSegments(baseDir, "prescript.js"),
+        loadTime: "beforeDOMReady",
+        contentType: "external",
+      },
       {
         loadTime: "beforeDOMReady",
         contentType: "inline",
@@ -36,7 +40,7 @@
       },
       ...staticResources.js,
       {
-        src: baseDir + "/postscript.js",
+        src: joinSegments(baseDir, "postscript.js"),
         loadTime: "afterDOMReady",
         moduleType: "module",
         contentType: "external",
@@ -46,11 +50,45 @@
 }
 
 export function renderPage(
-  slug: CanonicalSlug,
+  slug: FullSlug,
   componentData: QuartzComponentProps,
   components: RenderComponents,
   pageResources: StaticResources,
 ): string {
+  // process transcludes in componentData
+  visit(componentData.tree as Root, "element", (node, _index, _parent) => {
+    if (node.tagName === "blockquote") {
+      const classNames = (node.properties?.className ?? []) as string[]
+      if (classNames.includes("transclude")) {
+        const inner = node.children[0] as Element
+        const blockSlug = inner.properties?.["data-slug"] as FullSlug
+        const blockRef = node.properties!.dataBlock as string
+
+        // TODO: avoid this expensive find operation and construct an index ahead of time
+        let blockNode = componentData.allFiles.find((f) => f.slug === blockSlug)?.blocks?.[blockRef]
+        if (blockNode) {
+          if (blockNode.tagName === "li") {
+            blockNode = {
+              type: "element",
+              tagName: "ul",
+              children: [blockNode],
+            }
+          }
+
+          node.children = [
+            blockNode,
+            {
+              type: "element",
+              tagName: "a",
+              properties: { href: inner.properties?.href, class: ["internal"] },
+              children: [{ type: "text", value: `Link to original` }],
+            },
+          ]
+        }
+      }
+    }
+  })
+
   const {
     head: Head,
     header,

--
Gitblit v1.10.0