Add WS reconnect logic + connection indicator in calendar
- useHotelSocket: reconnect with exponential backoff (up to 30s), return connected state, log errors to console - BookingCalendar: show green/gray dot + Online/Offline label in toolbar - CalendarPage: pass wsConnected prop Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -31,6 +31,7 @@ interface BookingCalendarProps {
|
||||
locks?: Map<string, BookingLock>
|
||||
onDraftStart?: (roomId: string, checkIn: string, checkOut: string) => void
|
||||
onDraftCancel?: (roomId: string) => void
|
||||
wsConnected?: boolean
|
||||
}
|
||||
|
||||
const CATEGORY_ORDER: Record<string, number> = {
|
||||
@@ -54,7 +55,7 @@ function getRoomTypeColor(type: string): string {
|
||||
return map[type] ?? 'bg-slate-100 text-slate-600 dark:bg-slate-700 dark:text-slate-300'
|
||||
}
|
||||
|
||||
export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpdate, onBookingBulkUpdate, fadingBookingIds, rentalObjects, rentalBookings, onRentalBookingCreate, locks = new Map(), onDraftStart, onDraftCancel }: BookingCalendarProps) {
|
||||
export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpdate, onBookingBulkUpdate, fadingBookingIds, rentalObjects, rentalBookings, onRentalBookingCreate, locks = new Map(), onDraftStart, onDraftCancel, wsConnected }: BookingCalendarProps) {
|
||||
const [startDate, setStartDate] = useState(() => startOfDay(new Date()))
|
||||
const [visibleDays, setVisibleDays] = useState(DAYS_VISIBLE)
|
||||
|
||||
@@ -266,6 +267,20 @@ export function BookingCalendar({ rooms, bookings, onBookingCreate, onBookingUpd
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* WebSocket status indicator */}
|
||||
{wsConnected !== undefined && (
|
||||
<div
|
||||
className="flex items-center gap-1.5 px-2 py-1 rounded-lg text-xs text-slate-400 dark:text-slate-500"
|
||||
title={wsConnected ? 'Синхронизация активна' : 'Нет соединения — переподключение...'}
|
||||
>
|
||||
<span className={cn(
|
||||
'w-1.5 h-1.5 rounded-full',
|
||||
wsConnected ? 'bg-emerald-500' : 'bg-slate-300 dark:bg-slate-600 animate-pulse',
|
||||
)} />
|
||||
<span className="hidden sm:inline">{wsConnected ? 'Онлайн' : 'Офлайн'}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<button
|
||||
onClick={() => setCompact(v => { const next = !v; localStorage.setItem('calendarCompact', String(next)); return next })}
|
||||
title={compact ? 'Обычный вид' : 'Компактный вид'}
|
||||
|
||||
Reference in New Issue
Block a user