From 13afcb8a49e0e51d880e507a853c85bb86dab21a Mon Sep 17 00:00:00 2001 From: Elian Doran Date: Mon, 16 Jun 2025 20:48:01 +0300 Subject: [PATCH] feat(slash): insert internal link --- .../ckeditor5/src/extra_slash_commands.ts | 12 +++++++- .../ckeditor5/src/plugins/insert_date_time.ts | 2 +- .../ckeditor5/src/plugins/internallink.ts | 30 ++++++++++++++----- 3 files changed, 35 insertions(+), 9 deletions(-) diff --git a/packages/ckeditor5/src/extra_slash_commands.ts b/packages/ckeditor5/src/extra_slash_commands.ts index 0d7a550de..4f941cad3 100644 --- a/packages/ckeditor5/src/extra_slash_commands.ts +++ b/packages/ckeditor5/src/extra_slash_commands.ts @@ -2,8 +2,11 @@ import type { Editor } from 'ckeditor5'; import type { SlashCommandEditorConfig } from 'ckeditor5-premium-features'; import { icons as admonitionIcons } from '@triliumnext/ckeditor5-admonition'; import { icons as footnoteIcons } from '@triliumnext/ckeditor5-footnotes'; +import { COMMAND_NAME as INSERT_DATE_TIME_COMMAND } from './plugins/insert_date_time'; +import { COMMAND_NAME as INTERNAL_LINK_COMMAND } from './plugins/internallink'; import { ADMONITION_TYPES, type AdmonitionType } from '@triliumnext/ckeditor5-admonition'; import dateTimeIcon from './icons/date-time.svg?raw'; +import internalLinkIcon from './icons/trilium.svg?raw'; type SlashCommandDefinition = SlashCommandEditorConfig["extraCommands"][number]; @@ -22,7 +25,14 @@ export default function buildExtraCommands(): SlashCommandDefinition[] { title: "Insert Date/Time", description: "Insert the current date and time", icon: dateTimeIcon, - commandName: "insertDateTimeToText" + commandName: INSERT_DATE_TIME_COMMAND + }, + { + id: "internal-link", + title: "Internal Trilium link", + description: "Insert a link to another Trilium note", + icon: internalLinkIcon, + commandName: INTERNAL_LINK_COMMAND } ]; } diff --git a/packages/ckeditor5/src/plugins/insert_date_time.ts b/packages/ckeditor5/src/plugins/insert_date_time.ts index 2fdfbe9a1..b105297e5 100644 --- a/packages/ckeditor5/src/plugins/insert_date_time.ts +++ b/packages/ckeditor5/src/plugins/insert_date_time.ts @@ -1,7 +1,7 @@ import { ButtonView, Command, Plugin } from 'ckeditor5'; import dateTimeIcon from '../icons/date-time.svg?raw'; -const COMMAND_NAME = 'insertDateTimeToText'; +export const COMMAND_NAME = 'insertDateTimeToText'; export default class InsertDateTimePlugin extends Plugin { init() { diff --git a/packages/ckeditor5/src/plugins/internallink.ts b/packages/ckeditor5/src/plugins/internallink.ts index 895de239a..f6045dbc9 100644 --- a/packages/ckeditor5/src/plugins/internallink.ts +++ b/packages/ckeditor5/src/plugins/internallink.ts @@ -1,7 +1,9 @@ -import { ButtonView, Plugin } from 'ckeditor5'; +import { ButtonView, Command, Plugin } from 'ckeditor5'; import internalLinkIcon from '../icons/trilium.svg?raw'; import ReferenceLink from './referencelink'; +export const COMMAND_NAME = 'insertInternalLink'; + export default class InternalLinkPlugin extends Plugin { static get requires() { @@ -11,6 +13,8 @@ export default class InternalLinkPlugin extends Plugin { init() { const editor = this.editor; + editor.commands.add(COMMAND_NAME, new InsertInternalLinkCommand(editor)); + editor.ui.componentFactory.add('internalLink', locale => { const view = new ButtonView( locale ); @@ -21,16 +25,28 @@ export default class InternalLinkPlugin extends Plugin { } ); // enable internal link only if the editor is not read only - view.bind('isEnabled').to(editor, 'isReadOnly', isReadOnly => !isReadOnly); - + const command = editor.commands.get(COMMAND_NAME)!; + view.bind('isEnabled').to(command, 'isEnabled'); view.on('execute', () => { - const editorEl = editor.editing.view.getDomRoot(); - const component = glob.getComponentByEl(editorEl); - - component.triggerCommand('addLinkToText'); + editor.execute(COMMAND_NAME); } ); return view; }); } } + +class InsertInternalLinkCommand extends Command { + + refresh() { + this.isEnabled = !this.editor.isReadOnly; + } + + execute() { + const editor = this.editor; + const editorEl = editor.editing.view.getDomRoot(); + const component = glob.getComponentByEl(editorEl); + + component.triggerCommand('addLinkToText'); + } +}