mirror of
https://github.com/zadam/trilium.git
synced 2025-12-06 15:34:26 +01:00
chore(react/launch_bar): reimplement week notes
This commit is contained in:
parent
d283f5dbb4
commit
20f44cc64f
@ -46,28 +46,6 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
|
||||
this.manageFirstDayOfWeek();
|
||||
this.initWeekCalculation();
|
||||
|
||||
// Week click
|
||||
this.$dropdownContent.on("click", ".calendar-week-number", async (ev) => {
|
||||
if (!this.weekNoteEnable) {
|
||||
return;
|
||||
}
|
||||
|
||||
const week = $(ev.target).closest(".calendar-week-number").attr("data-calendar-week-number");
|
||||
|
||||
if (week) {
|
||||
const note = await dateNoteService.getWeekNote(week);
|
||||
|
||||
if (note) {
|
||||
appContext.tabManager.getActiveContext()?.setNote(note.noteId);
|
||||
this.dropdown?.hide();
|
||||
} else {
|
||||
toastService.showError(t("calendar.cannot_find_week_note"));
|
||||
}
|
||||
}
|
||||
|
||||
ev.stopPropagation();
|
||||
});
|
||||
|
||||
// Handle click events for the entire calendar widget
|
||||
this.$dropdownContent.on("click", (e) => {
|
||||
const $target = $(e.target);
|
||||
@ -85,16 +63,6 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
|
||||
});
|
||||
}
|
||||
|
||||
private async getWeekNoteEnable() {
|
||||
const noteId = await server.get<string[]>(`search/${encodeURIComponent('#calendarRoot')}`);
|
||||
if (noteId.length === 0) {
|
||||
this.weekNoteEnable = false;
|
||||
return;
|
||||
}
|
||||
const noteAttributes = await server.get<AttributeRow[]>(`notes/${noteId}/attributes`);
|
||||
this.weekNoteEnable = noteAttributes.some(a => a.name === 'enableWeekNote');
|
||||
}
|
||||
|
||||
initWeekCalculation() {
|
||||
this.weekCalculationOptions = {
|
||||
firstWeekType: options.getInt("firstWeekOfYear") || 0,
|
||||
@ -109,11 +77,10 @@ export default class CalendarWidget extends RightDropdownButtonWidget {
|
||||
}
|
||||
|
||||
createWeekNumber(weekNumber: number) {
|
||||
const weekNoteId = this.date.local().format('YYYY-') + 'W' + String(weekNumber).padStart(2, '0');
|
||||
|
||||
let $newWeekNumber;
|
||||
|
||||
if (this.weekNoteEnable) {
|
||||
$newWeekNumber = $("<a>").addClass("calendar-date");
|
||||
if (this.weekNotes.includes(weekNoteId)) {
|
||||
$newWeekNumber.addClass("calendar-date-exists").attr("data-href", `#root/${weekNoteId}`);
|
||||
}
|
||||
|
||||
@ -30,6 +30,7 @@ export interface CalendarArgs {
|
||||
todaysDate: Dayjs;
|
||||
activeDate: Dayjs | null;
|
||||
onDateClicked(date: string, e: TargetedMouseEvent<HTMLAnchorElement>): void;
|
||||
onWeekClicked?: (week: string, e: TargetedMouseEvent<HTMLAnchorElement>) => void;
|
||||
}
|
||||
|
||||
export default function Calendar(args: CalendarArgs) {
|
||||
@ -76,7 +77,7 @@ function PreviousMonthDays({ date, info: { dates, weekNumbers }, ...args }: { da
|
||||
|
||||
return (
|
||||
<>
|
||||
<CalendarWeek weekNumber={weekNumbers[0]} />
|
||||
<CalendarWeek date={date} weekNumber={weekNumbers[0]} onWeekClicked={args.onWeekClicked} />
|
||||
{dates.map(date => <CalendarDay date={date} dateNotesForMonth={dateNotesForPrevMonth} className="calendar-date-prev-month" {...args} />)}
|
||||
</>
|
||||
)
|
||||
@ -96,7 +97,7 @@ function CurrentMonthDays({ date, firstDayOfWeekISO, ...args }: { date: Dayjs, f
|
||||
while (dateCursor.month() === currentMonth) {
|
||||
const weekNumber = getWeekNumber(dateCursor, firstDayOfWeekISO);
|
||||
if (dateCursor.isoWeekday() === firstDayOfWeekISO) {
|
||||
items.push(<CalendarWeek weekNumber={weekNumber} />)
|
||||
items.push(<CalendarWeek date={dateCursor} weekNumber={weekNumber} onWeekClicked={args.onWeekClicked} />)
|
||||
}
|
||||
|
||||
items.push(<CalendarDay date={dateCursor} dateNotesForMonth={dateNotesForCurMonth} {...args} />)
|
||||
@ -140,12 +141,20 @@ function CalendarDay({ date, dateNotesForMonth, className, activeDate, todaysDat
|
||||
);
|
||||
}
|
||||
|
||||
function CalendarWeek({ weekNumber }: { weekNumber: number }) {
|
||||
function CalendarWeek({ date, weekNumber, onWeekClicked }: { weekNumber: number } & Pick<CalendarArgs, "date" | "onWeekClicked">) {
|
||||
if (onWeekClicked) {
|
||||
const weekNoteId = date.local().format('YYYY-') + 'W' + String(weekNumber).padStart(2, '0');
|
||||
return (
|
||||
<span className="calendar-week-number calendar-week-number-disabled">{weekNumber}</span>
|
||||
<a
|
||||
className="calendar-week-number calendar-date"
|
||||
onClick={(e) => onWeekClicked(weekNoteId, e)}
|
||||
>{weekNumber}</a>
|
||||
)
|
||||
}
|
||||
|
||||
return (<span className="calendar-week-number calendar-week-number-disabled">{weekNumber}</span>);
|
||||
}
|
||||
|
||||
export function getMonthInformation(date: Dayjs, firstDayISO: number, firstDayOfWeekISO: number) {
|
||||
return {
|
||||
prevMonth: getPrevMonthDays(date, firstDayISO, firstDayOfWeekISO),
|
||||
|
||||
@ -12,6 +12,7 @@ import FormTextBox from "../react/FormTextBox";
|
||||
import toast from "../../services/toast";
|
||||
import date_notes from "../../services/date_notes";
|
||||
import { Dropdown } from "bootstrap";
|
||||
import search from "../../services/search";
|
||||
|
||||
const MONTHS = [
|
||||
t("calendar.january"),
|
||||
@ -33,6 +34,19 @@ export default function CalendarWidget({ launcherNote }: { launcherNote: FNote }
|
||||
const [ calendarArgs, setCalendarArgs ] = useState<Pick<CalendarArgs, "activeDate" | "todaysDate">>();
|
||||
const [ date, setDate ] = useState<Dayjs>();
|
||||
const dropdownRef = useRef<Dropdown>(null);
|
||||
const [ enableWeekNotes, setEnableWeekNotes ] = useState(false);
|
||||
const calendarRootRef = useRef<FNote>();
|
||||
|
||||
async function checkEnableWeekNotes() {
|
||||
if (!calendarRootRef.current) {
|
||||
const notes = await search.searchForNotes("#calendarRoot");
|
||||
if (!notes.length) return;
|
||||
calendarRootRef.current = notes[0];
|
||||
}
|
||||
|
||||
if (!calendarRootRef.current) return;
|
||||
setEnableWeekNotes(calendarRootRef.current.hasLabel("enableWeekNote"));
|
||||
}
|
||||
|
||||
return (
|
||||
<LaunchBarDropdownButton
|
||||
@ -46,6 +60,7 @@ export default function CalendarWidget({ launcherNote }: { launcherNote: FNote }
|
||||
todaysDate,
|
||||
});
|
||||
setDate(dayjs(activeDate || todaysDate).startOf('month'));
|
||||
checkEnableWeekNotes();
|
||||
}}
|
||||
dropdownRef={dropdownRef}
|
||||
dropdownOptions={{
|
||||
@ -66,6 +81,16 @@ export default function CalendarWidget({ launcherNote }: { launcherNote: FNote }
|
||||
}
|
||||
e.stopPropagation();
|
||||
}}
|
||||
onWeekClicked={enableWeekNotes ? async (week, e) => {
|
||||
const note = await date_notes.getWeekNote(week);
|
||||
if (note) {
|
||||
appContext.tabManager.getActiveContext()?.setNote(note.noteId);
|
||||
dropdownRef.current?.hide();
|
||||
} else {
|
||||
toast.showError(t("calendar.cannot_find_week_note"));
|
||||
}
|
||||
e.stopPropagation();
|
||||
} : undefined}
|
||||
{...calendarArgs}
|
||||
/>
|
||||
</div>}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user