Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-01 19:05:59 +01:00
Code Issues Packages Projects Releases Activity

chore(react/ribbon): display current note type

Browse Source
This commit is contained in:
Elian Doran
2025-08-21 20:38:19 +03:00
parent cabeb13adb
commit c0beab8a5d
4 changed files with 70 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
apps/client/src/widgets/ribbon/BasicPropertiesTab.tsx
View File

@@ -1,10 +1,11 @@
import { useCallback, useMemo } from "preact/hooks";
import { useMemo } from "preact/hooks";
import Dropdown from "../react/Dropdown";
import { NOTE_TYPES } from "../../services/note_types";
import { FormDivider, FormListBadge, FormListItem } from "../react/FormList";
import { t } from "../../services/i18n";
import { useTriliumOption } from "../react/hooks";
import { useNoteContext, useNoteProperty, useTriliumOption } from "../react/hooks";
import mime_types from "../../services/mime_types";
import { NoteType } from "@triliumnext/commons";
export default function BasicPropertiesTab() {
return (
@@ -18,44 +19,67 @@ function NoteTypeWidget() {
const noteTypes = useMemo(() => NOTE_TYPES.filter((nt) => !nt.reserved && !nt.static), []);
const [ codeNotesMimeTypes ] = useTriliumOption("codeNotesMimeTypes");
const mimeTypes = useMemo(() => mime_types.getMimeTypes().filter(mimeType => mimeType.enabled), [ codeNotesMimeTypes ]);
const { note } = useNoteContext();
const type = useNoteProperty(note, "type") ?? undefined;
const mime = useNoteProperty(note, "mime");
return (
<Dropdown dropdownContainerClassName="note-type-dropdown">
{noteTypes.map(noteType => {
const badges: FormListBadge[] = [];
if (noteType.isNew) {
badges.push({
className: "new-note-type-badge",
text: t("note_types.new-feature")
});
}
if (noteType.isBeta) {
badges.push({
text: t("note_types.beta-feature")
});
}
<>
<span>{t("basic_properties.note_type")}:</span> &nbsp;
<Dropdown
dropdownContainerClassName="note-type-dropdown"
text={<span className="note-type-desc">{findTypeTitle(type, mime)}</span>}
>
{noteTypes.map(noteType => {
const badges: FormListBadge[] = [];
if (noteType.isNew) {
badges.push({
className: "new-note-type-badge",
text: t("note_types.new-feature")
});
}
if (noteType.isBeta) {
badges.push({
text: t("note_types.beta-feature")
});
}
if (noteType.type !== "code") {
return (
<FormListItem
badges={badges}
>{noteType.title}</FormListItem>
);
} else {
return (
<>
<FormDivider />
<FormListItem disabled>
<strong>{noteType.title}</strong>
</FormListItem>
</>
)
}
})}
if (noteType.type !== "code") {
return (
<FormListItem
badges={badges}
>{noteType.title}</FormListItem>
);
} else {
return (
<>
<FormDivider />
<FormListItem disabled>
<strong>{noteType.title}</strong>
</FormListItem>
</>
)
}
})}
{mimeTypes.map(mimeType => (
<FormListItem>{mimeType.title}</FormListItem>
))}
</Dropdown>
{mimeTypes.map(mimeType => (
<FormListItem>{mimeType.title}</FormListItem>
))}
</Dropdown>
</>
)
}
function findTypeTitle(type?: NoteType, mime?: string) {
if (type === "code") {
const mimeTypes = mime_types.getMimeTypes();
const found = mimeTypes.find((mt) => mt.mime === mime);
return found ? found.title : mime;
} else {
const noteType = NOTE_TYPES.find((nt) => nt.type === type);
return noteType ? noteType.title : type;
}
}