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

chore(react/collections/calendar): port dragging items

Browse Source
This commit is contained in:
Elian Doran 2025-09-06 10:36:32 +03:00
parent f0b5954c54
commit cfddb6f04e
No known key found for this signature in database
2 changed files with 43 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
apps/client/src/widgets/collections/calendar/index.tsx
View File

@ -1,4 +1,4 @@
import { DateSelectArg, EventSourceFuncArg, LocaleInput, PluginDef } from "@fullcalendar/core/index.js";
import { DateSelectArg, EventChangeArg, EventSourceFuncArg, LocaleInput, PluginDef } from "@fullcalendar/core/index.js";
import { ViewModeProps } from "../interface";
import Calendar from "./calendar";
import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks";
@ -14,6 +14,7 @@ import dialog from "../../../services/dialog";
import { t } from "../../../services/i18n";
import { buildEvents, buildEventsForCalendar } from "./event_builder";
import { newEvent } from "./api";
import froca from "../../../services/froca";
interface CalendarViewData {
@ -81,6 +82,46 @@ export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarVi
newEvent(note, { title, startDate, endDate, startTime, endTime });
}, [ note ]);
const onEventChange = useCallback(async (e: EventChangeArg) => {
// Handle start and end date
let { startDate, endDate } = parseStartEndDateFromEvent(e.event);
if (!startDate) {
return;
}
const noteId = e.event.extendedProps.noteId;
// Don't store the end date if it's empty.
if (endDate === startDate) {
endDate = undefined;
}
// Update start date
const note = await froca.getNote(noteId);
if (!note) {
return;
}
// Since they can be customized via calendar:startDate=$foo and calendar:endDate=$bar we need to determine the
// attributes to be effectively updated
const startAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:startDate").shift()?.value||"startDate";
const endAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:endDate").shift()?.value||"endDate";
setLabel(noteId, startAttribute, startDate);
setLabel(noteId, endAttribute, endDate);
// Update start time and end time if needed.
if (!e.event.allDay) {
const startAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:startTime").shift()?.value||"startTime";
const endAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:endTime").shift()?.value||"endTime";
const { startTime, endTime } = parseStartEndTimeFromEvent(e.event);
if (startTime && endTime) {
setLabel(noteId, startAttribute, startTime);
setLabel(noteId, endAttribute, endTime);
}
}
}, []);
return (plugins &&
<div className="calendar-view" ref={containerRef}>
<Calendar
@ -100,6 +141,7 @@ export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarVi
locale={locale}
editable={isEditable} selectable={isEditable}
select={onCalendarSelection}
eventChange={onEventChange}
viewDidMount={({ view }) => {
if (initialView.current !== view.type) {
initialView.current = view.type;

40
apps/client/src/widgets/view_widgets/calendar_view.ts
View File

@ -35,8 +35,6 @@ export default class CalendarView extends ViewMode<{}> {
async renderList(): Promise<JQuery<HTMLElement> | undefined> {
const calendar = new Calendar(this.$calendarContainer[0], {
select: (e) => this.#onCalendarSelection(e),
eventChange: (e) => this.#onEventMoved(e),
height: "100%",
nowIndicator: true,
eventDidMount: (e) => {
@ -112,44 +110,6 @@ export default class CalendarView extends ViewMode<{}> {
}
}
async #onEventMoved(e: EventChangeArg) {
// Handle start and end date
let { startDate, endDate } = this.#parseStartEndDateFromEvent(e.event);
if (!startDate) {
return;
}
const noteId = e.event.extendedProps.noteId;
// Don't store the end date if it's empty.
if (endDate === startDate) {
endDate = undefined;
}
// Update start date
const note = await froca.getNote(noteId);
if (!note) {
return;
}
// Since they can be customized via calendar:startDate=$foo and calendar:endDate=$bar we need to determine the
// attributes to be effectively updated
const startAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:startDate").shift()?.value||"startDate";
const endAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:endDate").shift()?.value||"endDate";
attributes.setAttribute(note, "label", startAttribute, startDate);
attributes.setAttribute(note, "label", endAttribute, endDate);
// Update start time and end time if needed.
if (!e.event.allDay) {
const startAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:startTime").shift()?.value||"startTime";
const endAttribute = note.getAttributes("label").filter(attr => attr.name == "calendar:endTime").shift()?.value||"endTime";
const { startTime, endTime } = this.#parseStartEndTimeFromEvent(e.event);
attributes.setAttribute(note, "label", startAttribute, startTime);
attributes.setAttribute(note, "label", endAttribute, endTime);
}
}
async onEntitiesReloaded({ loadResults }: EventData<"entitiesReloaded">) {
// Refresh note IDs if they got changed.
if (loadResults.getBranchRows().some((branch) => branch.parentNoteId === this.parentNote.noteId)) {