From d38a9f3d857bed2d3421181030e9b1c31052ef5b Mon Sep 17 00:00:00 2001
From: kwaroran <amasio1234@proton.me>
Date: Sat, 24 Aug 2024 15:57:57 +0900
Subject: [PATCH] Add disable quote formating option

---
 src/lang/en.ts                               |  1 +
 src/lib/Setting/Pages/DisplaySettings.svelte |  8 ++++++--
 src/lib/UI/GUI/ColorInput.svelte             |  2 ++
 src/ts/gui/colorscheme.ts                    |  4 ++--
 src/ts/parser.ts                             | 18 +++++++++++++-----
 src/ts/storage/database.ts                   |  2 ++
 6 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/src/lang/en.ts b/src/lang/en.ts
index 3fbcbed9..b6a943da 100644
--- a/src/lang/en.ts
+++ b/src/lang/en.ts
@@ -685,4 +685,5 @@ export const languageEnglish = {
     claudeCachingExperimental: "Claude Caching",
     openClose: "Open/Close",
     hideApiKeys: "Hide API Keys",
+    unformatQuotes: "Disable Quote Formatting",
 }
\ No newline at end of file
diff --git a/src/lib/Setting/Pages/DisplaySettings.svelte b/src/lib/Setting/Pages/DisplaySettings.svelte
index b42840cd..dac10c73 100644
--- a/src/lib/Setting/Pages/DisplaySettings.svelte
+++ b/src/lib/Setting/Pages/DisplaySettings.svelte
@@ -152,11 +152,11 @@
             <span class="ml-2">Italic Bold Text</span>
         </div>
         <div class="flex items-center mt-2">
-            <ColorInput bind:value={$DataBase.customTextTheme.FontColorQuote1} on:input={updateTextTheme} />
+            <ColorInput nullable bind:value={$DataBase.customTextTheme.FontColorQuote1} on:input={updateTextTheme} />
             <span class="ml-2">Single Quote Text</span>
         </div>
         <div class="flex items-center mt-2">
-            <ColorInput bind:value={$DataBase.customTextTheme.FontColorQuote2} on:input={updateTextTheme} />
+            <ColorInput nullable bind:value={$DataBase.customTextTheme.FontColorQuote2} on:input={updateTextTheme} />
             <span class="ml-2">Double Quote Text</span>
         </div>
     {/if}
@@ -314,6 +314,10 @@
         <Check bind:check={$DataBase.hideApiKey} name={language.hideApiKeys}/>
     </div>
 
+    <div class="flex items-center mt-2">
+        <Check bind:check={$DataBase.unformatQuotes} name={language.unformatQuotes}/>
+    </div>
+
     {#if $DataBase.useExperimental}
         <div class="flex items-center mt-2">
             <Check bind:check={$DataBase.useChatSticker} name={language.useChatSticker}/>
diff --git a/src/lib/UI/GUI/ColorInput.svelte b/src/lib/UI/GUI/ColorInput.svelte
index 238c0cfb..c8d9d8af 100644
--- a/src/lib/UI/GUI/ColorInput.svelte
+++ b/src/lib/UI/GUI/ColorInput.svelte
@@ -1,11 +1,13 @@
 <script lang="ts">
     import ColorPicker from 'svelte-awesome-color-picker';
     export let value = '#000000';
+    export let nullable = false;
 </script>
 
 <div class="cl rounded-full bg-white">
     <ColorPicker
         label="" bind:hex={value} on:input
+        nullable={nullable}
     />
 </div>
 
diff --git a/src/ts/gui/colorscheme.ts b/src/ts/gui/colorscheme.ts
index 790147e9..32783836 100644
--- a/src/ts/gui/colorscheme.ts
+++ b/src/ts/gui/colorscheme.ts
@@ -230,8 +230,8 @@ export function updateTextTheme(){
             root.style.setProperty('--FontColorItalic', db.customTextTheme.FontColorItalic);
             root.style.setProperty('--FontColorBold', db.customTextTheme.FontColorBold);
             root.style.setProperty('--FontColorItalicBold', db.customTextTheme.FontColorItalicBold);
-            root.style.setProperty('--FontColorQuote1', db.customTextTheme.FontColorQuote1);
-            root.style.setProperty('--FontColorQuote2', db.customTextTheme.FontColorQuote2);
+            root.style.setProperty('--FontColorQuote1', db.customTextTheme.FontColorQuote1 ?? '#8BE9FD');
+            root.style.setProperty('--FontColorQuote2', db.customTextTheme.FontColorQuote2 ?? '#FFB86C');
             break
         }
     }
diff --git a/src/ts/parser.ts b/src/ts/parser.ts
index 3d4ff799..86907784 100644
--- a/src/ts/parser.ts
+++ b/src/ts/parser.ts
@@ -79,11 +79,19 @@ DOMPurify.addHook("uponSanitizeAttribute", (node, data) => {
 
 
 function renderMarkdown(md:markdownit, data:string){
-    return md.render(data.replace(/“|”/g, '"').replace(/‘|’/g, "'"))
-        .replace(/\uE9b0/gu, '<mark risu-mark="quote2">“')
-        .replace(/\uE9b1/gu, '”</mark>')
-        .replace(/\uE9b2/gu, '<mark risu-mark="quote1">‘')
-        .replace(/\uE9b3/gu, '’</mark>')
+    const db = get(DataBase)
+    let text = md.render(data.replace(/“|”/g, '"').replace(/‘|’/g, "'"))
+
+    if(db?.unformatQuotes){
+        text = text.replace(/\uE9b0/gu, '“').replace(/\uE9b1/gu, '”')
+        text = text.replace(/\uE9b2/gu, '‘').replace(/\uE9b3/gu, '’')
+    }
+    else{
+        text = text.replace(/\uE9b0/gu, '<mark risu-mark="quote2">“').replace(/\uE9b1/gu, '”</mark>')
+        text = text.replace(/\uE9b2/gu, '<mark risu-mark="quote1">‘').replace(/\uE9b3/gu, '’</mark>')
+    }
+
+    return text
 }
 
 async function renderHighlightableMarkdown(data:string) {
diff --git a/src/ts/storage/database.ts b/src/ts/storage/database.ts
index d007f8ec..8ee858fd 100644
--- a/src/ts/storage/database.ts
+++ b/src/ts/storage/database.ts
@@ -429,6 +429,7 @@ export function setDatabase(data:Database){
         timeout: 30
     }
     data.hideApiKey ??= true
+    data.unformatQuotes ??= false
 
     changeLanguage(data.language)
     DataBase.set(data)
@@ -712,6 +713,7 @@ export interface Database{
     useLegacyGUI: boolean
     claudeCachingExperimental: boolean
     hideApiKey: boolean
+    unformatQuotes: boolean
 }
 
 export interface customscript{