From bcb5b2df09cb8c8fc0736ec476b2486f9b4643be Mon Sep 17 00:00:00 2001
From: Emile Bangma <ewjbangma@hotmail.com>
Date: Mon, 04 Mar 2024 17:52:28 +0000
Subject: [PATCH] feat(frontmatter): configure max length for description (#946)

---
 quartz/components/renderPage.tsx |   72 +++++++++++++++++++++++++-----------
 1 files changed, 50 insertions(+), 22 deletions(-)

diff --git a/quartz/components/renderPage.tsx b/quartz/components/renderPage.tsx
index 36b0646..5394d6f 100644
--- a/quartz/components/renderPage.tsx
+++ b/quartz/components/renderPage.tsx
@@ -3,9 +3,11 @@
 import HeaderConstructor from "./Header"
 import BodyConstructor from "./Body"
 import { JSResourceToScriptElement, StaticResources } from "../util/resources"
-import { FullSlug, RelativeURL, joinSegments } from "../util/path"
+import { clone, FullSlug, RelativeURL, joinSegments, normalizeHastElement } from "../util/path"
 import { visit } from "unist-util-visit"
 import { Root, Element, ElementContent } from "hast"
+import { GlobalConfiguration } from "../cfg"
+import { i18n } from "../i18n"
 
 interface RenderComponents {
   head: QuartzComponent
@@ -22,7 +24,7 @@
   staticResources: StaticResources,
 ): StaticResources {
   const contentIndexPath = joinSegments(baseDir, "static/contentIndex.json")
-  const contentIndexScript = `const fetchData = fetch(\`${contentIndexPath}\`).then(data => data.json())`
+  const contentIndexScript = `const fetchData = fetch("${contentIndexPath}").then(data => data.json())`
 
   return {
     css: [joinSegments(baseDir, "index.css"), ...staticResources.css],
@@ -50,46 +52,52 @@
 }
 
 export function renderPage(
+  cfg: GlobalConfiguration,
   slug: FullSlug,
   componentData: QuartzComponentProps,
   components: RenderComponents,
   pageResources: StaticResources,
 ): string {
+  // make a deep copy of the tree so we don't remove the transclusion references
+  // for the file cached in contentMap in build.ts
+  const root = clone(componentData.tree) as Root
+
   // process transcludes in componentData
-  visit(componentData.tree as Root, "element", (node, _index, _parent) => {
+  visit(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 transcludeTarget = inner.properties?.["data-slug"] as FullSlug
-
-        // TODO: avoid this expensive find operation and construct an index ahead of time
+        const transcludeTarget = inner.properties["data-slug"] as FullSlug
         const page = componentData.allFiles.find((f) => f.slug === transcludeTarget)
         if (!page) {
           return
         }
 
-        let blockRef = node.properties?.dataBlock as string | undefined
-        if (blockRef?.startsWith("^")) {
+        let blockRef = node.properties.dataBlock as string | undefined
+        if (blockRef?.startsWith("#^")) {
           // block transclude
-          blockRef = blockRef.slice(1)
+          blockRef = blockRef.slice("#^".length)
           let blockNode = page.blocks?.[blockRef]
           if (blockNode) {
             if (blockNode.tagName === "li") {
               blockNode = {
                 type: "element",
                 tagName: "ul",
+                properties: {},
                 children: [blockNode],
               }
             }
 
             node.children = [
-              blockNode,
+              normalizeHastElement(blockNode, slug, transcludeTarget),
               {
                 type: "element",
                 tagName: "a",
-                properties: { href: inner.properties?.href, class: ["internal"] },
-                children: [{ type: "text", value: `Link to original` }],
+                properties: { href: inner.properties?.href, class: ["internal", "transclude-src"] },
+                children: [
+                  { type: "text", value: i18n(cfg.locale).components.transcludes.linkToOriginal },
+                ],
               },
             ]
           }
@@ -104,7 +112,7 @@
                 break
               }
 
-              if (startIdx) {
+              if (startIdx !== undefined) {
                 endIdx = i
               } else if (el.properties?.id === blockRef) {
                 startIdx = i
@@ -112,17 +120,21 @@
             }
           }
 
-          if (!startIdx) {
+          if (startIdx === undefined) {
             return
           }
 
           node.children = [
-            ...(page.htmlAst.children.slice(startIdx, endIdx) as ElementContent[]),
+            ...(page.htmlAst.children.slice(startIdx, endIdx) as ElementContent[]).map((child) =>
+              normalizeHastElement(child as Element, slug, transcludeTarget),
+            ),
             {
               type: "element",
               tagName: "a",
-              properties: { href: inner.properties?.href, class: ["internal"] },
-              children: [{ type: "text", value: `Link to original` }],
+              properties: { href: inner.properties?.href, class: ["internal", "transclude-src"] },
+              children: [
+                { type: "text", value: i18n(cfg.locale).components.transcludes.linkToOriginal },
+              ],
             },
           ]
         } else if (page.htmlAst) {
@@ -131,16 +143,28 @@
             {
               type: "element",
               tagName: "h1",
+              properties: {},
               children: [
-                { type: "text", value: page.frontmatter?.title ?? `Transclude of ${page.slug}` },
+                {
+                  type: "text",
+                  value:
+                    page.frontmatter?.title ??
+                    i18n(cfg.locale).components.transcludes.transcludeOf({
+                      targetSlug: page.slug!,
+                    }),
+                },
               ],
             },
-            ...(page.htmlAst.children as ElementContent[]),
+            ...(page.htmlAst.children as ElementContent[]).map((child) =>
+              normalizeHastElement(child as Element, slug, transcludeTarget),
+            ),
             {
               type: "element",
               tagName: "a",
-              properties: { href: inner.properties?.href, class: ["internal"] },
-              children: [{ type: "text", value: `Link to original` }],
+              properties: { href: inner.properties?.href, class: ["internal", "transclude-src"] },
+              children: [
+                { type: "text", value: i18n(cfg.locale).components.transcludes.linkToOriginal },
+              ],
             },
           ]
         }
@@ -148,6 +172,9 @@
     }
   })
 
+  // set componentData.tree to the edited html that has transclusions rendered
+  componentData.tree = root
+
   const {
     head: Head,
     header,
@@ -176,8 +203,9 @@
     </div>
   )
 
+  const lang = componentData.frontmatter?.lang ?? cfg.locale?.split("-")[0] ?? "en"
   const doc = (
-    <html>
+    <html lang={lang}>
       <Head {...componentData} />
       <body data-slug={slug}>
         <div id="quartz-root" class="page">

--
Gitblit v1.10.0