chore(react/collections): add spacer for calendar touch bar

This commit is contained in:
Elian Doran 2025-09-06 15:40:47 +03:00
parent 05299952a9
commit 8dcef5ea9f
No known key found for this signature in database
2 changed files with 23 additions and 2 deletions

View File

@ -19,7 +19,7 @@ import FNote from "../../../entities/fnote";
import Button, { ButtonGroup } from "../../react/Button"; import Button, { ButtonGroup } from "../../react/Button";
import ActionButton from "../../react/ActionButton"; import ActionButton from "../../react/ActionButton";
import { RefObject } from "preact"; import { RefObject } from "preact";
import TouchBar, { TouchBarButton, TouchBarLabel, TouchBarSegmentedControl } from "../../react/TouchBar"; import TouchBar, { TouchBarButton, TouchBarLabel, TouchBarSegmentedControl, TouchBarSpacer } from "../../react/TouchBar";
interface CalendarViewData { interface CalendarViewData {
@ -327,7 +327,6 @@ function CalendarTouchBar({ calendarRef }: { calendarRef: RefObject<FullCalendar
return ready && ( return ready && (
<TouchBar> <TouchBar>
<TouchBarLabel label={calendarRef.current?.view.title ?? ""} />
<TouchBarSegmentedControl <TouchBarSegmentedControl
mode="single" mode="single"
segments={CALENDAR_VIEWS.map(({ name }) => ({ segments={CALENDAR_VIEWS.map(({ name }) => ({
@ -336,6 +335,11 @@ function CalendarTouchBar({ calendarRef }: { calendarRef: RefObject<FullCalendar
selectedIndex={CALENDAR_VIEWS.findIndex(v => v.type === viewType) ?? 0} selectedIndex={CALENDAR_VIEWS.findIndex(v => v.type === viewType) ?? 0}
onChange={(selectedIndex) => calendarRef.current?.changeView(CALENDAR_VIEWS[selectedIndex].type)} onChange={(selectedIndex) => calendarRef.current?.changeView(CALENDAR_VIEWS[selectedIndex].type)}
/> />
<TouchBarSpacer size="flexible" />
<TouchBarLabel label={calendarRef.current?.view.title ?? ""} />
<TouchBarSpacer size="flexible" />
<TouchBarButton <TouchBarButton
label={t("calendar.today")} label={t("calendar.today")}
click={() => calendarRef.current?.today()} click={() => calendarRef.current?.today()}

View File

@ -27,6 +27,10 @@ interface ButtonProps {
enabled?: boolean; enabled?: boolean;
} }
interface SpacerProps {
size: "flexible" | "large" | "small";
}
interface SegmentedControlProps { interface SegmentedControlProps {
mode: "single" | "buttons"; mode: "single" | "buttons";
segments: { segments: {
@ -169,6 +173,19 @@ export function TouchBarSegmentedControl({ mode, segments, selectedIndex, onChan
return <></>; return <></>;
} }
export function TouchBarSpacer({ size }: SpacerProps) {
const api = useContext(TouchBarContext);
if (api) {
const item = new api.TouchBar.TouchBarSpacer({
size
});
api.addItem(item);
}
return <></>;
}
function buildIcon(nativeImage: typeof Electron.nativeImage, name: string) { function buildIcon(nativeImage: typeof Electron.nativeImage, name: string) {
const sourceImage = nativeImage.createFromNamedImage(name, [-1, 0, 1]); const sourceImage = nativeImage.createFromNamedImage(name, [-1, 0, 1]);
const { width, height } = sourceImage.getSize(); const { width, height } = sourceImage.getSize();