diff --git a/apps/client/src/services/content_renderer.ts b/apps/client/src/services/content_renderer.ts index 619d2d7a6..6366e147d 100644 --- a/apps/client/src/services/content_renderer.ts +++ b/apps/client/src/services/content_renderer.ts @@ -12,10 +12,10 @@ import FAttachment from "../entities/fattachment.js"; import imageContextMenuService from "../menus/image_context_menu.js"; import { applySingleBlockSyntaxHighlight, applySyntaxHighlight } from "./syntax_highlight.js"; import { loadElkIfNeeded, postprocessMermaidSvg } from "./mermaid.js"; -import { normalizeMimeTypeForCKEditor } from "./mime_type_definitions.js"; import renderDoc from "./doc_renderer.js"; import { t } from "../services/i18n.js"; import WheelZoom from 'vanilla-js-wheel-zoom'; +import { normalizeMimeTypeForCKEditor } from "@triliumnext/commons"; let idCounter = 1; diff --git a/apps/client/src/services/mime_type_definitions.ts b/apps/client/src/services/mime_type_definitions.ts index 04b55b456..5ea70d6b8 100644 --- a/apps/client/src/services/mime_type_definitions.ts +++ b/apps/client/src/services/mime_type_definitions.ts @@ -179,17 +179,6 @@ export const MIME_TYPES_DICT: readonly MimeTypeDefinition[] = Object.freeze([ { title: "Z80", mime: "text/x-z80" } ]); -/** - * Given a MIME type in the usual format (e.g. `text/csrc`), it returns a MIME type that can be passed down to the CKEditor - * code plugin. - * - * @param mimeType The MIME type to normalize, in the usual format (e.g. `text/c-src`). - * @returns the normalized MIME type (e.g. `text-c-src`). - */ -export function normalizeMimeTypeForCKEditor(mimeType: string) { - return mimeType.toLowerCase().replace(/[\W_]+/g, "-"); -} - let byHighlightJsNameMappings: Record | null = null; /** diff --git a/apps/client/src/services/mime_types.ts b/apps/client/src/services/mime_types.ts index 367d5e5ec..e009cb50f 100644 --- a/apps/client/src/services/mime_types.ts +++ b/apps/client/src/services/mime_types.ts @@ -1,5 +1,5 @@ -import type { MimeType } from "@triliumnext/commons"; -import { MIME_TYPE_AUTO, MIME_TYPES_DICT, normalizeMimeTypeForCKEditor } from "./mime_type_definitions.js"; +import { normalizeMimeTypeForCKEditor, type MimeType } from "@triliumnext/commons"; +import { MIME_TYPE_AUTO, MIME_TYPES_DICT } from "./mime_type_definitions.js"; import options from "./options.js"; let mimeTypes: MimeType[] | null = null; diff --git a/apps/client/src/widgets/type_widgets/editable_text.ts b/apps/client/src/widgets/type_widgets/editable_text.ts index e1faac24f..605a0b898 100644 --- a/apps/client/src/widgets/type_widgets/editable_text.ts +++ b/apps/client/src/widgets/type_widgets/editable_text.ts @@ -12,13 +12,13 @@ import appContext, { type CommandListenerData, type EventData } from "../../comp import dialogService from "../../services/dialog.js"; import options from "../../services/options.js"; import toast from "../../services/toast.js"; -import { normalizeMimeTypeForCKEditor } from "../../services/mime_type_definitions.js"; import { buildSelectedBackgroundColor } from "../../components/touch_bar.js"; import { buildConfig, buildToolbarConfig } from "./ckeditor/config.js"; import type FNote from "../../entities/fnote.js"; import { getMermaidConfig } from "../../services/mermaid.js"; import { PopupEditor, ClassicEditor, EditorWatchdog, type CKTextEditor, type MentionFeed, type WatchdogConfig } from "@triliumnext/ckeditor5"; import "@triliumnext/ckeditor5/index.css"; +import { normalizeMimeTypeForCKEditor } from "@triliumnext/commons"; const ENABLE_INSPECTOR = false; diff --git a/apps/server/src/services/import/markdown.ts b/apps/server/src/services/import/markdown.ts index a49a46897..3df4249a1 100644 --- a/apps/server/src/services/import/markdown.ts +++ b/apps/server/src/services/import/markdown.ts @@ -127,9 +127,10 @@ const renderer = new CustomMarkdownRenderer({ async: false }); import htmlSanitizer from "../html_sanitizer.js"; import importUtils from "./utils.js"; -import { getMimeTypeFromHighlightJs, MIME_TYPE_AUTO, normalizeMimeTypeForCKEditor } from "./mime_type_definitions.js"; +import { getMimeTypeFromHighlightJs, MIME_TYPE_AUTO } from "./mime_type_definitions.js"; import { ADMONITION_TYPE_MAPPINGS } from "../export/markdown.js"; import utils from "../utils.js"; +import { normalizeMimeTypeForCKEditor } from "@triliumnext/commons"; function renderToHtml(content: string, title: string) { // Double-escape slashes in math expression because they are otherwise consumed by the parser somewhere. diff --git a/apps/server/src/services/import/mime_type_definitions.ts b/apps/server/src/services/import/mime_type_definitions.ts index 3e7458116..7d5b5df49 100644 --- a/apps/server/src/services/import/mime_type_definitions.ts +++ b/apps/server/src/services/import/mime_type_definitions.ts @@ -188,17 +188,6 @@ export const MIME_TYPES_DICT: readonly MimeTypeDefinition[] = Object.freeze([ { title: "Z80", mime: "text/x-z80" } ]); -/** - * Given a MIME type in the usual format (e.g. `text/csrc`), it returns a MIME type that can be passed down to the CKEditor - * code plugin. - * - * @param mimeType The MIME type to normalize, in the usual format (e.g. `text/c-src`). - * @returns the normalized MIME type (e.g. `text-c-src`). - */ -export function normalizeMimeTypeForCKEditor(mimeType: string) { - return mimeType.toLowerCase().replace(/[\W_]+/g, "-"); -} - let byHighlightJsNameMappings: Record | null = null; /** diff --git a/packages/ckeditor5/src/plugins/syntax_highlighting/index.ts b/packages/ckeditor5/src/plugins/syntax_highlighting/index.ts index 5b1111be0..894939374 100644 --- a/packages/ckeditor5/src/plugins/syntax_highlighting/index.ts +++ b/packages/ckeditor5/src/plugins/syntax_highlighting/index.ts @@ -173,14 +173,6 @@ export default class SyntaxHighlighting extends Plugin { return; } - // Find the corresponding language for the given mimetype. - const highlightJsLanguage = this.config.mapLanguageName(mimeType); - - if (mimeType !== this.config.defaultMimeType && !highlightJsLanguage) { - console.warn(`Unsupported highlight.js for mime type ${mimeType}.`); - return; - } - // Don't highlight if the code is too big, as the typing performance will be highly degraded. if (codeBlock.childCount >= HIGHLIGHT_MAX_BLOCK_COUNT) { return; @@ -230,8 +222,13 @@ export default class SyntaxHighlighting extends Plugin { if (mimeType === this.config.defaultMimeType) { highlightRes = this.hljs.highlightAuto(text); } else { - highlightRes = this.hljs.highlight(text, { language: highlightJsLanguage }); + highlightRes = this.hljs.highlight(text, { language: mimeType }); } + + if (!highlightRes) { + return; + } + dbg("text\n" + text); dbg("html\n" + highlightRes.value); diff --git a/packages/commons/src/lib/mime_type.ts b/packages/commons/src/lib/mime_type.ts index 588affc83..a53a1f7ac 100644 --- a/packages/commons/src/lib/mime_type.ts +++ b/packages/commons/src/lib/mime_type.ts @@ -16,3 +16,14 @@ export interface MimeType extends MimeTypeDefinition { */ enabled: boolean; } + +/** + * Given a MIME type in the usual format (e.g. `text/csrc`), it returns a MIME type that can be passed down to the CKEditor + * code plugin. + * + * @param mimeType The MIME type to normalize, in the usual format (e.g. `text/c-src`). + * @returns the normalized MIME type (e.g. `text-c-src`). + */ +export function normalizeMimeTypeForCKEditor(mimeType: string) { + return mimeType.toLowerCase().replace(/[\W_]+/g, "-"); +} diff --git a/packages/highlightjs/src/index.ts b/packages/highlightjs/src/index.ts index 2bf98c154..c93ac6cf6 100644 --- a/packages/highlightjs/src/index.ts +++ b/packages/highlightjs/src/index.ts @@ -1,5 +1,5 @@ import hljs from "../node_modules/highlight.js/es/core.js"; -import type { MimeType } from "@triliumnext/commons"; +import { normalizeMimeTypeForCKEditor, type MimeType } from "@triliumnext/commons"; import definitions from "./syntax_highlighting.js"; import { type HighlightOptions } from "highlight.js"; @@ -12,7 +12,7 @@ export async function ensureMimeTypes(mimeTypes: MimeType[]) { continue; } - const mime = mimeType.mime; + const mime = normalizeMimeTypeForCKEditor(mimeType.mime); if (registeredMimeTypes.has(mime)) { continue; } @@ -25,7 +25,6 @@ export async function ensureMimeTypes(mimeTypes: MimeType[]) { } const language = (await loader).default; - console.info(`Registered highlighting for ${mime}.`); hljs.registerLanguage(mime, language); } } @@ -36,7 +35,7 @@ export function highlight(code: string, options: HighlightOptions) { } if (!registeredMimeTypes.has(options.language)) { - console.warn(`Unable to find highlighting for ${code}.`); + console.warn(`Unable to find highlighting for ${options.language}.`); return null; } diff --git a/packages/highlightjs/src/syntax_highlighting.ts b/packages/highlightjs/src/syntax_highlighting.ts index 0ccc543ff..6056b3ac1 100644 --- a/packages/highlightjs/src/syntax_highlighting.ts +++ b/packages/highlightjs/src/syntax_highlighting.ts @@ -1,6 +1,9 @@ +import { normalizeMimeTypeForCKEditor } from "@triliumnext/commons"; import type { LanguageFn } from "highlight.js"; -const byMimeType: Record | null)> = { +type MimeRecord = Record | null)>; + +const byMimeType: MimeRecord = { "text/plain": import("highlight.js/lib/languages/plaintext"), "application/dart": import("highlight.js/lib/languages/dart"), "application/edn": null, @@ -166,4 +169,10 @@ const byMimeType: Record | null)> = { "text/xml": import("highlight.js/lib/languages/xml"), } -export default byMimeType; +const normalizedByMimeType: MimeRecord = {}; +for (const [mimeType, loader] of Object.entries(byMimeType)) { + const normalizedMimeType = normalizeMimeTypeForCKEditor(mimeType); + normalizedByMimeType[normalizedMimeType] = loader; +} + +export default normalizedByMimeType;