From 90f1188c8f0451434737f124363293173eec0953 Mon Sep 17 00:00:00 2001
From: frostime <frostime@foxmail.com>
Date: Sat, 25 May 2024 16:13:54 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(config):=20=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E4=BA=86=E5=AF=B9=E5=AD=97=E4=BD=93=20font-family=20=E7=9A=84?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/chat.tsx     |  3 +++
 app/components/exporter.tsx |  1 +
 app/components/markdown.tsx |  2 ++
 app/components/settings.tsx | 13 +++++++++++++
 app/store/config.ts         |  1 +
 app/utils.ts                |  1 +
 6 files changed, 21 insertions(+)

diff --git a/app/components/chat.tsx b/app/components/chat.tsx
index 06119250465..50ac9caa918 100644
--- a/app/components/chat.tsx
+++ b/app/components/chat.tsx
@@ -670,6 +670,7 @@ function _Chat() {
   const session = chatStore.currentSession();
   const config = useAppConfig();
   const fontSize = config.fontSize;
+  const fontFamily = config.fontFamily;
 
   const [showExport, setShowExport] = useState(false);
 
@@ -1420,6 +1421,7 @@ function _Chat() {
                         setUserInput(getMessageTextContent(message));
                       }}
                       fontSize={fontSize}
+                      fontFamily={fontFamily}
                       parentRef={scrollRef}
                       defaultShow={i >= messages.length - 6}
                     />
@@ -1514,6 +1516,7 @@ function _Chat() {
             autoFocus={autoFocus}
             style={{
               fontSize: config.fontSize,
+              fontFamily: config.fontFamily,
             }}
           />
           {attachImages.length != 0 && (
diff --git a/app/components/exporter.tsx b/app/components/exporter.tsx
index 20e240d93b0..ea1585d2cb1 100644
--- a/app/components/exporter.tsx
+++ b/app/components/exporter.tsx
@@ -591,6 +591,7 @@ export function ImagePreviewer(props: {
                 <Markdown
                   content={getMessageTextContent(m)}
                   fontSize={config.fontSize}
+                  fontFamily={config.fontFamily}
                   defaultShow
                 />
                 {getMessageImages(m).length == 1 && (
diff --git a/app/components/markdown.tsx b/app/components/markdown.tsx
index 1afd7de3b45..f9b8fb030f5 100644
--- a/app/components/markdown.tsx
+++ b/app/components/markdown.tsx
@@ -175,6 +175,7 @@ export function Markdown(
     content: string;
     loading?: boolean;
     fontSize?: number;
+    fontFamily?: string;
     parentRef?: RefObject<HTMLDivElement>;
     defaultShow?: boolean;
   } & React.DOMAttributes<HTMLDivElement>,
@@ -186,6 +187,7 @@ export function Markdown(
       className="markdown-body"
       style={{
         fontSize: `${props.fontSize ?? 14}px`,
+        fontFamily: props.fontFamily ?? "inherit",
       }}
       ref={mdRef}
       onContextMenu={props.onContextMenu}
diff --git a/app/components/settings.tsx b/app/components/settings.tsx
index db08b48a9ff..e1b97f4a6fe 100644
--- a/app/components/settings.tsx
+++ b/app/components/settings.tsx
@@ -797,6 +797,19 @@ export function Settings() {
             ></InputRange>
           </ListItem>
 
+          <ListItem title="字体" subTitle="设置全局字体">
+            <input
+              type="text"
+              value={config.fontFamily}
+              placeholder="CSS Font Family"
+              onChange={(e) =>
+                updateConfig(
+                  (config) => (config.fontFamily = e.currentTarget.value),
+                )
+              }
+            ></input>
+          </ListItem>
+
           <ListItem
             title={Locale.Settings.AutoGenerateTitle.Title}
             subTitle={Locale.Settings.AutoGenerateTitle.SubTitle}
diff --git a/app/store/config.ts b/app/store/config.ts
index 94cfcd8ecaa..1ca52032169 100644
--- a/app/store/config.ts
+++ b/app/store/config.ts
@@ -32,6 +32,7 @@ export const DEFAULT_CONFIG = {
   submitKey: SubmitKey.Enter,
   avatar: "1f603",
   fontSize: 14,
+  fontFamily: `"HarmonyOS Sans SC", "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif`,
   theme: Theme.Auto as Theme,
   tightBorder: !!config?.isApp,
   sendPreviewBubble: true,
diff --git a/app/utils.ts b/app/utils.ts
index 8f7adc7e2a2..7eb484ea2da 100644
--- a/app/utils.ts
+++ b/app/utils.ts
@@ -194,6 +194,7 @@ export function autoGrowTextArea(dom: HTMLTextAreaElement) {
   measureDom.style.width = width + "px";
   measureDom.innerText = dom.value !== "" ? dom.value : "1";
   measureDom.style.fontSize = dom.style.fontSize;
+  measureDom.style.fontFamily = dom.style.fontFamily;
   const endWithEmptyLine = dom.value.endsWith("\n");
   const height = parseFloat(window.getComputedStyle(measureDom).height);
   const singleLineHeight = parseFloat(