mirror of
https://github.com/zadam/trilium.git
synced 2025-11-01 19:05:59 +01:00
chore(react/ribbon): finalize note type selection
This commit is contained in:
@@ -1,42 +0,0 @@
|
|||||||
import { Dropdown } from "bootstrap";
|
|
||||||
import { NOTE_TYPES } from "../services/note_types.js";
|
|
||||||
import { t } from "../services/i18n.js";
|
|
||||||
import dialogService from "../services/dialog.js";
|
|
||||||
import mimeTypesService from "../services/mime_types.js";
|
|
||||||
import NoteContextAwareWidget from "./note_context_aware_widget.js";
|
|
||||||
import server from "../services/server.js";
|
|
||||||
import type { EventData } from "../components/app_context.js";
|
|
||||||
import type { NoteType } from "../entities/fnote.js";
|
|
||||||
import type FNote from "../entities/fnote.js";
|
|
||||||
|
|
||||||
const NOT_SELECTABLE_NOTE_TYPES = NOTE_TYPES.filter((nt) => nt.reserved || nt.static).map((nt) => nt.type);
|
|
||||||
|
|
||||||
export default class NoteTypeWidget extends NoteContextAwareWidget {
|
|
||||||
|
|
||||||
private dropdown!: Dropdown;
|
|
||||||
private $noteTypeDropdown!: JQuery<HTMLElement>;
|
|
||||||
private $noteTypeButton!: JQuery<HTMLElement>;
|
|
||||||
private $noteTypeDesc!: JQuery<HTMLElement>;
|
|
||||||
|
|
||||||
doRender() {
|
|
||||||
this.$widget = $(TPL);
|
|
||||||
|
|
||||||
this.dropdown = Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']")[0]);
|
|
||||||
|
|
||||||
this.$widget.on("show.bs.dropdown", () => this.renderDropdown());
|
|
||||||
|
|
||||||
this.$noteTypeDropdown = this.$widget.find(".note-type-dropdown");
|
|
||||||
this.$noteTypeButton = this.$widget.find(".note-type-button");
|
|
||||||
|
|
||||||
this.$widget.on("click", ".dropdown-item", () => this.dropdown.toggle());
|
|
||||||
}
|
|
||||||
|
|
||||||
async refreshWithNote(note: FNote) {
|
|
||||||
this.$noteTypeButton.prop("disabled", () => NOT_SELECTABLE_NOTE_TYPES.includes(note.type));
|
|
||||||
|
|
||||||
this.$noteTypeDesc.text(await this.findTypeTitle(note.type, note.mime));
|
|
||||||
|
|
||||||
this.dropdown.hide();
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -21,6 +21,7 @@ function NoteTypeWidget() {
|
|||||||
const noteTypes = useMemo(() => NOTE_TYPES.filter((nt) => !nt.reserved && !nt.static), []);
|
const noteTypes = useMemo(() => NOTE_TYPES.filter((nt) => !nt.reserved && !nt.static), []);
|
||||||
const [ codeNotesMimeTypes ] = useTriliumOption("codeNotesMimeTypes");
|
const [ codeNotesMimeTypes ] = useTriliumOption("codeNotesMimeTypes");
|
||||||
const mimeTypes = useMemo(() => mime_types.getMimeTypes().filter(mimeType => mimeType.enabled), [ codeNotesMimeTypes ]);
|
const mimeTypes = useMemo(() => mime_types.getMimeTypes().filter(mimeType => mimeType.enabled), [ codeNotesMimeTypes ]);
|
||||||
|
const notSelectableNoteTypes = useMemo(() => NOTE_TYPES.filter((nt) => nt.reserved || nt.static).map((nt) => nt.type), []);
|
||||||
|
|
||||||
const { note } = useNoteContext();
|
const { note } = useNoteContext();
|
||||||
const currentNoteType = useNoteProperty(note, "type") ?? undefined;
|
const currentNoteType = useNoteProperty(note, "type") ?? undefined;
|
||||||
@@ -50,6 +51,7 @@ function NoteTypeWidget() {
|
|||||||
<Dropdown
|
<Dropdown
|
||||||
dropdownContainerClassName="note-type-dropdown"
|
dropdownContainerClassName="note-type-dropdown"
|
||||||
text={<span className="note-type-desc">{findTypeTitle(currentNoteType, currentNoteMime)}</span>}
|
text={<span className="note-type-desc">{findTypeTitle(currentNoteType, currentNoteMime)}</span>}
|
||||||
|
disabled={notSelectableNoteTypes.includes(currentNoteType ?? "text")}
|
||||||
>
|
>
|
||||||
{noteTypes.map(({ isNew, isBeta, type, mime, title }) => {
|
{noteTypes.map(({ isNew, isBeta, type, mime, title }) => {
|
||||||
const badges: FormListBadge[] = [];
|
const badges: FormListBadge[] = [];
|
||||||
@@ -99,7 +101,7 @@ function NoteTypeWidget() {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
function findTypeTitle(type?: NoteType, mime?: string) {
|
function findTypeTitle(type?: NoteType, mime?: string | null) {
|
||||||
if (type === "code") {
|
if (type === "code") {
|
||||||
const mimeTypes = mime_types.getMimeTypes();
|
const mimeTypes = mime_types.getMimeTypes();
|
||||||
const found = mimeTypes.find((mt) => mt.mime === mime);
|
const found = mimeTypes.find((mt) => mt.mime === mime);
|
||||||
|
|||||||
@@ -119,7 +119,8 @@ export const ALLOWED_NOTE_TYPES = [
|
|||||||
"book",
|
"book",
|
||||||
"webView",
|
"webView",
|
||||||
"code",
|
"code",
|
||||||
"mindMap"
|
"mindMap",
|
||||||
|
"aiChat"
|
||||||
] as const;
|
] as const;
|
||||||
export type NoteType = (typeof ALLOWED_NOTE_TYPES)[number];
|
export type NoteType = (typeof ALLOWED_NOTE_TYPES)[number];
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user