From 5de3865135a2c8df659009b86d94025cce4ab249 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 23 Nov 2023 11:20:36 +0000
Subject: [PATCH] fix: Added block quote and code to rich modal

---
 packages/nc-gui/components/cell/RichText.vue  |  8 ++++++
 .../cell/RichText/SelectedBubbleMenu.vue      | 25 +++++++++++++++++++
 packages/nc-gui/lang/en.json                  |  2 ++
 3 files changed, 35 insertions(+)

diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index f578eaad7e..b13f391f3a 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -189,5 +189,13 @@ const focusEditorEnd = () => {
     font-size: 1.15rem;
     margin-bottom: 0.1em;
   }
+
+  blockquote {
+    border-left: 3px solid #d0d5dd;
+    padding: 0 1em;
+    color: #666;
+    margin: 1em 0;
+    font-style: italic;
+  }
 }
 </style>
diff --git a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
index bf8df90212..4198267f3d 100644
--- a/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
+++ b/packages/nc-gui/components/cell/RichText/SelectedBubbleMenu.vue
@@ -7,6 +7,8 @@ import MdiFormatListCheckbox from '~icons/mdi/format-list-checkbox'
 import MsFormatH1 from '~icons/material-symbols/format-h1'
 import MsFormatH2 from '~icons/material-symbols/format-h2'
 import MsFormatH3 from '~icons/material-symbols/format-h3'
+import TablerBlockQuote from '~icons/tabler/blockquote'
+import MsCode from '~icons/material-symbols/code'
 
 interface Props {
   editor: Editor
@@ -115,6 +117,17 @@ const onToggleLink = () => {
         <MdiFormatStrikeThrough />
       </NcButton>
     </NcTooltip>
+    <NcTooltip>
+      <template #title> {{ $t('general.code') }}</template>
+      <NcButton
+        size="small"
+        type="text"
+        :class="{ 'is-active': editor.isActive('code') }"
+        @click="editor!.chain().focus().toggleCode().run()"
+      >
+        <MsCode />
+      </NcButton>
+    </NcTooltip>
     <div class="divider"></div>
 
     <template v-if="embedMode">
@@ -155,6 +168,18 @@ const onToggleLink = () => {
       <div class="divider"></div>
     </template>
 
+    <NcTooltip v-if="embedMode">
+      <template #title> {{ $t('labels.blockQuote') }}</template>
+      <NcButton
+        size="small"
+        type="text"
+        :class="{ 'is-active': editor.isActive('blockquote') }"
+        @click="editor!.chain().focus().toggleBlockquote().run()"
+      >
+        <TablerBlockQuote class="-mt-0.25" />
+      </NcButton>
+    </NcTooltip>
+
     <NcTooltip>
       <template #title> {{ $t('labels.taskList') }}</template>
       <NcButton
diff --git a/packages/nc-gui/lang/en.json b/packages/nc-gui/lang/en.json
index cd6da92b20..bc130595ab 100644
--- a/packages/nc-gui/lang/en.json
+++ b/packages/nc-gui/lang/en.json
@@ -82,6 +82,7 @@
     "creatingEntity": "Creating {entity}",
     "details": "Details",
     "skip": "Skip",
+    "code": "Code",
     "duplicate": "Duplicate",
     "duplicating": "Duplicating",
     "activate": "Activate",
@@ -422,6 +423,7 @@
     "bulletList": "Bullet List",
     "numberedList": "Numbered List",
     "downloadData": "Download Data",
+    "blockQuote": "Block Quote",
     "noToken": "No Token",
     "tokenLimit": "Only one token per user is allowed",
     "duplicateAttachment": "File with name {filename} already attached",