From 5b13ff21992a61eb8b03670ae1742a72703c2afe Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Thu, 06 Mar 2025 02:16:24 +0000
Subject: [PATCH] feat: support emitters defining external resources, emit link from contentindex directly

---
 quartz/components/Head.tsx |   26 +++++++++++++++++++++++---
 1 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/quartz/components/Head.tsx b/quartz/components/Head.tsx
index a8e4974..09156c9 100644
--- a/quartz/components/Head.tsx
+++ b/quartz/components/Head.tsx
@@ -4,6 +4,7 @@
 import { googleFontHref } from "../util/theme"
 import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
 import satori, { SatoriOptions } from "satori"
+import { loadEmoji, getIconCode } from "../util/emoji"
 import fs from "fs"
 import sharp from "sharp"
 import { ImageOptions, SocialImageOptions, getSatoriFont, defaultImage } from "../util/og"
@@ -24,7 +25,18 @@
   // JSX that will be used to generate satori svg
   const imageComponent = userOpts.imageStructure(cfg, userOpts, title, description, fonts, fileData)
 
-  const svg = await satori(imageComponent, { width, height, fonts })
+  const svg = await satori(imageComponent, {
+    width,
+    height,
+    fonts,
+    loadAdditionalAsset: async (languageCode: string, segment: string) => {
+      if (languageCode === "emoji") {
+        return `data:image/svg+xml;base64,${btoa(await loadEmoji(getIconCode(segment)))}`
+      }
+
+      return languageCode
+    },
+  })
 
   // Convert svg directly to webp (with additional compression)
   const compressed = await sharp(Buffer.from(svg)).webp({ quality: 40 }).toBuffer()
@@ -98,7 +110,7 @@
 
       if (fileName) {
         // Generate social image (happens async)
-        generateSocialImage(
+        void generateSocialImage(
           {
             title,
             description,
@@ -115,7 +127,7 @@
       }
     }
 
-    const { css, js } = externalResources
+    const { css, js, additionalHead } = externalResources
 
     const url = new URL(`https://${cfg.baseUrl ?? "example.com"}`)
     const path = url.pathname as FullSlug
@@ -165,6 +177,7 @@
             <link rel="stylesheet" href={googleFontHref(cfg.theme)} />
           </>
         )}
+        <link rel="preconnect" href="https://cdnjs.cloudflare.com" crossOrigin="anonymous" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         {/* OG/Twitter meta tags */}
         <meta name="og:site_name" content={cfg.pageTitle}></meta>
@@ -200,6 +213,13 @@
         {js
           .filter((resource) => resource.loadTime === "beforeDOMReady")
           .map((res) => JSResourceToScriptElement(res, true))}
+        {additionalHead.map((resource) => {
+          if (typeof resource === "function") {
+            return resource(fileData)
+          } else {
+            return resource
+          }
+        })}
       </head>
     )
   }

--
Gitblit v1.10.0