diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index 8a8d26654a..b11110b9a8 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -2063,12 +2063,12 @@
   },
   "editorfeatures": {
     "title": "Features",
-    "emoji_completion_enabled": "Enable Emoji auto-completion",
-    "emoji_completion_description": "If enabled, emojis can be easily inserted into text by typing `:`, followed by the name of an emoji.",
-    "note_completion_enabled": "Enable note auto-completion",
-    "note_completion_description": "If enabled, links to notes can be created by typing `@` followed by the title of a note.",
-    "slash_commands_enabled": "Enable slash commands",
-    "slash_commands_description": "If enabled, editing commands such as inserting line breaks or headings can be toggled by typing `/`."
+    "emoji_completion_enabled": "Emoji auto-completion",
+    "emoji_completion_description": "Emojis can be easily inserted into text by typing `:`, followed by the name of an emoji.",
+    "note_completion_enabled": "Note auto-completion",
+    "note_completion_description": "Links to notes can be created by typing `@` followed by the title of a note.",
+    "slash_commands_enabled": "Slash commands",
+    "slash_commands_description": "Editing commands such as inserting line breaks or headings can be toggled by typing `/`."
   },
   "table_view": {
     "new-row": "New row",
diff --git a/apps/client/src/widgets/type_widgets/options/text_notes.tsx b/apps/client/src/widgets/type_widgets/options/text_notes.tsx
index e2ff88b447..db33e58cb0 100644
--- a/apps/client/src/widgets/type_widgets/options/text_notes.tsx
+++ b/apps/client/src/widgets/type_widgets/options/text_notes.tsx
@@ -1,4 +1,4 @@
-import { normalizeMimeTypeForCKEditor, type OptionNames } from "@triliumnext/commons";
+import { normalizeMimeTypeForCKEditor } from "@triliumnext/commons";
 import { Themes } from "@triliumnext/highlightjs";
 import type { CSSProperties } from "preact/compat";
 import { useEffect, useMemo, useState } from "preact/hooks";
@@ -21,6 +21,7 @@ import KeyboardShortcut from "../../react/KeyboardShortcut";
 import { getHtml } from "../../react/RawHtml";
 import AutoReadOnlySize from "./components/AutoReadOnlySize";
 import CheckboxList from "./components/CheckboxList";
+import { OptionsRowWithToggle } from "./components/OptionsRow";
 import OptionsSection from "./components/OptionsSection";
 
 const isNewLayout = isExperimentalFeatureEnabled("new-layout");
@@ -74,27 +75,39 @@ function FormattingToolbar() {
 }
 
 function EditorFeatures() {
+    const [emojiCompletionEnabled, setEmojiCompletionEnabled] = useTriliumOptionBool("textNoteEmojiCompletionEnabled");
+    const [noteCompletionEnabled, setNoteCompletionEnabled] = useTriliumOptionBool("textNoteCompletionEnabled");
+    const [slashCommandsEnabled, setSlashCommandsEnabled] = useTriliumOptionBool("textNoteSlashCommandsEnabled");
+
     return (
         <OptionsSection title={t("editorfeatures.title")}>
-            <EditorFeature name="emoji-completion-enabled" optionName="textNoteEmojiCompletionEnabled" label={t("editorfeatures.emoji_completion_enabled")} description={t("editorfeatures.emoji_completion_description")} />
-            <EditorFeature name="note-completion-enabled" optionName="textNoteCompletionEnabled" label={t("editorfeatures.note_completion_enabled")} description={t("editorfeatures.note_completion_description")} />
-            <EditorFeature name="slash-commands-enabled" optionName="textNoteSlashCommandsEnabled" label={t("editorfeatures.slash_commands_enabled")} description={t("editorfeatures.slash_commands_description")} />
+            <OptionsRowWithToggle
+                name="emoji-completion-enabled"
+                label={t("editorfeatures.emoji_completion_enabled")}
+                description={t("editorfeatures.emoji_completion_description")}
+                currentValue={emojiCompletionEnabled}
+                onChange={setEmojiCompletionEnabled}
+            />
+
+            <OptionsRowWithToggle
+                name="note-completion-enabled"
+                label={t("editorfeatures.note_completion_enabled")}
+                description={t("editorfeatures.note_completion_description")}
+                currentValue={noteCompletionEnabled}
+                onChange={setNoteCompletionEnabled}
+            />
+
+            <OptionsRowWithToggle
+                name="slash-commands-enabled"
+                label={t("editorfeatures.slash_commands_enabled")}
+                description={t("editorfeatures.slash_commands_description")}
+                currentValue={slashCommandsEnabled}
+                onChange={setSlashCommandsEnabled}
+            />
         </OptionsSection>
     );
 }
 
-function EditorFeature({ optionName, name, label, description }: { optionName: OptionNames, name: string, label: string, description: string }) {
-    const [ featureEnabled, setFeatureEnabled ] = useTriliumOptionBool(optionName);
-
-    return (
-        <FormCheckbox
-            name={name} label={label}
-            currentValue={featureEnabled} onChange={setFeatureEnabled}
-            hint={description}
-        />
-    );
-}
-
 function HeadingStyle() {
     const [ headingStyle, setHeadingStyle ] = useTriliumOption("headingStyle");