From 2525bfbab5553f970997ea3c60af180cbef1fdd2 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Thu, 07 Sep 2023 05:24:15 +0000
Subject: [PATCH] fix: links to index not showing in graph (closes #450)

---
 quartz/plugins/transformers/ofm.ts |   90 ++++++++++++++++++++++----------------------
 1 files changed, 45 insertions(+), 45 deletions(-)

diff --git a/quartz/plugins/transformers/ofm.ts b/quartz/plugins/transformers/ofm.ts
index fc56f3f..8c8da67 100644
--- a/quartz/plugins/transformers/ofm.ts
+++ b/quartz/plugins/transformers/ofm.ts
@@ -6,10 +6,10 @@
 import rehypeRaw from "rehype-raw"
 import { visit } from "unist-util-visit"
 import path from "path"
-import { JSResource } from "../../resources"
+import { JSResource } from "../../util/resources"
 // @ts-ignore
 import calloutScript from "../../components/scripts/callout.inline.ts"
-import { FilePath, canonicalizeServer, pathToRoot, slugTag, slugifyFilePath } from "../../path"
+import { FilePath, pathToRoot, slugTag, slugifyFilePath } from "../../util/path"
 import { toHast } from "mdast-util-to-hast"
 import { toHtml } from "hast-util-to-html"
 import { PhrasingContent } from "mdast-util-find-and-replace/lib"
@@ -109,14 +109,16 @@
 // (#[^\[\]\|\#]+)? -> # then one or more non-special characters (heading link)
 // (|[^\[\]\|\#]+)? -> | then one or more non-special characters (alias)
 const wikilinkRegex = new RegExp(/!?\[\[([^\[\]\|\#]+)?(#[^\[\]\|\#]+)?(\|[^\[\]\|\#]+)?\]\]/, "g")
-const highlightRegex = new RegExp(/==(.+)==/, "g")
+const highlightRegex = new RegExp(/==([^=]+)==/, "g")
 const commentRegex = new RegExp(/%%(.+)%%/, "g")
 // from https://github.com/escwxyz/remark-obsidian-callout/blob/main/src/index.ts
 const calloutRegex = new RegExp(/^\[\!(\w+)\]([+-]?)/)
 const calloutLineRegex = new RegExp(/^> *\[\!\w+\][+-]?.*$/, "gm")
-// (?:^| )   -> non-capturing group, tag should start be separated by a space or be the start of the line
-// #(\w+)    -> tag itself is # followed by a string of alpha-numeric characters
-const tagRegex = new RegExp(/(?:^| )#([\w-_\/]+)/, "g")
+// (?:^| )              -> non-capturing group, tag should start be separated by a space or be the start of the line
+// #(...)               -> capturing group, tag itself must start with #
+// (?:[-_\p{L}])+       -> non-capturing group, non-empty string of (Unicode-aware) alpha-numeric characters, hyphens and/or underscores
+// (?:\/[-_\p{L}]+)*)   -> non-capturing group, matches an arbitrary number of tag strings separated by "/"
+const tagRegex = new RegExp(/(?:^| )#((?:[-_\p{L}\d])+(?:\/[-_\p{L}\d]+)*)/, "gu")
 
 export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options> | undefined> = (
   userOpts,
@@ -129,29 +131,29 @@
   }
   const findAndReplace = opts.enableInHtmlEmbed
     ? (tree: Root, regex: RegExp, replace?: Replace | null | undefined) => {
-      if (replace) {
-        visit(tree, "html", (node: HTML) => {
-          if (typeof replace === "string") {
-            node.value = node.value.replace(regex, replace)
-          } else {
-            node.value = node.value.replaceAll(regex, (substring: string, ...args) => {
-              const replaceValue = replace(substring, ...args)
-              if (typeof replaceValue === "string") {
-                return replaceValue
-              } else if (Array.isArray(replaceValue)) {
-                return replaceValue.map(mdastToHtml).join("")
-              } else if (typeof replaceValue === "object" && replaceValue !== null) {
-                return mdastToHtml(replaceValue)
-              } else {
-                return substring
-              }
-            })
-          }
-        })
-      }
+        if (replace) {
+          visit(tree, "html", (node: HTML) => {
+            if (typeof replace === "string") {
+              node.value = node.value.replace(regex, replace)
+            } else {
+              node.value = node.value.replaceAll(regex, (substring: string, ...args) => {
+                const replaceValue = replace(substring, ...args)
+                if (typeof replaceValue === "string") {
+                  return replaceValue
+                } else if (Array.isArray(replaceValue)) {
+                  return replaceValue.map(mdastToHtml).join("")
+                } else if (typeof replaceValue === "object" && replaceValue !== null) {
+                  return mdastToHtml(replaceValue)
+                } else {
+                  return substring
+                }
+              })
+            }
+          })
+        }
 
-      mdastFindReplace(tree, regex, replace)
-    }
+        mdastFindReplace(tree, regex, replace)
+      }
     : mdastFindReplace
 
   return {
@@ -196,7 +198,7 @@
               // embed cases
               if (value.startsWith("!")) {
                 const ext: string = path.extname(fp).toLowerCase()
-                const url = slugifyFilePath(fp as FilePath) + ext
+                const url = slugifyFilePath(fp as FilePath)
                 if ([".png", ".jpg", ".jpeg", ".gif", ".bmp", ".svg"].includes(ext)) {
                   const dims = alias ?? ""
                   let [width, height] = dims.split("x", 2)
@@ -294,7 +296,7 @@
               }
 
               const text = firstChild.children[0].value
-              const restChildren = firstChild.children.splice(1)
+              const restChildren = firstChild.children.slice(1)
               const [firstLine, ...remainingLines] = text.split("\n")
               const remainingText = remainingLines.join("\n")
 
@@ -309,11 +311,8 @@
                 const titleContent =
                   match.input.slice(calloutDirective.length).trim() || capitalize(calloutType)
                 const titleNode: Paragraph = {
-                  type: 'paragraph',
-                  children: [
-                    {type: 'text', value: titleContent + " "},
-                    ...restChildren
-                  ]
+                  type: "paragraph",
+                  children: [{ type: "text", value: titleContent + " " }, ...restChildren],
                 }
                 const title = mdastToHtml(titleNode)
 
@@ -323,7 +322,7 @@
 
                 const titleHtml: HTML = {
                   type: "html",
-                  value: `<div 
+                  value: `<div
                   class="callout-title"
                 >
                   <div class="callout-icon">${callouts[calloutType]}</div>
@@ -352,8 +351,9 @@
                 node.data = {
                   hProperties: {
                     ...(node.data?.hProperties ?? {}),
-                    className: `callout ${collapse ? "is-collapsible" : ""} ${defaultState === "collapsed" ? "is-collapsed" : ""
-                      }`,
+                    className: `callout ${collapse ? "is-collapsible" : ""} ${
+                      defaultState === "collapsed" ? "is-collapsed" : ""
+                    }`,
                     "data-callout": calloutType,
                     "data-callout-fold": collapse,
                   },
@@ -383,16 +383,16 @@
       if (opts.parseTags) {
         plugins.push(() => {
           return (tree: Root, file) => {
-            const slug = canonicalizeServer(file.data.slug!)
-            const base = pathToRoot(slug)
-            findAndReplace(tree, tagRegex, (value: string, tag: string) => {
-              if (file.data.frontmatter) {
+            const base = pathToRoot(file.data.slug!)
+            findAndReplace(tree, tagRegex, (_value: string, tag: string) => {
+              tag = slugTag(tag)
+              if (file.data.frontmatter && !file.data.frontmatter.tags.includes(tag)) {
                 file.data.frontmatter.tags.push(tag)
               }
 
               return {
                 type: "link",
-                url: base + `/tags/${slugTag(tag)}`,
+                url: base + `/tags/${tag}`,
                 data: {
                   hProperties: {
                     className: ["tag-link"],
@@ -401,7 +401,7 @@
                 children: [
                   {
                     type: "text",
-                    value,
+                    value: `#${tag}`,
                   },
                 ],
               }
@@ -431,7 +431,7 @@
           script: `
           import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
           const darkMode = document.documentElement.getAttribute('saved-theme') === 'dark'
-          mermaid.initialize({ 
+          mermaid.initialize({
             startOnLoad: false,
             securityLevel: 'loose',
             theme: darkMode ? 'dark' : 'default'

--
Gitblit v1.10.0