From f4f307d2a2b9d1b270a22b0d21d4bb09efdc3a6b Mon Sep 17 00:00:00 2001
From: tianma-if <yingwaizhiying@gmail.com>
Date: Sun, 18 Oct 2026 21:27:55 +0800
Subject: [PATCH] fix: show theme font names in image sharing

---
 .../dialogs/ShareNoteImageDialog.tsx           | 18 ++++++++++++++----
 packages/shared/src/i18n/en-US.ts              |  8 ++++++++
 packages/shared/src/i18n/ja.ts                 |  8 ++++++++
 packages/shared/src/i18n/pl.ts                 |  8 ++++++++
 packages/shared/src/i18n/zh-CN.ts              |  8 ++++++++
 packages/shared/src/note-image-card.ts         | 12 ++++++------
 6 files changed, 52 insertions(+), 10 deletions(-)

diff --git a/apps/web/src/components/dialogs/ShareNoteImageDialog.tsx b/apps/web/src/components/dialogs/ShareNoteImageDialog.tsx
index 9135a832..f9af85df 100644
--- a/apps/web/src/components/dialogs/ShareNoteImageDialog.tsx
+++ b/apps/web/src/components/dialogs/ShareNoteImageDialog.tsx
@@ -31,7 +31,7 @@ import {
   type NoteImageTheme,
   type PreparedNoteImage,
 } from "@/lib/note-image-export";
-import { NOTE_IMAGE_THEME_OPTIONS, buildNoteImageCardMarkup, escapeCardHtml, generateCardCss } from "@edgeever/shared/note-image-card";
+import { NOTE_IMAGE_BUNDLED_FONTS, NOTE_IMAGE_TEMPLATE_TYPOGRAPHY, resolveTheme, NOTE_IMAGE_THEME_OPTIONS, buildNoteImageCardMarkup, escapeCardHtml, generateCardCss } from "@edgeever/shared/note-image-card";
 import { getHtmlImageEmbedNoticeKind } from "@/lib/note-html-export";
 import { readNoteImagePreferences, writeNoteImagePreferences, type NoteImagePreferences } from "@/lib/note-image-preference";
 import { cn } from "@/lib/utils";
@@ -148,6 +148,16 @@ export const ShareNoteImageDialog = ({
   const [retry, setRetry] = useState(0);
   const [copyState, setCopyState] = useState<"idle" | "copying" | "copied" | "failed">("idle");
   const [contentFontStatus, setContentFontStatus] = useState<FontLoadStatus>("loading");
+  const themeFontLabel = NOTE_IMAGE_TEMPLATE_TYPOGRAPHY[resolveTheme(undefined, theme)].body
+    .map(font => t(NOTE_IMAGE_BUNDLED_FONTS[font].labelKey))
+    .join(" / ");
+  const selectedFontLabel = fontStyle === "auto"
+    ? themeFontLabel
+    : t(FONT_OPTIONS.find(item => item.id === fontStyle)!.labelKey);
+  const fontOptionLabel = (item: (typeof FONT_OPTIONS)[number]) => item.id === "auto"
+    ? `${t(item.labelKey)} (${themeFontLabel})`
+    : t(item.labelKey);
+
   const { status: selectedFontStatus, onPreviewStatus } = useFontPreviewStatus(`${fontStyle}:${theme}:${retry}`, contentFontStatus);
   const generationRef = useRef(0);
   const copyAttemptRef = useRef(0);
@@ -358,13 +368,13 @@ export const ShareNoteImageDialog = ({
               <Select value={fontStyle} onOpenChange={setFontMenuOpen} onValueChange={(value) => setPreference("fontStyle", value as NoteImageFontStyle)}>
                 <SelectTrigger aria-label={t("editor.imageShare.fontStyle")} className="h-9 w-full text-xs font-normal">
                   <SelectValue>
-                    <NoteImageFontLabel label={t(FONT_OPTIONS.find(item => item.id === fontStyle)!.labelKey)} fontStyle={fontStyle} theme={theme} enabled={open} status={error === true ? undefined : selectedFontStatus} onStatusChange={onPreviewStatus} retryKey={retry} />
+                    <NoteImageFontLabel label={selectedFontLabel} fontStyle={fontStyle} theme={theme} enabled={open} status={error === true ? undefined : selectedFontStatus} onStatusChange={onPreviewStatus} retryKey={retry} />
                   </SelectValue>
                 </SelectTrigger>
                 <SelectContent className="max-h-80">
                   {FONT_OPTIONS.map((item) => (
-                    <SelectItem key={item.id} value={item.id} textValue={t(item.labelKey)}>
-                      <NoteImageFontLabel label={t(item.labelKey)} fontStyle={item.id} theme={theme} enabled={open && fontMenuOpen} visibleOnly />
+                    <SelectItem key={item.id} value={item.id} textValue={fontOptionLabel(item)}>
+                      <NoteImageFontLabel label={fontOptionLabel(item)} fontStyle={item.id} theme={theme} enabled={open && fontMenuOpen} visibleOnly />
                     </SelectItem>
                   ))}
                 </SelectContent>
diff --git a/packages/shared/src/i18n/en-US.ts b/packages/shared/src/i18n/en-US.ts
index 9892e793..82840d46 100644
--- a/packages/shared/src/i18n/en-US.ts
+++ b/packages/shared/src/i18n/en-US.ts
@@ -2478,6 +2478,14 @@ export const enUS = {
         warm: "Warm",
       },
       fontStyle: "Typography",
+      templateFonts: {
+        puhui: "Alibaba PuHuiTi",
+        misans: "MiSans",
+        mincho: "Huiwen Mincho",
+        song: "Source Han Serif",
+        longcang: "Long Cang",
+        geist: "Geist Mono",
+      },
       fontStyles: {
         "source-han-serif": "Noto Serif SC",
         "anton": "Anton",
diff --git a/packages/shared/src/i18n/ja.ts b/packages/shared/src/i18n/ja.ts
index 1039c44c..b6acc5d7 100644
--- a/packages/shared/src/i18n/ja.ts
+++ b/packages/shared/src/i18n/ja.ts
@@ -2467,6 +2467,14 @@ export const ja = {
         warm: "あたたか",
       },
       fontStyle: "書体",
+      templateFonts: {
+        puhui: "Alibaba PuHuiTi",
+        misans: "MiSans",
+        mincho: "匯文明朝体",
+        song: "源ノ明朝",
+        longcang: "Long Cang",
+        geist: "Geist Mono",
+      },
       fontStyles: {
         "source-han-serif": "Noto Serif SC",
         "anton": "Anton",
diff --git a/packages/shared/src/i18n/pl.ts b/packages/shared/src/i18n/pl.ts
index 4374bd3c..e0e6762e 100644
--- a/packages/shared/src/i18n/pl.ts
+++ b/packages/shared/src/i18n/pl.ts
@@ -2467,6 +2467,14 @@ export const pl = {
         warm: "Ciepłe",
       },
       fontStyle: "Typografia",
+      templateFonts: {
+        puhui: "Alibaba PuHuiTi",
+        misans: "MiSans",
+        mincho: "Huiwen Mincho",
+        song: "Source Han Serif",
+        longcang: "Long Cang",
+        geist: "Geist Mono",
+      },
       fontStyles: {
         "source-han-serif": "Noto Serif SC",
         "anton": "Anton",
diff --git a/packages/shared/src/i18n/zh-CN.ts b/packages/shared/src/i18n/zh-CN.ts
index 86ff33a1..2bf804f3 100644
--- a/packages/shared/src/i18n/zh-CN.ts
+++ b/packages/shared/src/i18n/zh-CN.ts
@@ -2476,6 +2476,14 @@ export const zhCN = {
         warm: "暖色",
       },
       fontStyle: "字体风格",
+      templateFonts: {
+        puhui: "阿里巴巴普惠体",
+        misans: "MiSans",
+        mincho: "汇文明朝体",
+        song: "思源宋体",
+        longcang: "龙藏体",
+        geist: "Geist Mono",
+      },
       fontStyles: {
         "source-han-serif": "思源宋体",
         "anton": "Anton",
diff --git a/packages/shared/src/note-image-card.ts b/packages/shared/src/note-image-card.ts
index 91898acd..01a9c6fe 100644
--- a/packages/shared/src/note-image-card.ts
+++ b/packages/shared/src/note-image-card.ts
@@ -108,12 +108,12 @@ export const NOTE_IMAGE_FONT_FAMILIES: Record<Exclude<NoteImageFontStyle, "auto"
 
 /** Keep CSS families and asset selection together so defaults cannot silently fall back. */
 export const NOTE_IMAGE_BUNDLED_FONTS = {
-  puhui: { family: "Alibaba-PuHuiTi-Regular", fallback: "sans" },
-  misans: { family: "MiSans", fallback: "sans" },
-  mincho: { family: "Huiwen_mingchao", fallback: "serif" },
-  song: { family: "SourceHanSerifCN_SemiBold", fallback: "serif" },
-  longcang: { family: "Long Cang", fallback: "kai" },
-  geist: { family: "Geist Mono Variable", fallback: "mono" },
+  puhui: { labelKey: "editor.imageShare.templateFonts.puhui", family: "Alibaba-PuHuiTi-Regular", fallback: "sans" },
+  misans: { labelKey: "editor.imageShare.templateFonts.misans", family: "MiSans", fallback: "sans" },
+  mincho: { labelKey: "editor.imageShare.templateFonts.mincho", family: "Huiwen_mingchao", fallback: "serif" },
+  song: { labelKey: "editor.imageShare.templateFonts.song", family: "SourceHanSerifCN_SemiBold", fallback: "serif" },
+  longcang: { labelKey: "editor.imageShare.templateFonts.longcang", family: "Long Cang", fallback: "kai" },
+  geist: { labelKey: "editor.imageShare.templateFonts.geist", family: "Geist Mono Variable", fallback: "mono" },
 } as const;
 
 type BundledNoteImageFont = keyof typeof NOTE_IMAGE_BUNDLED_FONTS;