payload-reserve 1.0.0

package/dist/components/CalendarView/index.js

@@ -0,0 +1,508 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui';
+import React, { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import styles from './CalendarView.module.css';
+const STATUS_CLASS_MAP = {
+    cancelled: styles.statusCancelled,
+    completed: styles.statusCompleted,
+    confirmed: styles.statusConfirmed,
+    'no-show': styles.statusNoShow,
+    pending: styles.statusPending
+};
+const STATUS_COLORS = {
+    cancelled: '#e5e7eb',
+    completed: '#d1fae5',
+    confirmed: '#dbeafe',
+    'no-show': '#fee2e2',
+    pending: '#fef3c7'
+};
+export const CalendarView = ()=>{
+    const { config } = useConfig();
+    const { t: _t } = useTranslation();
+    const t = _t;
+    const STATUS_LABELS = useMemo(()=>({
+            cancelled: t('reservation:statusCancelled'),
+            completed: t('reservation:statusCompleted'),
+            confirmed: t('reservation:statusConfirmed'),
+            'no-show': t('reservation:statusNoShowLabel'),
+            pending: t('reservation:statusPending')
+        }), [
+        t
+    ]);
+    const slugs = config.admin?.custom?.reservationSlugs;
+    const reservationSlug = slugs?.reservations ?? 'reservations';
+    const [currentDate, setCurrentDate] = useState(()=>new Date());
+    const [viewMode, setViewMode] = useState('month');
+    const [reservations, setReservations] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [drawerDocId, setDrawerDocId] = useState(null);
+    const [initialData, setInitialData] = useState(undefined);
+    const [DocumentDrawer, , { openDrawer }] = useDocumentDrawer({
+        id: drawerDocId ?? undefined,
+        collectionSlug: reservationSlug
+    });
+    const pendingDrawerOpen = useRef(false);
+    useEffect(()=>{
+        if (pendingDrawerOpen.current) {
+            pendingDrawerOpen.current = false;
+            openDrawer();
+        }
+    });
+    const { rangeEnd, rangeStart } = useMemo(()=>{
+        const start = new Date(currentDate);
+        const end = new Date(currentDate);
+        if (viewMode === 'month') {
+            start.setDate(1);
+            start.setDate(start.getDate() - start.getDay());
+            end.setMonth(end.getMonth() + 1, 0);
+            end.setDate(end.getDate() + (6 - end.getDay()));
+        } else if (viewMode === 'week') {
+            const dayOfWeek = start.getDay();
+            start.setDate(start.getDate() - dayOfWeek);
+            end.setDate(start.getDate() + 6);
+        }
+        start.setHours(0, 0, 0, 0);
+        end.setHours(23, 59, 59, 999);
+        return {
+            rangeEnd: end,
+            rangeStart: start
+        };
+    }, [
+        currentDate,
+        viewMode
+    ]);
+    const fetchReservations = useCallback(async ()=>{
+        setLoading(true);
+        try {
+            const apiUrl = `${config.serverURL ?? ''}${config.routes.api}/${reservationSlug}`;
+            const params = new URLSearchParams({
+                depth: '1',
+                limit: '500',
+                sort: 'startTime',
+                'where[startTime][greater_than_equal]': rangeStart.toISOString(),
+                'where[startTime][less_than_equal]': rangeEnd.toISOString()
+            });
+            const response = await fetch(`${apiUrl}?${params}`);
+            const result = await response.json();
+            setReservations(result.docs ?? []);
+        } catch  {
+            setReservations([]);
+        }
+        setLoading(false);
+    }, [
+        rangeStart,
+        rangeEnd,
+        config.routes.api,
+        config.serverURL,
+        reservationSlug
+    ]);
+    useEffect(()=>{
+        void fetchReservations();
+    }, [
+        fetchReservations
+    ]);
+    const handleEventClick = useCallback((e, id)=>{
+        e.stopPropagation();
+        setDrawerDocId(id);
+        setInitialData(undefined);
+        pendingDrawerOpen.current = true;
+    }, []);
+    const handleEventKeyDown = useCallback((e, id)=>{
+        if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            e.stopPropagation();
+            setDrawerDocId(id);
+            setInitialData(undefined);
+            pendingDrawerOpen.current = true;
+        }
+    }, []);
+    const handleCreateNew = useCallback(()=>{
+        setDrawerDocId(null);
+        setInitialData(undefined);
+        pendingDrawerOpen.current = true;
+    }, []);
+    const handleDateClick = useCallback((date)=>{
+        setDrawerDocId(null);
+        setInitialData({
+            startTime: date.toISOString()
+        });
+        pendingDrawerOpen.current = true;
+    }, []);
+    const navigate = useCallback((direction)=>{
+        setCurrentDate((prev)=>{
+            const next = new Date(prev);
+            if (viewMode === 'month') {
+                next.setMonth(next.getMonth() + direction);
+            } else if (viewMode === 'week') {
+                next.setDate(next.getDate() + 7 * direction);
+            } else {
+                next.setDate(next.getDate() + direction);
+            }
+            return next;
+        });
+    }, [
+        viewMode
+    ]);
+    const goToToday = useCallback(()=>setCurrentDate(new Date()), []);
+    const getResName = (field)=>{
+        if (!field) {
+            return '';
+        }
+        if (typeof field === 'string') {
+            return '';
+        }
+        return field.name ?? '';
+    };
+    const getEventLabel = (r, compact)=>{
+        const time = new Date(r.startTime).toLocaleTimeString([], {
+            hour: '2-digit',
+            minute: '2-digit'
+        });
+        const serviceName = getResName(r.service);
+        if (compact) {
+            return `${time} ${serviceName}`.trim();
+        }
+        const customerName = getResName(r.customer);
+        const parts = [
+            time,
+            serviceName,
+            customerName
+        ].filter(Boolean);
+        return parts.join(' - ');
+    };
+    const getEventTooltip = (r)=>{
+        const serviceName = getResName(r.service) || t('reservation:calendarUnknownService');
+        const startStr = new Date(r.startTime).toLocaleTimeString([], {
+            hour: '2-digit',
+            minute: '2-digit'
+        });
+        const endStr = r.endTime ? new Date(r.endTime).toLocaleTimeString([], {
+            hour: '2-digit',
+            minute: '2-digit'
+        }) : '?';
+        const customerName = getResName(r.customer) || t('reservation:calendarUnknownCustomer');
+        const resourceName = getResName(r.resource) || t('reservation:calendarUnknownResource');
+        const status = STATUS_LABELS[r.status] ?? r.status;
+        return `${serviceName}\n${startStr} - ${endStr}\n${t('reservation:tooltipCustomer')} ${customerName}\n${t('reservation:tooltipResource')} ${resourceName}\n${t('reservation:tooltipStatus')} ${status}`;
+    };
+    const renderEventItem = (r, compact)=>/*#__PURE__*/ _jsx("div", {
+            className: `${styles.eventItem} ${STATUS_CLASS_MAP[r.status] ?? ''}`,
+            onClick: (e)=>handleEventClick(e, r.id),
+            onKeyDown: (e)=>handleEventKeyDown(e, r.id),
+            role: "button",
+            tabIndex: 0,
+            title: getEventTooltip(r),
+            children: getEventLabel(r, compact)
+        }, r.id);
+    const renderStatusLegend = ()=>/*#__PURE__*/ _jsx("div", {
+            className: styles.statusLegend,
+            children: Object.entries(STATUS_LABELS).map(([key, label])=>/*#__PURE__*/ _jsxs("div", {
+                    className: styles.legendItem,
+                    children: [
+                        /*#__PURE__*/ _jsx("span", {
+                            className: styles.legendDot,
+                            style: {
+                                background: STATUS_COLORS[key]
+                            }
+                        }),
+                        label
+                    ]
+                }, key))
+        });
+    const renderCurrentTimeLine = (cellDate, cellHour)=>{
+        const now = new Date();
+        if (now.getFullYear() !== cellDate.getFullYear() || now.getMonth() !== cellDate.getMonth() || now.getDate() !== cellDate.getDate() || now.getHours() !== cellHour) {
+            return null;
+        }
+        const topPercent = now.getMinutes() / 60 * 100;
+        return /*#__PURE__*/ _jsx("div", {
+            className: styles.currentTimeLine,
+            style: {
+                top: `${topPercent}%`
+            }
+        });
+    };
+    const renderMonthView = ()=>{
+        const firstDay = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
+        const startDay = new Date(firstDay);
+        startDay.setDate(startDay.getDate() - startDay.getDay());
+        const days = [];
+        const d = new Date(startDay);
+        for(let i = 0; i < 42; i++){
+            days.push(new Date(d));
+            d.setDate(d.getDate() + 1);
+        }
+        const today = new Date();
+        const todayStr = `${today.getFullYear()}-${today.getMonth()}-${today.getDate()}`;
+        return /*#__PURE__*/ _jsxs("div", {
+            className: styles.monthGrid,
+            children: [
+                [
+                    t('reservation:dayShortSun'),
+                    t('reservation:dayShortMon'),
+                    t('reservation:dayShortTue'),
+                    t('reservation:dayShortWed'),
+                    t('reservation:dayShortThu'),
+                    t('reservation:dayShortFri'),
+                    t('reservation:dayShortSat')
+                ].map((d)=>/*#__PURE__*/ _jsx("div", {
+                        className: styles.dayHeader,
+                        children: d
+                    }, d)),
+                days.map((day, i)=>{
+                    const dayStr = `${day.getFullYear()}-${day.getMonth()}-${day.getDate()}`;
+                    const isToday = dayStr === todayStr;
+                    const isOtherMonth = day.getMonth() !== currentDate.getMonth();
+                    const dayReservations = reservations.filter((r)=>{
+                        const rDate = new Date(r.startTime);
+                        return rDate.getFullYear() === day.getFullYear() && rDate.getMonth() === day.getMonth() && rDate.getDate() === day.getDate();
+                    });
+                    const clickDate = new Date(day);
+                    clickDate.setHours(9, 0, 0, 0);
+                    return /*#__PURE__*/ _jsxs("div", {
+                        className: `${styles.dayCell} ${isOtherMonth ? styles.dayCellOtherMonth : ''} ${isToday ? styles.dayCellToday : ''}`,
+                        onClick: ()=>handleDateClick(clickDate),
+                        onKeyDown: (e)=>{
+                            if (e.key === 'Enter' || e.key === ' ') {
+                                e.preventDefault();
+                                handleDateClick(clickDate);
+                            }
+                        },
+                        role: "button",
+                        tabIndex: 0,
+                        children: [
+                            /*#__PURE__*/ _jsx("div", {
+                                className: styles.dayNumber,
+                                children: day.getDate()
+                            }),
+                            dayReservations.map((r)=>renderEventItem(r, true))
+                        ]
+                    }, i);
+                })
+            ]
+        });
+    };
+    const renderWeekView = ()=>{
+        const startOfWeek = new Date(currentDate);
+        startOfWeek.setDate(startOfWeek.getDate() - startOfWeek.getDay());
+        startOfWeek.setHours(0, 0, 0, 0);
+        const weekDays = [];
+        for(let i = 0; i < 7; i++){
+            const d = new Date(startOfWeek);
+            d.setDate(d.getDate() + i);
+            weekDays.push(d);
+        }
+        const hours = Array.from({
+            length: 12
+        }, (_, i)=>i + 7);
+        return /*#__PURE__*/ _jsxs("div", {
+            className: styles.weekView,
+            children: [
+                /*#__PURE__*/ _jsx("div", {
+                    className: styles.dayHeader
+                }),
+                weekDays.map((d, i)=>/*#__PURE__*/ _jsx("div", {
+                        className: styles.dayHeader,
+                        children: d.toLocaleDateString([], {
+                            day: 'numeric',
+                            month: 'numeric',
+                            weekday: 'short'
+                        })
+                    }, i)),
+                hours.map((hour)=>/*#__PURE__*/ _jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: styles.timeLabel,
+                                children: [
+                                    hour.toString().padStart(2, '0'),
+                                    ":00"
+                                ]
+                            }),
+                            weekDays.map((day, di)=>{
+                                const cellReservations = reservations.filter((r)=>{
+                                    const rDate = new Date(r.startTime);
+                                    return rDate.getFullYear() === day.getFullYear() && rDate.getMonth() === day.getMonth() && rDate.getDate() === day.getDate() && rDate.getHours() === hour;
+                                });
+                                const clickDate = new Date(day);
+                                clickDate.setHours(hour, 0, 0, 0);
+                                return /*#__PURE__*/ _jsxs("div", {
+                                    className: styles.weekCell,
+                                    onClick: ()=>handleDateClick(clickDate),
+                                    onKeyDown: (e)=>{
+                                        if (e.key === 'Enter' || e.key === ' ') {
+                                            e.preventDefault();
+                                            handleDateClick(clickDate);
+                                        }
+                                    },
+                                    role: "button",
+                                    tabIndex: 0,
+                                    children: [
+                                        renderCurrentTimeLine(day, hour),
+                                        cellReservations.map((r)=>renderEventItem(r, false))
+                                    ]
+                                }, `cell-${hour}-${di}`);
+                            })
+                        ]
+                    }, `row-${hour}`))
+            ]
+        });
+    };
+    const renderDayView = ()=>{
+        const hours = Array.from({
+            length: 14
+        }, (_, i)=>i + 7);
+        return /*#__PURE__*/ _jsx("div", {
+            className: styles.dayView,
+            children: hours.map((hour)=>{
+                const hourReservations = reservations.filter((r)=>{
+                    const rDate = new Date(r.startTime);
+                    return rDate.getFullYear() === currentDate.getFullYear() && rDate.getMonth() === currentDate.getMonth() && rDate.getDate() === currentDate.getDate() && rDate.getHours() === hour;
+                });
+                const clickDate = new Date(currentDate);
+                clickDate.setHours(hour, 0, 0, 0);
+                return /*#__PURE__*/ _jsxs(Fragment, {
+                    children: [
+                        /*#__PURE__*/ _jsxs("div", {
+                            className: styles.timeLabel,
+                            children: [
+                                hour.toString().padStart(2, '0'),
+                                ":00"
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsxs("div", {
+                            className: styles.dayViewCell,
+                            onClick: ()=>handleDateClick(clickDate),
+                            onKeyDown: (e)=>{
+                                if (e.key === 'Enter' || e.key === ' ') {
+                                    e.preventDefault();
+                                    handleDateClick(clickDate);
+                                }
+                            },
+                            role: "button",
+                            tabIndex: 0,
+                            children: [
+                                renderCurrentTimeLine(currentDate, hour),
+                                hourReservations.map((r)=>renderEventItem(r, false))
+                            ]
+                        })
+                    ]
+                }, `row-${hour}`);
+            })
+        });
+    };
+    const dateLabel = useMemo(()=>{
+        if (viewMode === 'month') {
+            return currentDate.toLocaleDateString([], {
+                month: 'long',
+                year: 'numeric'
+            });
+        }
+        if (viewMode === 'week') {
+            const startOfWeek = new Date(currentDate);
+            startOfWeek.setDate(startOfWeek.getDate() - startOfWeek.getDay());
+            const endOfWeek = new Date(startOfWeek);
+            endOfWeek.setDate(endOfWeek.getDate() + 6);
+            return `${startOfWeek.toLocaleDateString([], {
+                day: 'numeric',
+                month: 'short'
+            })} - ${endOfWeek.toLocaleDateString([], {
+                day: 'numeric',
+                month: 'short',
+                year: 'numeric'
+            })}`;
+        }
+        return currentDate.toLocaleDateString([], {
+            day: 'numeric',
+            month: 'long',
+            weekday: 'long',
+            year: 'numeric'
+        });
+    }, [
+        currentDate,
+        viewMode
+    ]);
+    if (loading) {
+        return /*#__PURE__*/ _jsx("div", {
+            className: styles.loading,
+            children: t('reservation:calendarLoading')
+        });
+    }
+    return /*#__PURE__*/ _jsxs("div", {
+        className: styles.wrapper,
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                className: styles.header,
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: styles.navButtons,
+                        children: [
+                            /*#__PURE__*/ _jsx("button", {
+                                className: styles.navButton,
+                                onClick: ()=>navigate(-1),
+                                type: "button",
+                                children: "←"
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                className: styles.navButton,
+                                onClick: goToToday,
+                                type: "button",
+                                children: t('reservation:calendarToday')
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                className: styles.navButton,
+                                onClick: ()=>navigate(1),
+                                type: "button",
+                                children: "→"
+                            }),
+                            /*#__PURE__*/ _jsx("span", {
+                                className: styles.currentDate,
+                                children: dateLabel
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: styles.viewToggle,
+                        children: [
+                            /*#__PURE__*/ _jsx("button", {
+                                className: styles.createButton,
+                                onClick: handleCreateNew,
+                                type: "button",
+                                children: t('reservation:calendarCreateNew')
+                            }),
+                            [
+                                {
+                                    key: 'month',
+                                    label: t('reservation:calendarMonth')
+                                },
+                                {
+                                    key: 'week',
+                                    label: t('reservation:calendarWeek')
+                                },
+                                {
+                                    key: 'day',
+                                    label: t('reservation:calendarDay')
+                                }
+                            ].map(({ key, label })=>/*#__PURE__*/ _jsx("button", {
+                                    className: `${styles.viewToggleButton} ${viewMode === key ? styles.viewToggleButtonActive : ''}`,
+                                    onClick: ()=>setViewMode(key),
+                                    type: "button",
+                                    children: label
+                                }, key))
+                        ]
+                    })
+                ]
+            }),
+            renderStatusLegend(),
+            viewMode === 'month' && renderMonthView(),
+            viewMode === 'week' && renderWeekView(),
+            viewMode === 'day' && renderDayView(),
+            /*#__PURE__*/ _jsx(DocumentDrawer, {
+                initialData: initialData,
+                onSave: fetchReservations
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=index.js.map

package/dist/components/CalendarView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/CalendarView/index.tsx"],"sourcesContent":["'use client'\nimport type { AdminViewServerProps } from 'payload'\n\nimport { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui'\nimport React, { Fragment, useCallback, useEffect, useMemo, useRef, useState } from 'react'\n\nimport type { PluginT } from '../../translations/index.js'\n\nimport styles from './CalendarView.module.css'\n\ntype ViewMode = 'day' | 'month' | 'week'\n\ntype Reservation = {\n  customer?: { name?: string } | string\n  endTime?: string\n  id: string\n  resource?: { name?: string } | string\n  service?: { name?: string } | string\n  startTime: string\n  status: string\n}\n\nconst STATUS_CLASS_MAP: Record<string, string> = {\n  cancelled: styles.statusCancelled,\n  completed: styles.statusCompleted,\n  confirmed: styles.statusConfirmed,\n  'no-show': styles.statusNoShow,\n  pending: styles.statusPending,\n}\n\nconst STATUS_COLORS: Record<string, string> = {\n  cancelled: '#e5e7eb',\n  completed: '#d1fae5',\n  confirmed: '#dbeafe',\n  'no-show': '#fee2e2',\n  pending: '#fef3c7',\n}\n\nexport const CalendarView: React.FC<AdminViewServerProps> = () => {\n  const { config } = useConfig()\n  const { t: _t } = useTranslation()\n  const t = _t as PluginT\n\n  const STATUS_LABELS = useMemo<Record<string, string>>(\n    () => ({\n      cancelled: t('reservation:statusCancelled'),\n      completed: t('reservation:statusCompleted'),\n      confirmed: t('reservation:statusConfirmed'),\n      'no-show': t('reservation:statusNoShowLabel'),\n      pending: t('reservation:statusPending'),\n    }),\n    [t],\n  )\n  const slugs = config.admin?.custom?.reservationSlugs\n  const reservationSlug = slugs?.reservations ?? 'reservations'\n\n  const [currentDate, setCurrentDate] = useState(() => new Date())\n  const [viewMode, setViewMode] = useState<ViewMode>('month')\n  const [reservations, setReservations] = useState<Reservation[]>([])\n  const [loading, setLoading] = useState(true)\n  const [drawerDocId, setDrawerDocId] = useState<null | string>(null)\n  const [initialData, setInitialData] = useState<Record<string, unknown> | undefined>(undefined)\n\n  const [DocumentDrawer, , { openDrawer }] = useDocumentDrawer({\n    id: drawerDocId ?? undefined,\n    collectionSlug: reservationSlug,\n  })\n\n  const pendingDrawerOpen = useRef(false)\n\n  useEffect(() => {\n    if (pendingDrawerOpen.current) {\n      pendingDrawerOpen.current = false\n      openDrawer()\n    }\n  })\n\n  const { rangeEnd, rangeStart } = useMemo(() => {\n    const start = new Date(currentDate)\n    const end = new Date(currentDate)\n\n    if (viewMode === 'month') {\n      start.setDate(1)\n      start.setDate(start.getDate() - start.getDay())\n      end.setMonth(end.getMonth() + 1, 0)\n      end.setDate(end.getDate() + (6 - end.getDay()))\n    } else if (viewMode === 'week') {\n      const dayOfWeek = start.getDay()\n      start.setDate(start.getDate() - dayOfWeek)\n      end.setDate(start.getDate() + 6)\n    }\n    start.setHours(0, 0, 0, 0)\n    end.setHours(23, 59, 59, 999)\n\n    return { rangeEnd: end, rangeStart: start }\n  }, [currentDate, viewMode])\n\n  const fetchReservations = useCallback(async () => {\n    setLoading(true)\n    try {\n      const apiUrl = `${config.serverURL ?? ''}${config.routes.api}/${reservationSlug}`\n      const params = new URLSearchParams({\n        depth: '1',\n        limit: '500',\n        sort: 'startTime',\n        'where[startTime][greater_than_equal]': rangeStart.toISOString(),\n        'where[startTime][less_than_equal]': rangeEnd.toISOString(),\n      })\n      const response = await fetch(`${apiUrl}?${params}`)\n      const result = await response.json()\n      setReservations(result.docs ?? [])\n    } catch {\n      setReservations([])\n    }\n    setLoading(false)\n  }, [rangeStart, rangeEnd, config.routes.api, config.serverURL, reservationSlug])\n\n  useEffect(() => {\n    void fetchReservations()\n  }, [fetchReservations])\n\n  const handleEventClick = useCallback((e: React.MouseEvent, id: string) => {\n    e.stopPropagation()\n    setDrawerDocId(id)\n    setInitialData(undefined)\n    pendingDrawerOpen.current = true\n  }, [])\n\n  const handleEventKeyDown = useCallback((e: React.KeyboardEvent, id: string) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault()\n      e.stopPropagation()\n      setDrawerDocId(id)\n      setInitialData(undefined)\n      pendingDrawerOpen.current = true\n    }\n  }, [])\n\n  const handleCreateNew = useCallback(() => {\n    setDrawerDocId(null)\n    setInitialData(undefined)\n    pendingDrawerOpen.current = true\n  }, [])\n\n  const handleDateClick = useCallback((date: Date) => {\n    setDrawerDocId(null)\n    setInitialData({ startTime: date.toISOString() })\n    pendingDrawerOpen.current = true\n  }, [])\n\n  const navigate = useCallback(\n    (direction: -1 | 1) => {\n      setCurrentDate((prev) => {\n        const next = new Date(prev)\n        if (viewMode === 'month') {\n          next.setMonth(next.getMonth() + direction)\n        } else if (viewMode === 'week') {\n          next.setDate(next.getDate() + 7 * direction)\n        } else {\n          next.setDate(next.getDate() + direction)\n        }\n        return next\n      })\n    },\n    [viewMode],\n  )\n\n  const goToToday = useCallback(() => setCurrentDate(new Date()), [])\n\n  const getResName = (field: { name?: string } | string | undefined): string => {\n    if (!field) {return ''}\n    if (typeof field === 'string') {return ''}\n    return field.name ?? ''\n  }\n\n  const getEventLabel = (r: Reservation, compact: boolean) => {\n    const time = new Date(r.startTime).toLocaleTimeString([], {\n      hour: '2-digit',\n      minute: '2-digit',\n    })\n    const serviceName = getResName(r.service)\n    if (compact) {\n      return `${time} ${serviceName}`.trim()\n    }\n    const customerName = getResName(r.customer)\n    const parts = [time, serviceName, customerName].filter(Boolean)\n    return parts.join(' - ')\n  }\n\n  const getEventTooltip = (r: Reservation): string => {\n    const serviceName = getResName(r.service) || t('reservation:calendarUnknownService')\n    const startStr = new Date(r.startTime).toLocaleTimeString([], {\n      hour: '2-digit',\n      minute: '2-digit',\n    })\n    const endStr = r.endTime\n      ? new Date(r.endTime).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })\n      : '?'\n    const customerName = getResName(r.customer) || t('reservation:calendarUnknownCustomer')\n    const resourceName = getResName(r.resource) || t('reservation:calendarUnknownResource')\n    const status = STATUS_LABELS[r.status] ?? r.status\n    return `${serviceName}\\n${startStr} - ${endStr}\\n${t('reservation:tooltipCustomer')} ${customerName}\\n${t('reservation:tooltipResource')} ${resourceName}\\n${t('reservation:tooltipStatus')} ${status}`\n  }\n\n  const renderEventItem = (r: Reservation, compact: boolean) => (\n    <div\n      className={`${styles.eventItem} ${STATUS_CLASS_MAP[r.status] ?? ''}`}\n      key={r.id}\n      onClick={(e) => handleEventClick(e, r.id)}\n      onKeyDown={(e) => handleEventKeyDown(e, r.id)}\n      role=\"button\"\n      tabIndex={0}\n      title={getEventTooltip(r)}\n    >\n      {getEventLabel(r, compact)}\n    </div>\n  )\n\n  const renderStatusLegend = () => (\n    <div className={styles.statusLegend}>\n      {Object.entries(STATUS_LABELS).map(([key, label]) => (\n        <div className={styles.legendItem} key={key}>\n          <span className={styles.legendDot} style={{ background: STATUS_COLORS[key] }} />\n          {label}\n        </div>\n      ))}\n    </div>\n  )\n\n  const renderCurrentTimeLine = (cellDate: Date, cellHour: number) => {\n    const now = new Date()\n    if (\n      now.getFullYear() !== cellDate.getFullYear() ||\n      now.getMonth() !== cellDate.getMonth() ||\n      now.getDate() !== cellDate.getDate() ||\n      now.getHours() !== cellHour\n    ) {\n      return null\n    }\n    const topPercent = (now.getMinutes() / 60) * 100\n    return <div className={styles.currentTimeLine} style={{ top: `${topPercent}%` }} />\n  }\n\n  const renderMonthView = () => {\n    const firstDay = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1)\n    const startDay = new Date(firstDay)\n    startDay.setDate(startDay.getDate() - startDay.getDay())\n\n    const days: Date[] = []\n    const d = new Date(startDay)\n    for (let i = 0; i < 42; i++) {\n      days.push(new Date(d))\n      d.setDate(d.getDate() + 1)\n    }\n\n    const today = new Date()\n    const todayStr = `${today.getFullYear()}-${today.getMonth()}-${today.getDate()}`\n\n    return (\n      <div className={styles.monthGrid}>\n        {[\n          t('reservation:dayShortSun'),\n          t('reservation:dayShortMon'),\n          t('reservation:dayShortTue'),\n          t('reservation:dayShortWed'),\n          t('reservation:dayShortThu'),\n          t('reservation:dayShortFri'),\n          t('reservation:dayShortSat'),\n        ].map((d) => (\n          <div className={styles.dayHeader} key={d}>\n            {d}\n          </div>\n        ))}\n        {days.map((day, i) => {\n          const dayStr = `${day.getFullYear()}-${day.getMonth()}-${day.getDate()}`\n          const isToday = dayStr === todayStr\n          const isOtherMonth = day.getMonth() !== currentDate.getMonth()\n          const dayReservations = reservations.filter((r) => {\n            const rDate = new Date(r.startTime)\n            return (\n              rDate.getFullYear() === day.getFullYear() &&\n              rDate.getMonth() === day.getMonth() &&\n              rDate.getDate() === day.getDate()\n            )\n          })\n\n          const clickDate = new Date(day)\n          clickDate.setHours(9, 0, 0, 0)\n\n          return (\n            <div\n              className={`${styles.dayCell} ${isOtherMonth ? styles.dayCellOtherMonth : ''} ${isToday ? styles.dayCellToday : ''}`}\n              key={i}\n              onClick={() => handleDateClick(clickDate)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault()\n                  handleDateClick(clickDate)\n                }\n              }}\n              role=\"button\"\n              tabIndex={0}\n            >\n              <div className={styles.dayNumber}>{day.getDate()}</div>\n              {dayReservations.map((r) => renderEventItem(r, true))}\n            </div>\n          )\n        })}\n      </div>\n    )\n  }\n\n  const renderWeekView = () => {\n    const startOfWeek = new Date(currentDate)\n    startOfWeek.setDate(startOfWeek.getDate() - startOfWeek.getDay())\n    startOfWeek.setHours(0, 0, 0, 0)\n\n    const weekDays: Date[] = []\n    for (let i = 0; i < 7; i++) {\n      const d = new Date(startOfWeek)\n      d.setDate(d.getDate() + i)\n      weekDays.push(d)\n    }\n\n    const hours = Array.from({ length: 12 }, (_, i) => i + 7)\n\n    return (\n      <div className={styles.weekView}>\n        <div className={styles.dayHeader} />\n        {weekDays.map((d, i) => (\n          <div className={styles.dayHeader} key={i}>\n            {d.toLocaleDateString([], { day: 'numeric', month: 'numeric', weekday: 'short' })}\n          </div>\n        ))}\n        {hours.map((hour) => (\n          <Fragment key={`row-${hour}`}>\n            <div className={styles.timeLabel}>\n              {hour.toString().padStart(2, '0')}:00\n            </div>\n            {weekDays.map((day, di) => {\n              const cellReservations = reservations.filter((r) => {\n                const rDate = new Date(r.startTime)\n                return (\n                  rDate.getFullYear() === day.getFullYear() &&\n                  rDate.getMonth() === day.getMonth() &&\n                  rDate.getDate() === day.getDate() &&\n                  rDate.getHours() === hour\n                )\n              })\n              const clickDate = new Date(day)\n              clickDate.setHours(hour, 0, 0, 0)\n              return (\n                <div\n                  className={styles.weekCell}\n                  key={`cell-${hour}-${di}`}\n                  onClick={() => handleDateClick(clickDate)}\n                  onKeyDown={(e) => {\n                    if (e.key === 'Enter' || e.key === ' ') {\n                      e.preventDefault()\n                      handleDateClick(clickDate)\n                    }\n                  }}\n                  role=\"button\"\n                  tabIndex={0}\n                >\n                  {renderCurrentTimeLine(day, hour)}\n                  {cellReservations.map((r) => renderEventItem(r, false))}\n                </div>\n              )\n            })}\n          </Fragment>\n        ))}\n      </div>\n    )\n  }\n\n  const renderDayView = () => {\n    const hours = Array.from({ length: 14 }, (_, i) => i + 7)\n\n    return (\n      <div className={styles.dayView}>\n        {hours.map((hour) => {\n          const hourReservations = reservations.filter((r) => {\n            const rDate = new Date(r.startTime)\n            return (\n              rDate.getFullYear() === currentDate.getFullYear() &&\n              rDate.getMonth() === currentDate.getMonth() &&\n              rDate.getDate() === currentDate.getDate() &&\n              rDate.getHours() === hour\n            )\n          })\n          const clickDate = new Date(currentDate)\n          clickDate.setHours(hour, 0, 0, 0)\n          return (\n            <Fragment key={`row-${hour}`}>\n              <div className={styles.timeLabel}>\n                {hour.toString().padStart(2, '0')}:00\n              </div>\n              <div\n                className={styles.dayViewCell}\n                onClick={() => handleDateClick(clickDate)}\n                onKeyDown={(e) => {\n                  if (e.key === 'Enter' || e.key === ' ') {\n                    e.preventDefault()\n                    handleDateClick(clickDate)\n                  }\n                }}\n                role=\"button\"\n                tabIndex={0}\n              >\n                {renderCurrentTimeLine(currentDate, hour)}\n                {hourReservations.map((r) => renderEventItem(r, false))}\n              </div>\n            </Fragment>\n          )\n        })}\n      </div>\n    )\n  }\n\n  const dateLabel = useMemo(() => {\n    if (viewMode === 'month') {\n      return currentDate.toLocaleDateString([], { month: 'long', year: 'numeric' })\n    }\n    if (viewMode === 'week') {\n      const startOfWeek = new Date(currentDate)\n      startOfWeek.setDate(startOfWeek.getDate() - startOfWeek.getDay())\n      const endOfWeek = new Date(startOfWeek)\n      endOfWeek.setDate(endOfWeek.getDate() + 6)\n      return `${startOfWeek.toLocaleDateString([], { day: 'numeric', month: 'short' })} - ${endOfWeek.toLocaleDateString([], { day: 'numeric', month: 'short', year: 'numeric' })}`\n    }\n    return currentDate.toLocaleDateString([], {\n      day: 'numeric',\n      month: 'long',\n      weekday: 'long',\n      year: 'numeric',\n    })\n  }, [currentDate, viewMode])\n\n  if (loading) {\n    return <div className={styles.loading}>{t('reservation:calendarLoading')}</div>\n  }\n\n  return (\n    <div className={styles.wrapper}>\n      <div className={styles.header}>\n        <div className={styles.navButtons}>\n          <button className={styles.navButton} onClick={() => navigate(-1)} type=\"button\">\n            &larr;\n          </button>\n          <button className={styles.navButton} onClick={goToToday} type=\"button\">\n            {t('reservation:calendarToday')}\n          </button>\n          <button className={styles.navButton} onClick={() => navigate(1)} type=\"button\">\n            &rarr;\n          </button>\n          <span className={styles.currentDate}>{dateLabel}</span>\n        </div>\n        <div className={styles.viewToggle}>\n          <button className={styles.createButton} onClick={handleCreateNew} type=\"button\">\n            {t('reservation:calendarCreateNew')}\n          </button>\n          {([\n            { key: 'month' as ViewMode, label: t('reservation:calendarMonth') },\n            { key: 'week' as ViewMode, label: t('reservation:calendarWeek') },\n            { key: 'day' as ViewMode, label: t('reservation:calendarDay') },\n          ]).map(({ key, label }) => (\n            <button\n              className={`${styles.viewToggleButton} ${viewMode === key ? styles.viewToggleButtonActive : ''}`}\n              key={key}\n              onClick={() => setViewMode(key)}\n              type=\"button\"\n            >\n              {label}\n            </button>\n          ))}\n        </div>\n      </div>\n      {renderStatusLegend()}\n      {viewMode === 'month' && renderMonthView()}\n      {viewMode === 'week' && renderWeekView()}\n      {viewMode === 'day' && renderDayView()}\n      <DocumentDrawer initialData={initialData} onSave={fetchReservations} />\n    </div>\n  )\n}\n"],"names":["useConfig","useDocumentDrawer","useTranslation","React","Fragment","useCallback","useEffect","useMemo","useRef","useState","styles","STATUS_CLASS_MAP","cancelled","statusCancelled","completed","statusCompleted","confirmed","statusConfirmed","statusNoShow","pending","statusPending","STATUS_COLORS","CalendarView","config","t","_t","STATUS_LABELS","slugs","admin","custom","reservationSlugs","reservationSlug","reservations","currentDate","setCurrentDate","Date","viewMode","setViewMode","setReservations","loading","setLoading","drawerDocId","setDrawerDocId","initialData","setInitialData","undefined","DocumentDrawer","openDrawer","id","collectionSlug","pendingDrawerOpen","current","rangeEnd","rangeStart","start","end","setDate","getDate","getDay","setMonth","getMonth","dayOfWeek","setHours","fetchReservations","apiUrl","serverURL","routes","api","params","URLSearchParams","depth","limit","sort","toISOString","response","fetch","result","json","docs","handleEventClick","e","stopPropagation","handleEventKeyDown","key","preventDefault","handleCreateNew","handleDateClick","date","startTime","navigate","direction","prev","next","goToToday","getResName","field","name","getEventLabel","r","compact","time","toLocaleTimeString","hour","minute","serviceName","service","trim","customerName","customer","parts","filter","Boolean","join","getEventTooltip","startStr","endStr","endTime","resourceName","resource","status","renderEventItem","div","className","eventItem","onClick","onKeyDown","role","tabIndex","title","renderStatusLegend","statusLegend","Object","entries","map","label","legendItem","span","legendDot","style","background","renderCurrentTimeLine","cellDate","cellHour","now","getFullYear","getHours","topPercent","getMinutes","currentTimeLine","top","renderMonthView","firstDay","startDay","days","d","i","push","today","todayStr","monthGrid","dayHeader","day","dayStr","isToday","isOtherMonth","dayReservations","rDate","clickDate","dayCell","dayCellOtherMonth","dayCellToday","dayNumber","renderWeekView","startOfWeek","weekDays","hours","Array","from","length","_","weekView","toLocaleDateString","month","weekday","timeLabel","toString","padStart","di","cellReservations","weekCell","renderDayView","dayView","hourReservations","dayViewCell","dateLabel","year","endOfWeek","wrapper","header","navButtons","button","navButton","type","viewToggle","createButton","viewToggleButton","viewToggleButtonActive","onSave"],"mappings":"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"}

package/dist/components/DashboardWidget/DashboardWidget.module.css

@@ -0,0 +1,53 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.title {
+  margin: 0;
+  font-size: 1.25rem;
+}
+
+.statsGrid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
+  gap: 12px;
+}
+
+.statCard {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 12px;
+  border: 1px solid var(--theme-elevation-100);
+  border-radius: 4px;
+}
+
+.statValue {
+  font-size: 1.75rem;
+  font-weight: 700;
+  line-height: 1;
+}
+
+.statLabel {
+  font-size: 0.75rem;
+  color: var(--theme-elevation-500);
+  margin-top: 4px;
+  text-transform: uppercase;
+}
+
+.nextAppointment {
+  padding: 12px;
+  background: var(--theme-elevation-50);
+  border-radius: 4px;
+}
+
+.nextAppointment p {
+  margin: 4px 0;
+}
+
+.noData {
+  color: var(--theme-elevation-400);
+  font-style: italic;
+}

package/dist/components/DashboardWidget/DashboardWidgetServer.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetServerProps } from 'payload';
+export declare const DashboardWidgetServer: (props: WidgetServerProps) => Promise<import("react").JSX.Element | null>;