From ba94616b879788a9e59e451a533d65ced9cad53b Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 23 Jun 2025 22:10:41 +0300
Subject: [PATCH] feat(emoji): add an option to disable them (closes #5852)

---
 .../widgets/type_widgets/ckeditor/config.ts   | 13 +++++++-
 .../widgets/type_widgets/content_widget.ts    |  2 ++
 .../options/text_notes/features.ts            | 30 +++++++++++++++++++
 apps/server/src/routes/api/options.ts         |  1 +
 apps/server/src/services/options_init.ts      |  1 +
 packages/commons/src/lib/options_interface.ts |  1 +
 6 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 apps/client/src/widgets/type_widgets/options/text_notes/features.ts

diff --git a/apps/client/src/widgets/type_widgets/ckeditor/config.ts b/apps/client/src/widgets/type_widgets/ckeditor/config.ts
index 17bb6b611..3be584ee8 100644
--- a/apps/client/src/widgets/type_widgets/ckeditor/config.ts
+++ b/apps/client/src/widgets/type_widgets/ckeditor/config.ts
@@ -179,7 +179,8 @@ export async function buildConfig(opts: BuildEditorOptions): Promise<EditorConfi
             allow: JSON.parse(options.get("allowedHtmlTags"))
         },
         // This value must be kept in sync with the language defined in webpack.config.js.
-        language: "en"
+        language: "en",
+        removePlugins: getDisabledPlugins()
     };
 
     // Set up content language.
@@ -231,3 +232,13 @@ function getLicenseKey() {
 
     return premiumLicenseKey;
 }
+
+function getDisabledPlugins() {
+    let disabledPlugins: string[] = [];
+
+    if (options.get("textNoteEmojiEnabled") !== "true") {
+        disabledPlugins.push("Emoji");
+    }
+
+    return disabledPlugins;
+}
diff --git a/apps/client/src/widgets/type_widgets/content_widget.ts b/apps/client/src/widgets/type_widgets/content_widget.ts
index 77b86231d..beb9de272 100644
--- a/apps/client/src/widgets/type_widgets/content_widget.ts
+++ b/apps/client/src/widgets/type_widgets/content_widget.ts
@@ -46,6 +46,7 @@ import LanguageOptions from "./options/i18n/language.js";
 import type BasicWidget from "../basic_widget.js";
 import CodeTheme from "./options/code_notes/code_theme.js";
 import RelatedSettings from "./options/appearance/related_settings.js";
+import EditorFeaturesOptions from "./options/text_notes/features.js";
 
 const TPL = /*html*/`<div class="note-detail-content-widget note-detail-printable">
     <style>
@@ -85,6 +86,7 @@ const CONTENT_WIDGETS: Record<OptionPages | "_backendLog", (typeof NoteContextAw
     ],
     _optionsTextNotes: [
         EditorOptions,
+        EditorFeaturesOptions,
         HeadingStyleOptions,
         CodeBlockOptions,
         TableOfContentsOptions,
diff --git a/apps/client/src/widgets/type_widgets/options/text_notes/features.ts b/apps/client/src/widgets/type_widgets/options/text_notes/features.ts
new file mode 100644
index 000000000..d5ee87930
--- /dev/null
+++ b/apps/client/src/widgets/type_widgets/options/text_notes/features.ts
@@ -0,0 +1,30 @@
+import { OptionMap } from "@triliumnext/commons";
+import OptionsWidget from "../options_widget";
+
+const TPL = /*html*/`
+<div class="options-section">
+    <h4>Features</h4>
+
+    <label class="tn-checkbox">
+        <input type="checkbox" name="emoji-enabled" />
+        Enable Emoji support and auto-completion
+    </label>
+</div>
+`;
+
+export default class EditorFeaturesOptions extends OptionsWidget {
+
+    private $emojiEnabledCheckbox!: JQuery<HTMLElement>;
+
+    doRender() {
+        this.$widget = $(TPL);
+
+        this.$emojiEnabledCheckbox = this.$widget.find(`input[name="emoji-enabled"]`);
+        this.$emojiEnabledCheckbox.on("change", () => this.updateCheckboxOption("textNoteEmojiEnabled", this.$emojiEnabledCheckbox))
+    }
+
+    optionsLoaded(options: OptionMap) {
+        this.setCheckboxState(this.$emojiEnabledCheckbox, options.textNoteEmojiEnabled);
+    }
+
+}
diff --git a/apps/server/src/routes/api/options.ts b/apps/server/src/routes/api/options.ts
index f481b24a4..0b496d7d9 100644
--- a/apps/server/src/routes/api/options.ts
+++ b/apps/server/src/routes/api/options.ts
@@ -85,6 +85,7 @@ const ALLOWED_OPTIONS = new Set<OptionNames>([
     "languages",
     "textNoteEditorType",
     "textNoteEditorMultilineToolbar",
+    "textNoteEmojiEnabled",
     "layoutOrientation",
     "backgroundEffects",
     "allowedHtmlTags",
diff --git a/apps/server/src/services/options_init.ts b/apps/server/src/services/options_init.ts
index b81507999..a109f31d0 100644
--- a/apps/server/src/services/options_init.ts
+++ b/apps/server/src/services/options_init.ts
@@ -178,6 +178,7 @@ const defaultOptions: DefaultOption[] = [
     // Text note configuration
     { name: "textNoteEditorType", value: "ckeditor-balloon", isSynced: true },
     { name: "textNoteEditorMultilineToolbar", value: "false", isSynced: true },
+    { name: "textNoteEmojiEnabled", value: "true", isSynced: true },
 
     // HTML import configuration
     { name: "layoutOrientation", value: "vertical", isSynced: false },
diff --git a/packages/commons/src/lib/options_interface.ts b/packages/commons/src/lib/options_interface.ts
index ad781b65c..bd9cfee33 100644
--- a/packages/commons/src/lib/options_interface.ts
+++ b/packages/commons/src/lib/options_interface.ts
@@ -118,6 +118,7 @@ export interface OptionDefinitions extends KeyboardShortcutsOptions<KeyboardActi
     editedNotesOpenInRibbon: boolean;
     codeBlockWordWrap: boolean;
     textNoteEditorMultilineToolbar: boolean;
+    textNoteEmojiEnabled: boolean;
     backgroundEffects: boolean;
 
     // Share settings