feat(mention): disable auto-completion

apps/client/src/widgets/type_widgets/ckeditor/config.ts

@@ -29,22 +29,6 @@ export async function buildConfig(opts: BuildEditorOptions): Promise<EditorConfi
     const config: EditorConfig = {
         licenseKey,
         placeholder: t("editable_text.placeholder"),
-        mention: {
-            feeds: [
-                {
-                    marker: "@",
-                    feed: (queryText: string) => noteAutocompleteService.autocompleteSourceForCKEditor(queryText),
-                    itemRenderer: (item) => {
-                        const itemElement = document.createElement("button");
-
-                        itemElement.innerHTML = `${(item as Suggestion).highlightedNotePathTitle} `;
-
-                        return itemElement;
-                    },
-                    minimumCharacters: 0
-                }
-            ],
-        },
         codeBlock: {
             languages: buildListOfLanguages()
         },
@@ -192,6 +176,26 @@ export async function buildConfig(opts: BuildEditorOptions): Promise<EditorConfi
         }
     }
 
+    // Mention customisation.
+    if (options.get("textNoteCompletionEnabled") === "true") {
+        config.mention = {
+            feeds: [
+                {
+                    marker: "@",
+                    feed: (queryText: string) => noteAutocompleteService.autocompleteSourceForCKEditor(queryText),
+                    itemRenderer: (item) => {
+                        const itemElement = document.createElement("button");
+
+                        itemElement.innerHTML = `${(item as Suggestion).highlightedNotePathTitle} `;
+
+                        return itemElement;
+                    },
+                    minimumCharacters: 0
+                }
+            ],
+        };
+    }
+
     // Enable premium plugins.
     if (hasPremiumLicense) {
         config.extraPlugins = [

apps/client/src/widgets/type_widgets/options/text_notes/features.ts

@@ -5,26 +5,40 @@ const TPL = /*html*/`
 <div class="options-section">
     <h4>Features</h4>
 
-    <label class="tn-checkbox">
+    <div>
-        <input type="checkbox" name="emoji-completion-enabled" />
+        <label class="tn-checkbox">
-        Enable Emoji auto-completion
+            <input type="checkbox" name="emoji-completion-enabled" />
-    </label>
+            Enable Emoji auto-completion
+        </label>
+    </div>
+
+    <div>
+        <label class="tn-checkbox">
+            <input type="checkbox" name="note-completion-enabled" />
+            Enable note auto-completion
+        </label>
+    </div>
 </div>
 `;
 
 export default class EditorFeaturesOptions extends OptionsWidget {
 
     private $emojiCompletionEnabledCheckbox!: JQuery<HTMLElement>;
+    private $noteCompletionEnabledCheckbox!: JQuery<HTMLElement>;
 
     doRender() {
         this.$widget = $(TPL);
 
         this.$emojiCompletionEnabledCheckbox = this.$widget.find(`input[name="emoji-completion-enabled"]`);
         this.$emojiCompletionEnabledCheckbox.on("change", () => this.updateCheckboxOption("textNoteEmojiCompletionEnabled", this.$emojiCompletionEnabledCheckbox))
+
+        this.$noteCompletionEnabledCheckbox = this.$widget.find(`input[name="note-completion-enabled"]`);
+        this.$noteCompletionEnabledCheckbox.on("change", () => this.updateCheckboxOption("textNoteCompletionEnabled", this.$noteCompletionEnabledCheckbox))
     }
 
     optionsLoaded(options: OptionMap) {
         this.setCheckboxState(this.$emojiCompletionEnabledCheckbox, options.textNoteEmojiCompletionEnabled);
+        this.setCheckboxState(this.$noteCompletionEnabledCheckbox, options.textNoteCompletionEnabled);
     }
 
 }

apps/server/src/routes/api/options.ts

@@ -86,6 +86,7 @@ const ALLOWED_OPTIONS = new Set<OptionNames>([
     "textNoteEditorType",
     "textNoteEditorMultilineToolbar",
     "textNoteEmojiCompletionEnabled",
+    "textNoteCompletionEnabled",
     "layoutOrientation",
     "backgroundEffects",
     "allowedHtmlTags",

apps/server/src/services/options_init.ts

@@ -179,6 +179,7 @@ const defaultOptions: DefaultOption[] = [
     { name: "textNoteEditorType", value: "ckeditor-balloon", isSynced: true },
     { name: "textNoteEditorMultilineToolbar", value: "false", isSynced: true },
     { name: "textNoteEmojiCompletionEnabled", value: "true", isSynced: true },
+    { name: "textNoteCompletionEnabled", value: "true", isSynced: true },
 
     // HTML import configuration
     { name: "layoutOrientation", value: "vertical", isSynced: false },

packages/ckeditor5/src/plugins/mention_customization.ts

@@ -13,6 +13,10 @@ export default class MentionCustomization extends Plugin {
 		return [ Mention ];
 	}
 
+    public static get pluginName() {
+		return "MentionCustomization" as const;
+	}
+
 	afterInit() {
 		const editor = this.editor;
 		// override standard mention command (see https://github.com/ckeditor/ckeditor5/issues/6470)

packages/commons/src/lib/options_interface.ts

@@ -118,7 +118,10 @@ export interface OptionDefinitions extends KeyboardShortcutsOptions<KeyboardActi
     editedNotesOpenInRibbon: boolean;
     codeBlockWordWrap: boolean;
     textNoteEditorMultilineToolbar: boolean;
+    /** Whether keyboard auto-completion for emojis is triggered when typing `:`. */
     textNoteEmojiCompletionEnabled: boolean;
+    /** Whether keyboard auto-completion for notes is triggered when typing `@` in text notes (attribute editing is not affected). */
+    textNoteCompletionEnabled: boolean;
     backgroundEffects: boolean;
 
     // Share settings