Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-23 08:39:57 +01:00
Code Issues Packages Projects Releases Activity

chore(react/type_widget): react to code theme

Browse Source
This commit is contained in:
Elian Doran
2025-09-20 10:14:21 +03:00
parent 7a3ee7971c
commit 70a710be79
2 changed files with 15 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
apps/client/src/widgets/type_widgets/code/CodeMirror.tsx
View File

@@ -1,8 +1,9 @@
import { useEffect, useRef } from "preact/hooks";
import { EditorConfig, default as VanillaCodeMirror } from "@triliumnext/codemirror";
import { useSyncedRef, useTriliumEvent, useTriliumOptionBool } from "../../react/hooks";
import { EditorConfig, getThemeById, default as VanillaCodeMirror } from "@triliumnext/codemirror";
import { useSyncedRef, useTriliumEvent, useTriliumOption, useTriliumOptionBool } from "../../react/hooks";
import { refToJQuerySelector } from "../../react/react_utils";
import { RefObject } from "preact";
import { CODE_THEME_DEFAULT_PREFIX as DEFAULT_PREFIX } from "../constants";
interface CodeMirrorProps extends Omit<EditorConfig, "parent"> {
content: string;
@@ -17,6 +18,7 @@ export default function CodeMirror({ className, content, mime, ntxId, editorRef:
const parentRef = useSyncedRef(externalContainerRef);
const codeEditorRef = useRef<VanillaCodeMirror>();
const [ codeLineWrapEnabled ] = useTriliumOptionBool("codeLineWrapEnabled");
const [ codeNoteTheme ] = useTriliumOption("codeNoteTheme");
const initialized = $.Deferred();
// Integration within Trilium's event system.
@@ -50,6 +52,16 @@ export default function CodeMirror({ className, content, mime, ntxId, editorRef:
return () => codeEditor.destroy();
}, []);
// React to theme changes.
useEffect(() => {
if (codeEditorRef.current && codeNoteTheme.startsWith(DEFAULT_PREFIX)) {
const theme = getThemeById(codeNoteTheme.substring(DEFAULT_PREFIX.length));
if (theme) {
codeEditorRef.current.setTheme(theme);
}
}
}, [ codeEditorRef, codeNoteTheme ]);
// React to text changes.
useEffect(() => {
const codeEditor = codeEditorRef.current;

8
apps/client/src/widgets/type_widgets_old/abstract_code_type_widget.ts
View File

@@ -30,13 +30,7 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
async #initEditor() {
// Load the theme.
const themeId = options.get("codeNoteTheme");
if (themeId?.startsWith(DEFAULT_PREFIX)) {
const theme = getThemeById(themeId.substring(DEFAULT_PREFIX.length));
if (theme) {
await this.codeEditor.setTheme(theme);
}
}
}
/**