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

chore(react/type_widget): pass error information

Browse Source
This commit is contained in:
Elian Doran 2025-09-20 12:41:39 +03:00
parent 2f4e13b1bb
commit 695e8489ad
No known key found for this signature in database
4 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/client/src/widgets/react/Admonition.tsx
View File

@ -3,11 +3,12 @@ import { ComponentChildren } from "preact";
interface AdmonitionProps { interface AdmonitionProps {
type: "warning" | "note" | "caution"; type: "warning" | "note" | "caution";
children: ComponentChildren; children: ComponentChildren;
className?: string;
} }
export default function Admonition({ type, children }: AdmonitionProps) { export default function Admonition({ type, children, className }: AdmonitionProps) {
return ( return (
<div className={`admonition ${type}`} role="alert"> <div className={`admonition ${type} ${className}`} role="alert">
{children} {children}
</div> </div>
) )

15
apps/client/src/widgets/type_widgets/helpers/SplitEditor.tsx
View File

@ -1,8 +1,13 @@
import { isMobile } from "../../../services/utils"; import { isMobile } from "../../../services/utils";
import { useNoteLabel, useNoteLabelBoolean, useTriliumOption } from "../../react/hooks"; import Admonition from "../../react/Admonition";
import { useNoteLabelBoolean, useTriliumOption } from "../../react/hooks";
import { TypeWidgetProps } from "../type_widget"; import { TypeWidgetProps } from "../type_widget";
import "./SplitEditor.css"; import "./SplitEditor.css";
interface SplitEditorProps extends TypeWidgetProps {
error?: string | null;
}
/** /**
* Abstract `TypeWidget` which contains a preview and editor pane, each displayed on half of the available screen. * Abstract `TypeWidget` which contains a preview and editor pane, each displayed on half of the available screen.
* *
@ -12,19 +17,21 @@ import "./SplitEditor.css";
* - Can display errors to the user via {@link setError}. * - Can display errors to the user via {@link setError}.
* - Horizontal or vertical orientation for the editor/preview split, adjustable via the switch split orientation button floating button. * - Horizontal or vertical orientation for the editor/preview split, adjustable via the switch split orientation button floating button.
*/ */
export default function SplitEditor({ note }: TypeWidgetProps) { export default function SplitEditor({ note, error }: SplitEditorProps) {
const splitEditorOrientation = useSplitOrientation(); const splitEditorOrientation = useSplitOrientation();
const [ readOnly ] = useNoteLabelBoolean(note, "readOnly"); const [ readOnly ] = useNoteLabelBoolean(note, "readOnly");
const editor = (!readOnly && const editor = (!readOnly &&
<div className="note-detail-split-editor-col"> <div className="note-detail-split-editor-col">
<div className="note-detail-split-editor">Detail goes here.</div> <div className="note-detail-split-editor">Detail goes here.</div>
<div className="admonition caution note-detail-error-container hidden-ext">Errors go here.</div> {error && <Admonition type="caution" className="note-detail-error-container">
{error}
</Admonition>}
</div> </div>
); );
const preview = ( const preview = (
<div className="note-detail-split-preview-col"> <div className={`note-detail-split-preview-col ${error ? "on-error" : ""}`}>
<div className="note-detail-split-preview">Preview goes here</div> <div className="note-detail-split-preview">Preview goes here</div>
<div className="btn-group btn-group-sm map-type-switcher content-floating-buttons preview-buttons bottom-right" role="group">Buttons go here</div> <div className="btn-group btn-group-sm map-type-switcher content-floating-buttons preview-buttons bottom-right" role="group">Buttons go here</div>
</div> </div>

5
apps/client/src/widgets/type_widgets/helpers/SvgSplitEditor.tsx
View File

@ -3,6 +3,9 @@ import SplitEditor from "./SplitEditor";
export default function SvgSplitEditor(props: TypeWidgetProps) { export default function SvgSplitEditor(props: TypeWidgetProps) {
return ( return (
<SplitEditor {...props} /> <SplitEditor
error="Hi there"
{...props}
/>
) )
} }

6
apps/client/src/widgets/type_widgets_old/abstract_split_type_widget.ts
View File

@ -143,12 +143,6 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
return []; return [];
} }
setError(message: string | null | undefined) {
this.$errorContainer.toggleClass("hidden-ext", !message);
this.$preview.toggleClass("on-error", !!message);
this.$errorContainer.text(message ?? "");
}
getData() { getData() {
return this.editorTypeWidget.getData(); return this.editorTypeWidget.getData();
} }