Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-05-07 05:36:30 +02:00
Code Issues Packages Projects Releases Activity

chore(options/text): use options row for features

Browse Source
This commit is contained in:
Elian Doran
2026-04-13 16:20:36 +03:00
parent f422155dee
commit 7e246f599d
2 changed files with 35 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
apps/client/src/translations/en/translation.json
View File

@@ -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",

45
apps/client/src/widgets/type_widgets/options/text_notes.tsx
View File

@@ -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");