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

refactor(react/type_widgets): extract note types to different file

Browse Source
This commit is contained in:
Elian Doran 2025-10-05 15:55:25 +03:00
parent 3248654820
commit 22069d0aef
No known key found for this signature in database
2 changed files with 95 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
apps/client/src/widgets/NoteDetail.tsx
View File

@ -1,45 +1,13 @@
import { NoteType } from "@triliumnext/commons";
import { useLegacyImperativeHandlers, useNoteContext, useTriliumEvent } from "./react/hooks"
import { useNoteContext, useTriliumEvent } from "./react/hooks"
import FNote from "../entities/fnote";
import protected_session_holder from "../services/protected_session_holder";
import { useContext, useEffect, useRef, useState } from "preact/hooks";
import { useEffect, useRef, useState } from "preact/hooks";
import NoteContext from "../components/note_context";
import { ComponentChildren, isValidElement, VNode } from "preact";
import { isValidElement, VNode } from "preact";
import { TypeWidgetProps } from "./type_widgets/type_widget";
import "./NoteDetail.css";
import attributes from "../services/attributes";
/**
* A `NoteType` altered by the note detail widget, taking into consideration whether the note is editable or not and adding special note types such as an empty one,
* for protected session or attachment information.
*/
type ExtendedNoteType = Exclude<NoteType, "launcher" | "text" | "code"> | "empty" | "readOnlyCode" | "readOnlyText" | "editableText" | "editableCode" | "attachmentDetail" | "attachmentList" | "protectedSession" | "aiChat";
type TypeWidget = (props: TypeWidgetProps) => VNode;
const TYPE_MAPPINGS: Record<ExtendedNoteType, () => Promise<{ default: TypeWidget } | TypeWidget> | ((props: TypeWidgetProps) => VNode)> = {
"empty": () => import("./type_widgets/Empty"),
"doc": () => import("./type_widgets/Doc"),
"search": () => <div className="note-detail-none note-detail-printable" />,
"protectedSession": () => import("./type_widgets/ProtectedSession"),
"book": () => import("./type_widgets/Book"),
"contentWidget": () => import("./type_widgets/ContentWidget"),
"webView": () => import("./type_widgets/WebView"),
"file": () => import("./type_widgets/File"),
"image": () => import("./type_widgets/Image"),
"readOnlyCode": async () => (await import("./type_widgets/code/Code")).ReadOnlyCode,
"editableCode": async () => (await import("./type_widgets/code/Code")).EditableCode,
"mermaid": () => import("./type_widgets/Mermaid"),
"mindMap": () => import("./type_widgets/MindMap"),
"attachmentList": async () => (await import("./type_widgets/Attachment")).AttachmentList,
"attachmentDetail": async () => (await import("./type_widgets/Attachment")).AttachmentDetail,
"readOnlyText": () => import("./type_widgets/text/ReadOnlyText"),
"editableText": () => import("./type_widgets/text/EditableText"),
"render": () => import("./type_widgets/Render"),
"canvas": () => import("./type_widgets/Canvas"),
"relationMap": () => import("./type_widgets/relation_map/RelationMap"),
"noteMap": () => import("./type_widgets/NoteMap"),
"aiChat": () => import("./type_widgets/AiChat")
};
import { ExtendedNoteType, TYPE_MAPPINGS } from "./note_types";
/**
* The note detail is in charge of rendering the content of a note, by determining its type (e.g. text, code) and using the appropriate view widget.
@ -192,7 +160,7 @@ function useNoteInfo() {
}
async function getCorrespondingWidget(type: ExtendedNoteType): Promise<null | ((props: TypeWidgetProps) => VNode)> {
const correspondingType = TYPE_MAPPINGS[type];
const correspondingType = TYPE_MAPPINGS[type].view;
if (!correspondingType) return null;
const result = await correspondingType();

90
apps/client/src/widgets/note_types.tsx Normal file
View File

@ -0,0 +1,90 @@
/**
* @module
* Contains the definitions for all the note types supported by the application.
*/
import { NoteType } from "@triliumnext/commons";
import TypeWidget from "./type_widgets_old/type_widget";
import { TypeWidgetProps } from "./type_widgets/type_widget";
import { VNode } from "preact";
/**
* A `NoteType` altered by the note detail widget, taking into consideration whether the note is editable or not and adding special note types such as an empty one,
* for protected session or attachment information.
*/
export type ExtendedNoteType = Exclude<NoteType, "launcher" | "text" | "code"> | "empty" | "readOnlyCode" | "readOnlyText" | "editableText" | "editableCode" | "attachmentDetail" | "attachmentList" | "protectedSession" | "aiChat";
type NoteTypeView = () => Promise<{ default: TypeWidget } | TypeWidget> | ((props: TypeWidgetProps) => VNode);
interface NoteTypeMapping {
view: NoteTypeView;
}
export const TYPE_MAPPINGS: Record<ExtendedNoteType, NoteTypeMapping> = {
empty: {
view: () => import("./type_widgets/Empty"),
},
doc: {
view: () => import("./type_widgets/Doc")
},
search: {
view: () => <div className="note-detail-none note-detail-printable" />
},
protectedSession: {
view: () => import("./type_widgets/ProtectedSession")
},
book: {
view: () => import("./type_widgets/Book")
},
contentWidget: {
view: () => import("./type_widgets/ContentWidget")
},
webView: {
view: () => import("./type_widgets/WebView")
},
file: {
view: () => import("./type_widgets/File")
},
image: {
view: () => import("./type_widgets/Image")
},
readOnlyCode: {
view: async () => (await import("./type_widgets/code/Code")).ReadOnlyCode
},
editableCode: {
view: async () => (await import("./type_widgets/code/Code")).EditableCode
},
mermaid: {
view: () => import("./type_widgets/Mermaid")
},
mindMap: {
view: () => import("./type_widgets/MindMap")
},
attachmentList: {
view: async () => (await import("./type_widgets/Attachment")).AttachmentList
},
attachmentDetail: {
view: async () => (await import("./type_widgets/Attachment")).AttachmentDetail
},
readOnlyText: {
view: () => import("./type_widgets/text/ReadOnlyText")
},
editableText: {
view: () => import("./type_widgets/text/EditableText")
},
render: {
view: () => import("./type_widgets/Render")
},
canvas: {
view: () => import("./type_widgets/Canvas")
},
relationMap: {
view: () => import("./type_widgets/relation_map/RelationMap")
},
noteMap: {
view: () => import("./type_widgets/NoteMap")
},
aiChat: {
view: () => import("./type_widgets/AiChat")
}
};