Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-28 08:46:43 +01:00
Code Issues Packages Projects Releases Activity

Revert "chore(collections/calendar): experiment with avoiding floating buttons"

Browse Source 
This reverts commit 6c4ac347db.
This commit is contained in:
Elian Doran
2025-09-06 13:17:21 +03:00
parent 6c4ac347db
commit 05ebe821f2
2 changed files with 2 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -3,7 +3,7 @@ import { ViewModeProps } from "../interface";
import Calendar from "./calendar"; import Calendar from "./calendar";
import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks"; import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks";
import "./index.css"; import "./index.css";
import { useFloatingButtonsWidth, useNoteLabel, useNoteLabelBoolean, useResizeObserver, useSpacedUpdate, useTriliumEvent, useTriliumOption, useTriliumOptionInt } from "../../react/hooks"; import { useNoteLabel, useNoteLabelBoolean, useResizeObserver, useSpacedUpdate, useTriliumEvent, useTriliumOption, useTriliumOptionInt } from "../../react/hooks";
import { LOCALE_IDS } from "@triliumnext/commons"; import { LOCALE_IDS } from "@triliumnext/commons";
import { Calendar as FullCalendar } from "@fullcalendar/core"; import { Calendar as FullCalendar } from "@fullcalendar/core";
import { parseStartEndDateFromEvent, parseStartEndTimeFromEvent } from "./utils"; import { parseStartEndDateFromEvent, parseStartEndTimeFromEvent } from "./utils";
@@ -146,14 +146,13 @@ export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarVi
function CalendarHeader({ calendarRef }: { calendarRef: RefObject<FullCalendar> }) { function CalendarHeader({ calendarRef }: { calendarRef: RefObject<FullCalendar> }) {
const currentViewType = calendarRef.current?.view?.type; const currentViewType = calendarRef.current?.view?.type;
const currentViewData = CALENDAR_VIEWS.find(v => calendarRef.current && v.type === currentViewType); const currentViewData = CALENDAR_VIEWS.find(v => calendarRef.current && v.type === currentViewType);
const floatingButtonsWidth = useFloatingButtonsWidth();
// Wait for the calendar ref to become available. // Wait for the calendar ref to become available.
const [ ready, setReady ] = useState(false); const [ ready, setReady ] = useState(false);
useEffect(() => setReady(true), []); useEffect(() => setReady(true), []);
return (ready && return (ready &&
<div className="calendar-header" style={{ marginRight: floatingButtonsWidth }}> <div className="calendar-header">
<span className="title">{calendarRef.current?.view.title}</span> <span className="title">{calendarRef.current?.view.title}</span>
<ButtonGroup> <ButtonGroup>
{CALENDAR_VIEWS.map(viewData => ( {CALENDAR_VIEWS.map(viewData => (

18
apps/client/src/widgets/react/hooks.tsx
View File

@@ -642,21 +642,3 @@ export function useResizeObserver(ref: RefObject<HTMLElement>, callback: () => v
return () => observer.disconnect(); return () => observer.disconnect();
}, [ callback, ref ]); }, [ callback, ref ]);
} }
export function useFloatingButtonsWidth() {
const [ width, setWidth ] = useState(0);
const parentComponent = useContext(ParentComponent);
const containerRef = useRef<HTMLElement>(null);
useEffect(() => {
const containerEl = parentComponent?.$widget
.closest(".note-split")
.find(".floating-buttons-children")[0];
containerRef.current = (containerEl as HTMLElement | undefined) ?? null;
});
useResizeObserver(containerRef, () => {
console.log("Got width ", containerRef.current?.getBoundingClientRect().width);
setWidth(containerRef.current?.getBoundingClientRect().width ?? 0);
});
return width;
}