rss + sitemap

quartz/cfg.ts

@@ -3,12 +3,17 @@ import { PluginTypes } from "./plugins/types"
 import { Theme } from "./theme"
 
 export interface GlobalConfiguration {
+  pageTitle: string,
   /** Whether to enable single-page-app style rendering. this prevents flashes of unstyled content and improves smoothness of Quartz */
   enableSPA: boolean,
   /** Whether to display Wikipedia-style popovers when hovering over links */
   enablePopovers: boolean,
   /** Glob patterns to not search */
   ignorePatterns: string[],
+  /** Base URL to use for CNAME files, sitemaps, and RSS feeds that require an absolute URL.
+  *   Quartz will avoid using this as much as possible and use relative URLs most of the time  
+  */
+  canonicalUrl?: string,
   theme: Theme
 }
 

quartz/components/PageTitle.tsx

@@ -1,22 +1,17 @@
 import { resolveToRoot } from "../path"
 import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
 
-interface Options {
-  title: string
+function PageTitle({ fileData, cfg }: QuartzComponentProps) {
+  const title = cfg?.pageTitle ?? "Untitled Quartz"
+  const slug = fileData.slug!
+  const baseDir = resolveToRoot(slug)
+  return <h1 class="page-title"><a href={baseDir}>{title}</a></h1>
 }
 
-export default ((opts?: Options) => {
-  const title = opts?.title ?? "Untitled Quartz"
-  function PageTitle({ fileData }: QuartzComponentProps) {
-    const slug = fileData.slug!
-    const baseDir = resolveToRoot(slug)
-    return <h1 class="page-title"><a href={baseDir}>{title}</a></h1>
-  }
-  PageTitle.css = `
-  .page-title {
-    margin: 0;
-  }
-  `
+PageTitle.css = `
+.page-title {
+  margin: 0;
+}
+`
 
-  return PageTitle
-}) satisfies QuartzComponentConstructor
+export default (() => PageTitle) satisfies QuartzComponentConstructor

quartz/path.ts

@@ -27,6 +27,9 @@ export function slugify(s: string): string {
 // resolve /a/b/c to ../../
 export function resolveToRoot(slug: string): string {
   let fp = trimPathSuffix(slug)
+  if (fp.endsWith("index")) {
+    fp = fp.slice(0, -"index".length)
+  }
 
   if (fp === "") {
     return "."

quartz/plugins/emitters/cname.ts

@@ -1,25 +0,0 @@
-import { QuartzEmitterPlugin } from "../types"
-
-interface Options {
-  domain: string
-}
-
-export const CNAME: QuartzEmitterPlugin<Options> = (opts?: Options) => ({
-  name: "CNAME",
-  getQuartzComponents() {
-    return []
-  },
-  async emit(_contentFolder, _cfg, _content, _resources, emit): Promise<string[]> {
-    const slug = "CNAME"
-
-    if (opts?.domain) {
-      await emit({
-        content: opts?.domain,
-        slug,
-        ext: "",
-      })
-    }
-
-    return ["CNAME"]
-  }
-})

quartz/plugins/emitters/contentIndex.ts

@@ -1,37 +1,120 @@
+import { GlobalConfiguration } from "../../cfg"
 import { QuartzEmitterPlugin } from "../types"
 import path from "path"
 
 export type ContentIndex = Map<string, ContentDetails>
 export type ContentDetails = {
   title: string,
-  links?: string[],
-  tags?: string[],
+  links: string[],
+  tags: string[],
   content: string,
+  date?: Date,
+  description?: string,
 }
 
-export const ContentIndex: QuartzEmitterPlugin = () => {
+interface Options {
+  enableSiteMap: boolean
+  enableRSS: boolean
+}
+
+const defaultOptions: Options = {
+  enableSiteMap: true,
+  enableRSS: true,
+}
+
+function generateSiteMap(cfg: GlobalConfiguration, idx: ContentIndex): string {
+  const base = cfg.canonicalUrl ?? ""
+  const createURLEntry = (slug: string, content: ContentDetails): string => `<url>
+    <loc>https://${base}/${slug}</loc>
+    <lastmod>${content.date?.toISOString()}</lastmod>
+  </url>`
+  const urls = Array.from(idx).map(([slug, content]) => createURLEntry(slug, content)).join("")
+  return `<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml">${urls}</urlset>`
+}
+
+function generateRSSFeed(cfg: GlobalConfiguration, idx: ContentIndex): string {
+  const base = cfg.canonicalUrl ?? ""
+  const root = `https://${base}`
+
+  // TODO: ogimage
+  const createURLEntry = (slug: string, content: ContentDetails): string => `<items>
+    <title>${content.title}</title>
+    <link>${root}/${slug}</link>
+    <guid>${root}/${slug}</guid>
+    <description>${content.description}</description>
+    <pubDate>${content.date?.toUTCString()}</pubDate>
+  </items>`
+
+  const items = Array.from(idx).map(([slug, content]) => createURLEntry(slug, content)).join("")
+  return `<rss xmlns:atom="http://www.w3.org/2005/atom" version="2.0">
+    <channel>
+      <title>${cfg.pageTitle}</title>
+      <link>${root}</link>
+      <description>Recent content on ${cfg.pageTitle}</description>
+      <generator>Quartz -- quartz.jzhao.xyz</generator>
+      <atom:link href="${root}/index.xml" rel="self" type="application/rss+xml"/>
+    </channel>
+    ${items}
+  </rss>`
+}
+
+export const ContentIndex: QuartzEmitterPlugin<Options> = (opts) => {
+  opts = { ...defaultOptions, ...opts }
   return {
     name: "ContentIndex",
-    async emit(_contentDir, _cfg, content, _resources, emit) {
-      const fp = path.join("static", "contentIndex")
+    async emit(_contentDir, cfg, content, _resources, emit) {
+      const emitted: string[] = []
       const linkIndex: ContentIndex = new Map()
       for (const [_tree, file] of content) {
-        let slug = file.data.slug!
+        const slug = file.data.slug!
+        const date = file.data.dates?.modified ?? new Date()
         linkIndex.set(slug, {
           title: file.data.frontmatter?.title!,
           links: file.data.links ?? [],
-          tags: file.data.frontmatter?.tags,
-          content: file.data.text ?? ""
+          tags: file.data.frontmatter?.tags ?? [],
+          content: file.data.text ?? "",
+          date: date,
+          description: file.data.description ?? ""
         })
       }
 
+      if (opts?.enableSiteMap) {
+        await emit({
+          content: generateSiteMap(cfg, linkIndex),
+          slug: "sitemap",
+          ext: ".xml"
+        })
+        emitted.push("sitemap.xml")
+      }
+
+      if (opts?.enableRSS) {
+        await emit({
+          content: generateRSSFeed(cfg, linkIndex),
+          slug: "index",
+          ext: ".xml"
+        })
+        emitted.push("index.xml")
+      }
+
+      const fp = path.join("static", "contentIndex")
+      const simplifiedIndex = Object.fromEntries(
+        Array.from(linkIndex).map(([slug, content]) => {
+          // remove description and from content index as nothing downstream
+          // actually uses it. we only keep it in the index as we need it
+          // for the RSS feed
+          delete content.description
+          delete content.date
+          return [slug, content]
+        })
+      )
       await emit({
-        content: JSON.stringify(Object.fromEntries(linkIndex)),
+        content: JSON.stringify(simplifiedIndex),
         slug: fp,
         ext: ".json",
       })
+      emitted.push(`${fp}.json`)
 
-      return [`${fp}.json`]
+      return emitted
     },
     getQuartzComponents: () => [],
   }

quartz/plugins/emitters/index.ts

@@ -3,4 +3,3 @@ export { TagPage } from './tagPage'
 export { FolderPage } from './folderPage'
 export { ContentIndex } from './contentIndex'
 export { AliasRedirects } from './aliases'
-export { CNAME } from './cname'

quartz/plugins/index.ts

@@ -50,6 +50,11 @@ export function emitComponentResources(cfg: GlobalConfiguration, resources: Stat
       componentResources.afterDOMLoaded.push(afterDOMLoaded)
     }
   }
+  
+  if (cfg.enablePopovers) {
+    componentResources.afterDOMLoaded.push(popoverScript)
+    componentResources.css.push(popoverStyle)
+  }
 
   if (cfg.enableSPA) {
     componentResources.afterDOMLoaded.push(spaRouterScript)
@@ -61,11 +66,6 @@ export function emitComponentResources(cfg: GlobalConfiguration, resources: Stat
     )
   }
 
-  if (cfg.enablePopovers) {
-    componentResources.afterDOMLoaded.push(popoverScript)
-    componentResources.css.push(popoverStyle)
-  }
-
   emit({
     slug: "index",
     ext: ".css",

quartz/plugins/transformers/description.ts

@@ -10,6 +10,10 @@ const defaultOptions: Options = {
   descriptionLength: 150
 }
 
+const escapeHTML = (unsafe: string) => {
+  return unsafe.replaceAll('&', '&amp;').replaceAll('<', '&lt;').replaceAll('>', '&gt;').replaceAll('"', '&quot;').replaceAll("'", '&#039;');
+}
+
 export const Description: QuartzTransformerPlugin<Partial<Options> | undefined> = (userOpts) => {
   const opts = { ...defaultOptions, ...userOpts }
   return {
@@ -19,7 +23,7 @@ export const Description: QuartzTransformerPlugin<Partial<Options> | undefined>
         () => {
           return async (tree: HTMLRoot, file) => {
             const frontMatterDescription = file.data.frontmatter?.description
-            const text = toString(tree)
+            const text = escapeHTML(toString(tree))
 
             const desc = frontMatterDescription ?? text
             const sentences = desc.replace(/\s+/g, ' ').split('.')