gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-11 08:58:58 +01:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

chore(react/type_widget): finalize readonly code

Browse Source
This commit is contained in:
Elian Doran 2025-09-20 09:06:55 +03:00
parent f72087acc3
commit 6517dd1190
No known key found for this signature in database
4 changed files with 23 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,18 +1,35 @@
import { useEffect, useRef } from "preact/hooks";
import { EditorConfig, default as VanillaCodeMirror } from "@triliumnext/codemirror";
import { useTriliumOptionBool } from "../../react/hooks";
import { useTriliumEvent, useTriliumOptionBool } from "../../react/hooks";
import { refToJQuerySelector } from "../../react/react_utils";
interface CodeMirrorProps extends Omit<EditorConfig, "parent"> {
content: string;
mime: string;
className?: string;
ntxId: string | null | undefined;
}
export default function CodeMirror({ className, content, mime, ...extraOpts }: CodeMirrorProps) {
export default function CodeMirror({ className, content, mime, ntxId, ...extraOpts }: CodeMirrorProps) {
const parentRef = useRef<HTMLPreElement>(null);
const codeEditorRef = useRef<VanillaCodeMirror>(null);
const [ codeLineWrapEnabled ] = useTriliumOptionBool("codeLineWrapEnabled");
const initialized = $.Deferred();
// Integration within Trilium's event system.
useTriliumEvent("executeWithCodeEditor", async ({ resolve, ntxId: eventNtxId }) => {
if (eventNtxId !== ntxId) return;
await initialized.promise();
resolve(codeEditorRef.current!);
});
useTriliumEvent("executeWithContentElement", async ({ resolve, ntxId: eventNtxId}) => {
if (eventNtxId !== ntxId) return;
await initialized.promise();
resolve(refToJQuerySelector(parentRef));
});
// Create CodeMirror instance.
useEffect(() => {
if (!parentRef.current) return;
@ -22,10 +39,12 @@ export default function CodeMirror({ className, content, mime, ...extraOpts }: C
...extraOpts
});
codeEditorRef.current = codeEditor;
initialized.resolve();
return () => codeEditor.destroy();
}, []);
// React to text changes.
useEffect(() => {
const codeEditor = codeEditorRef.current;
codeEditor?.setText(content ?? "");

3
apps/client/src/widgets/type_widgets/code/ReadOnlyCode.tsx
View File

@ -5,7 +5,7 @@ import CodeMirror from "./CodeMirror";
import utils from "../../../services/utils";
import { useNoteBlob } from "../../react/hooks";
export default function ReadOnlyCode({ note, viewScope }: TypeWidgetProps) {
export default function ReadOnlyCode({ note, viewScope, ntxId }: TypeWidgetProps) {
const [ content, setContent ] = useState("");
const blob = useNoteBlob(note);
@ -22,6 +22,7 @@ export default function ReadOnlyCode({ note, viewScope }: TypeWidgetProps) {
content={content}
mime={note.mime}
readOnly
ntxId={ntxId}
/>
</div>
)

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

@ -82,16 +82,6 @@ export default class AbstractCodeTypeWidget extends TypeWidget {
this.updateBackgroundColor("unset");
}
async executeWithCodeEditorEvent({ resolve, ntxId }: EventData<"executeWithCodeEditor">) {
if (!this.isNoteContext(ntxId)) {
return;
}
await this.initialized;
resolve(this.codeEditor);
}
async entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
if (loadResults.isOptionReloaded("codeNoteTheme")) {
const themeId = options.get("codeNoteTheme");

28
apps/client/src/widgets/type_widgets_old/read_only_code.ts
View File

@ -1,28 +0,0 @@
import type { EventData } from "../../components/app_context.js";
import type FNote from "../../entities/fnote.js";
import AbstractCodeTypeWidget from "./abstract_code_type_widget.js";
import utils from "../../services/utils.js";
const TPL = /*html*/`
`;
export default class ReadOnlyCodeTypeWidget extends AbstractCodeTypeWidget {
async doRefresh(note: FNote) {
const blob = await this.note?.getBlob();
if (!blob) return;
this._update(note, content);
this.show();
}
async executeWithContentElementEvent({ resolve, ntxId }: EventData<"executeWithContentElement">) {
if (!this.isNoteContext(ntxId)) {
return;
}
await this.initialized;
resolve(this.$editor);
}
}