mirror of
https://github.com/zadam/trilium.git
synced 2025-10-26 07:46:30 +01:00
Revert "chore(collections/calendar): experiment with avoiding floating buttons"
This reverts commit 6c4ac347db.
This commit is contained in:
@@ -3,7 +3,7 @@ import { ViewModeProps } from "../interface";
|
||||
import Calendar from "./calendar";
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "preact/hooks";
|
||||
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 { Calendar as FullCalendar } from "@fullcalendar/core";
|
||||
import { parseStartEndDateFromEvent, parseStartEndTimeFromEvent } from "./utils";
|
||||
@@ -146,14 +146,13 @@ export default function CalendarView({ note, noteIds }: ViewModeProps<CalendarVi
|
||||
function CalendarHeader({ calendarRef }: { calendarRef: RefObject<FullCalendar> }) {
|
||||
const currentViewType = calendarRef.current?.view?.type;
|
||||
const currentViewData = CALENDAR_VIEWS.find(v => calendarRef.current && v.type === currentViewType);
|
||||
const floatingButtonsWidth = useFloatingButtonsWidth();
|
||||
|
||||
// Wait for the calendar ref to become available.
|
||||
const [ ready, setReady ] = useState(false);
|
||||
useEffect(() => setReady(true), []);
|
||||
|
||||
return (ready &&
|
||||
<div className="calendar-header" style={{ marginRight: floatingButtonsWidth }}>
|
||||
<div className="calendar-header">
|
||||
<span className="title">{calendarRef.current?.view.title}</span>
|
||||
<ButtonGroup>
|
||||
{CALENDAR_VIEWS.map(viewData => (
|
||||
|
||||
@@ -642,21 +642,3 @@ export function useResizeObserver(ref: RefObject<HTMLElement>, callback: () => v
|
||||
return () => observer.disconnect();
|
||||
}, [ 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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user