feat(react/settings): port text features

This commit is contained in:
Elian Doran
2025-08-18 09:40:36 +03:00
parent 71b627fbc7
commit 701855344e
2 changed files with 22 additions and 45 deletions

View File

@@ -8,6 +8,7 @@ export default function TextNoteSettings() {
return (
<>
<FormattingToolbar />
<EditorFeatures />
</>
)
}
@@ -43,4 +44,25 @@ function FormattingToolbar() {
/>
</OptionsSection>
)
}
function EditorFeatures() {
const [ textNoteEmojiCompletionEnabled, setTextNoteEmojiCompletionEnabled] = useTriliumOptionBool("textNoteEmojiCompletionEnabled");
const [ textNoteCompletionEnabled, setTextNoteCompletionEnabled ] = useTriliumOptionBool("textNoteCompletionEnabled");
return (
<OptionsSection title={t("editorfeatures.title")}>
<FormCheckbox
name="emoji-completion-enabled"
label={t("editorfeatures.emoji_completion_enabled")}
currentValue={textNoteEmojiCompletionEnabled} onChange={setTextNoteEmojiCompletionEnabled}
/>
<FormCheckbox
name="note-completion-enabled"
label={t("editorfeatures.note_completion_enabled")}
currentValue={textNoteCompletionEnabled} onChange={setTextNoteCompletionEnabled}
/>
</OptionsSection>
);
}

View File

@@ -1,45 +0,0 @@
import { OptionMap } from "@triliumnext/commons";
import OptionsWidget from "../options_widget";
import { t } from "../../../../services/i18n";
const TPL = /*html*/`
<div class="options-section">
<h4>${t("editorfeatures.title")}</h4>
<div>
<label class="tn-checkbox">
<input type="checkbox" name="emoji-completion-enabled" />
${t("editorfeatures.emoji_completion_enabled")}
</label>
</div>
<div>
<label class="tn-checkbox">
<input type="checkbox" name="note-completion-enabled" />
${t("editorfeatures.note_completion_enabled")}
</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);
}
}