@aglyn/plugins-commerce 1.0.0-beta.277 → 1.0.0-beta.282

package/src/lib/components/console/reservations-card.component.js

@@ -25,7 +25,8 @@ import { useSnackbar } from "@aglyn/shared-ui-snackstack";
 import { Button, Chip, Dialog, DialogActions, DialogContent, DialogTitle, MenuItem, Stack, TextField, Typography } from "@mui/material";
 import { collection, deleteDoc, doc, getDocs, limit, orderBy, query, setDoc, updateDoc, where } from "firebase/firestore";
 import { useCallback, useMemo, useState } from "react";
-import { useFirestore, useMerchantPayments } from "@aglyn/tenant-feature-instance";
+import { useFirestore, useMerchantPayments, useUser } from "@aglyn/tenant-feature-instance";
+import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
 import { PrerequisiteNotice } from "@aglyn/shared-ui-jsx/components/prerequisite-notice.component";
 import { useFirestoreCollection, usePagedCollection, writeGuardedBySeed } from "@aglyn/tenant-feature-instance";
 import { pluginDocsHelp } from "@aglyn/aglyn";
@@ -39,19 +40,38 @@ const STATUS_COLOR = {
 };
 const usd = (cents)=>`$${((cents != null ? cents : 0) / 100).toFixed(2)}`;
 const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
+const nightLabel = (dayMs)=>new Date(dayMs).toLocaleDateString('en-US', {
+        weekday: 'short',
+        month: 'short',
+        day: 'numeric',
+        timeZone: 'UTC'
+    });
+/** The Reservations card's look-ahead for a several-unit resource. */ const UNITS_LOOKAHEAD_NIGHTS = 14;
+/** The desk's calendar day as the UTC-midnight `dayMs` stays are stored in. */ function localTodayDayMs() {
+    const now = new Date();
+    return Date.UTC(now.getFullYear(), now.getMonth(), now.getDate());
+}
+/** The units field's problem, or null when the typed value is a valid count. */ function unitsProblem(units) {
+    if (units === undefined) return null;
+    if (!Number.isInteger(units) || units < 1 || units > CommerceModel.MAX_RESOURCE_UNITS) {
+        return `A whole number from 1 to ${CommerceModel.MAX_RESOURCE_UNITS}`;
+    }
+    return null;
+}
 /**
  * Reservations console (AGL-311): resources CRUD (nightly pricing,
  * seasons via multipliers, deposits) plus the reservations list with
  * check-in/out, no-show, cancel, and walk-in creation. The storefront
  * widget books against the same docs.
  */ export function ReservationsCard(props) {
-    var _payments_href, _payments_reason, _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11;
+    var _payments_href, _payments_reason, _ref, _ref1, _ref2, _unitsProblem, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11, _ref12, _ref13;
     var _resourceDraft_name;
     const { hostId } = props;
     // Every reservation is paid when it is booked, so a store that cannot
     // charge turns each guest away; the card says so up front.
     const payments = useMerchantPayments(hostId);
     const firestore = useFirestore();
+    const { data: user } = useUser();
     const { enqueueSnackbar } = useSnackbar();
     const { confirm } = useConfirmationContext();
     const { data: resourceDocs, status: resourcesStatus, /**
@@ -82,6 +102,50 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
     ], {
         idField: '$id'
     });
+    /*
+   * Units left on each of the next nights, for resources with several units
+   * (AGL-4044). One listen across the site's resources, on the stays that
+   * have not ended, nearest check-out first: a range and an order on the same
+   * field, which Firestore's automatic single-field index serves. Not read at
+   * all while every resource has one unit, so a cabin-only site pays nothing.
+   *
+   * The 500 cap is the booking door's: it can only leave out stays that end
+   * after 500 others that are all still running, which would be a stay far
+   * past the two weeks this draws.
+   */ const hasSeveralUnits = (resourceDocs != null ? resourceDocs : []).some((resource)=>CommerceModel.resourceUnits(resource) > 1);
+    const todayDayMs = localTodayDayMs();
+    const { data: currentStays } = useFirestoreCollection(()=>hasSeveralUnits ? query(collection(firestore, 'hosts', hostId, 'reservations'), where('checkOutDayMs', '>', todayDayMs), orderBy('checkOutDayMs'), limit(500)) : null, [
+        firestore,
+        hostId,
+        hasSeveralUnits,
+        todayDayMs
+    ], {
+        idField: '$id'
+    });
+    const unitsAhead = useMemo(()=>{
+        const byResource = {};
+        if (!hasSeveralUnits) return byResource;
+        const nowMs = Date.now();
+        for (const resource of resourceDocs != null ? resourceDocs : []){
+            if (CommerceModel.resourceUnits(resource) === 1) continue;
+            const stays = (currentStays != null ? currentStays : []).filter((stay)=>stay.resourceId === resource.$id).map((stay)=>{
+                var _stay_createdAtMs;
+                return {
+                    checkInDayMs: Number(stay.checkInDayMs),
+                    checkOutDayMs: Number(stay.checkOutDayMs),
+                    status: stay.status,
+                    createdAtMs: Number((_stay_createdAtMs = stay.createdAtMs) != null ? _stay_createdAtMs : 0)
+                };
+            });
+            byResource[resource.$id] = CommerceModel.unitsLeftByNight(resource, stays, todayDayMs, UNITS_LOOKAHEAD_NIGHTS, nowMs);
+        }
+        return byResource;
+    }, [
+        hasSeveralUnits,
+        resourceDocs,
+        currentStays,
+        todayDayMs
+    ]);
     const resourceNames = useMemo(()=>{
         const map = {};
         for (const resource of resourceDocs != null ? resourceDocs : []){
@@ -93,6 +157,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
     ]);
     const [resourceDraft, setResourceDraft] = useState(null);
     const [walkIn, setWalkIn] = useState(null);
+    const [walkInBusy, setWalkInBusy] = useState(false);
     const handleResourceSave = useCallback(async ()=>{
         var _resourceDraft_name;
         if (!(resourceDraft == null ? void 0 : (_resourceDraft_name = resourceDraft.name) == null ? void 0 : _resourceDraft_name.trim()) || !(resourceDraft.nightlyRateUsd > 0)) {
@@ -108,11 +173,21 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
      * it into the stored document as a real field. Nothing reads it; it is
      * the listener's bookkeeping leaking into storage, and once there no
      * reader can tell it from a field the card meant to write.
-     */ const seeded = resourceDraft;
-        const { id, $id: _syntheticId } = seeded, data = _object_without_properties_loose(seeded, [
+     */ if (unitsProblem(resourceDraft.units)) return;
+        const seeded = resourceDraft;
+        const { id, $id: _syntheticId, units } = seeded, fields = _object_without_properties_loose(seeded, [
             "id",
-            "$id"
+            "$id",
+            "units"
         ]);
+        // Units are written as the count the model reads (AGL-4044), and a
+        // cleared field as 1 rather than left out: `merge: true` would otherwise
+        // keep a stored 12 the merchant just removed.
+        const data = 'units' in seeded ? _extends({}, fields, {
+            units: CommerceModel.resourceUnits({
+                units
+            })
+        }) : fields;
         /**
      * Refuse an EDIT whose seed the server never confirmed (AGL-1358).
      * `data` is the whole stored row spread out of the listener, so
@@ -208,25 +283,53 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                 status: item.status,
                 createdAtMs: item.createdAtMs
             }));
+        // Count-based for a several-unit resource (AGL-4044): the walk-in takes
+        // any unit that is free on every night, and is refused only when some
+        // night has none left.
         if (!CommerceModel.isRangeAvailable(resource, existing, checkInDayMs, checkOutDayMs)) {
-            return void enqueueSnackbar('Those dates are taken', {
+            const message = CommerceModel.resourceUnits(resource) > 1 ? 'Every unit is taken on at least one of those nights' : 'Those dates are taken';
+            return void enqueueSnackbar(message, {
                 variant: 'warning',
                 persist: false
             });
         }
-        await setDoc(doc(firestore, 'hosts', hostId, 'reservations', Aglyn.createResourceUid()), {
-            resourceId: walkIn.resourceId,
-            status: 'confirmed',
-            checkInDayMs,
-            checkOutDayMs,
-            guestName: walkIn.guestName || null,
-            guestEmail: null,
-            nights: quote.nights,
-            totalCents: quote.totalCents,
-            depositCents: 0,
-            paidCents: 0,
-            createdAtMs: Date.now()
-        });
+        /*
+     * The check above is the instant answer; the WRITE goes through
+     * `/api/commerce/reservations/walk-in` (AGL-4046), which re-asks the same
+     * question inside the transaction that books the stay. A client
+     * read-then-write let two staff on two devices both take the last unit.
+     */ setWalkInBusy(true);
+        try {
+            const response = await authorizedFetch(user, '/api/commerce/reservations/walk-in', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({
+                    hostId,
+                    resourceId: walkIn.resourceId,
+                    checkInDayMs,
+                    checkOutDayMs,
+                    guestName: walkIn.guestName || undefined,
+                    reservationId: walkIn.attemptId
+                })
+            });
+            const answer = await response.json().catch(()=>({}));
+            if (!response.ok) {
+                var _ref;
+                return void enqueueSnackbar((_ref = answer == null ? void 0 : answer.error) != null ? _ref : 'Could not reserve the walk-in — try again', {
+                    variant: response.status === 409 || response.status === 400 ? 'warning' : 'error',
+                    persist: false
+                });
+            }
+        } catch (unused) {
+            return void enqueueSnackbar('Could not reserve the walk-in — try again', {
+                variant: 'error',
+                persist: false
+            });
+        } finally{
+            setWalkInBusy(false);
+        }
         setWalkIn(null);
         enqueueSnackbar('Walk-in reserved — collect payment at POS', {
             variant: 'success',
@@ -237,6 +340,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
         resourceDocs,
         firestore,
         hostId,
+        user,
         enqueueSnackbar
     ]);
     return /*#__PURE__*/ _jsxs(CardDisplay, {
@@ -261,55 +365,81 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                         children: 'Resources'
                     }),
                     (resourceDocs != null ? resourceDocs : []).map((resource)=>/*#__PURE__*/ _jsxs(Stack, {
-                            direction: "row",
-                            spacing: 1,
-                            sx: {
-                                alignItems: 'center'
-                            },
+                            spacing: 0.5,
                             children: [
                                 /*#__PURE__*/ _jsxs(Stack, {
+                                    direction: "row",
+                                    spacing: 1,
                                     sx: {
-                                        flex: 1,
-                                        minWidth: 0
+                                        alignItems: 'center'
                                     },
                                     children: [
-                                        /*#__PURE__*/ _jsx(Typography, {
-                                            variant: "body2",
-                                            noWrap: true,
-                                            children: `${resource.name} · $${resource.nightlyRateUsd}/night`
+                                        /*#__PURE__*/ _jsxs(Stack, {
+                                            sx: {
+                                                flex: 1,
+                                                minWidth: 0
+                                            },
+                                            children: [
+                                                /*#__PURE__*/ _jsx(Typography, {
+                                                    variant: "body2",
+                                                    noWrap: true,
+                                                    children: [
+                                                        resource.name,
+                                                        `$${resource.nightlyRateUsd}/night`,
+                                                        ...CommerceModel.resourceUnits(resource) > 1 ? [
+                                                            `${CommerceModel.resourceUnits(resource)} units`
+                                                        ] : []
+                                                    ].join(' · ')
+                                                }),
+                                                /*#__PURE__*/ _jsx(Typography, {
+                                                    variant: "caption",
+                                                    color: "text.secondary",
+                                                    noWrap: true,
+                                                    children: `id: ${resource.$id}`
+                                                })
+                                            ]
                                         }),
-                                        /*#__PURE__*/ _jsx(Typography, {
-                                            variant: "caption",
-                                            color: "text.secondary",
-                                            noWrap: true,
-                                            children: `id: ${resource.$id}`
+                                        /*#__PURE__*/ _jsx(Button, {
+                                            size: "small",
+                                            onClick: ()=>setResourceDraft(_extends({
+                                                    id: resource.$id
+                                                }, resource)),
+                                            children: 'Edit'
+                                        }),
+                                        /*#__PURE__*/ _jsx(Button, {
+                                            size: "small",
+                                            color: "error",
+                                            onClick: async ()=>{
+                                                const confirmed = await confirm({
+                                                    title: 'Remove this resource?',
+                                                    description: 'Existing reservations keep their records; the widget ' + 'stops accepting new stays.',
+                                                    confirmationText: 'Remove',
+                                                    confirmationButtonProps: {
+                                                        color: 'error'
+                                                    }
+                                                }).then(()=>true).catch(()=>false);
+                                                if (!confirmed) return;
+                                                await deleteDoc(doc(firestore, 'hosts', hostId, 'resources', resource.$id));
+                                            },
+                                            children: 'Remove'
                                         })
                                     ]
                                 }),
-                                /*#__PURE__*/ _jsx(Button, {
-                                    size: "small",
-                                    onClick: ()=>setResourceDraft(_extends({
-                                            id: resource.$id
-                                        }, resource)),
-                                    children: 'Edit'
-                                }),
-                                /*#__PURE__*/ _jsx(Button, {
-                                    size: "small",
-                                    color: "error",
-                                    onClick: async ()=>{
-                                        const confirmed = await confirm({
-                                            title: 'Remove this resource?',
-                                            description: 'Existing reservations keep their records; the widget ' + 'stops accepting new stays.',
-                                            confirmationText: 'Remove',
-                                            confirmationButtonProps: {
-                                                color: 'error'
-                                            }
-                                        }).then(()=>true).catch(()=>false);
-                                        if (!confirmed) return;
-                                        await deleteDoc(doc(firestore, 'hosts', hostId, 'resources', resource.$id));
+                                unitsAhead[resource.$id] ? /*#__PURE__*/ _jsx(Stack, {
+                                    direction: "row",
+                                    useFlexGap: true,
+                                    "aria-label": `Units left on the next ${UNITS_LOOKAHEAD_NIGHTS} nights`,
+                                    sx: {
+                                        flexWrap: 'wrap',
+                                        gap: 0.5
                                     },
-                                    children: 'Remove'
-                                })
+                                    children: unitsAhead[resource.$id].map((night)=>/*#__PURE__*/ _jsx(Chip, {
+                                            size: "small",
+                                            variant: "outlined",
+                                            color: night.unitsLeft === 0 ? 'error' : night.unitsLeft <= CommerceModel.FEW_UNITS_LEFT ? 'warning' : 'default',
+                                            label: `${nightLabel(night.dayMs)} · ${night.unitsLeft} of ${night.units} left`
+                                        }, night.dayMs))
+                                }) : null
                             ]
                         }, resource.$id)),
                     /*#__PURE__*/ _jsxs(Stack, {
@@ -337,7 +467,8 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                         resourceId: (_ref = resourceDocs == null ? void 0 : (_resourceDocs_ = resourceDocs[0]) == null ? void 0 : _resourceDocs_.$id) != null ? _ref : '',
                                         checkIn: '',
                                         checkOut: '',
-                                        guestName: ''
+                                        guestName: '',
+                                        attemptId: Aglyn.createResourceUid()
                                     });
                                 },
                                 children: 'Walk-in'
@@ -482,13 +613,51 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                 },
                                 placeholder: "Lakeside cabin"
                             }),
+                            /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "row",
+                                spacing: 1,
+                                children: [
+                                    /*#__PURE__*/ _jsx(TextField, {
+                                        label: "Spots or units available",
+                                        placeholder: "1",
+                                        value: (_ref2 = resourceDraft == null ? void 0 : resourceDraft.units) != null ? _ref2 : '',
+                                        onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
+                                                    units: event.target.value.replace(/\D/g, '') === '' ? undefined : Number(event.target.value.replace(/\D/g, ''))
+                                                }) : prev),
+                                        error: Boolean(unitsProblem(resourceDraft == null ? void 0 : resourceDraft.units)),
+                                        helperText: (_unitsProblem = unitsProblem(resourceDraft == null ? void 0 : resourceDraft.units)) != null ? _unitsProblem : 'How many identical ones you have, like 12 RV hookups',
+                                        size: "small",
+                                        fullWidth: true,
+                                        slotProps: {
+                                            htmlInput: {
+                                                inputMode: 'numeric'
+                                            }
+                                        }
+                                    }),
+                                    /*#__PURE__*/ _jsx(TextField, {
+                                        label: "Sleeps",
+                                        value: (_ref3 = resourceDraft == null ? void 0 : resourceDraft.capacity) != null ? _ref3 : '',
+                                        onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
+                                                    capacity: Math.round(Number(event.target.value)) || undefined
+                                                }) : prev),
+                                        helperText: "Guests per unit, for display",
+                                        size: "small",
+                                        fullWidth: true,
+                                        slotProps: {
+                                            htmlInput: {
+                                                inputMode: 'numeric'
+                                            }
+                                        }
+                                    })
+                                ]
+                            }),
                             /*#__PURE__*/ _jsxs(Stack, {
                                 direction: "row",
                                 spacing: 1,
                                 children: [
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Nightly rate ($)",
-                                        value: (_ref2 = resourceDraft == null ? void 0 : resourceDraft.nightlyRateUsd) != null ? _ref2 : '',
+                                        value: (_ref4 = resourceDraft == null ? void 0 : resourceDraft.nightlyRateUsd) != null ? _ref4 : '',
                                         onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
                                                     nightlyRateUsd: Number(event.target.value) || 0
                                                 }) : prev),
@@ -502,7 +671,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Weekend ×",
                                         placeholder: "1",
-                                        value: (_ref3 = resourceDraft == null ? void 0 : resourceDraft.weekendMultiplier) != null ? _ref3 : '',
+                                        value: (_ref5 = resourceDraft == null ? void 0 : resourceDraft.weekendMultiplier) != null ? _ref5 : '',
                                         onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
                                                     weekendMultiplier: Number(event.target.value) || undefined
                                                 }) : prev),
@@ -521,7 +690,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                 children: [
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Min nights",
-                                        value: (_ref4 = resourceDraft == null ? void 0 : resourceDraft.minNights) != null ? _ref4 : '',
+                                        value: (_ref6 = resourceDraft == null ? void 0 : resourceDraft.minNights) != null ? _ref6 : '',
                                         onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
                                                     minNights: Math.round(Number(event.target.value)) || undefined
                                                 }) : prev),
@@ -535,7 +704,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Deposit %",
                                         placeholder: "100 = pay in full",
-                                        value: (_ref5 = resourceDraft == null ? void 0 : resourceDraft.depositPct) != null ? _ref5 : '',
+                                        value: (_ref7 = resourceDraft == null ? void 0 : resourceDraft.depositPct) != null ? _ref7 : '',
                                         onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
                                                     depositPct: Math.round(Number(event.target.value)) || undefined
                                                 }) : prev),
@@ -548,7 +717,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                     }),
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Free cancel (hrs)",
-                                        value: (_ref6 = resourceDraft == null ? void 0 : resourceDraft.cancellationHours) != null ? _ref6 : '',
+                                        value: (_ref8 = resourceDraft == null ? void 0 : resourceDraft.cancellationHours) != null ? _ref8 : '',
                                         onChange: (event)=>setResourceDraft((prev)=>prev ? _extends({}, prev, {
                                                     cancellationHours: Math.round(Number(event.target.value)) || undefined
                                                 }) : prev),
@@ -572,7 +741,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                             /*#__PURE__*/ _jsx(Button, {
                                 variant: "contained",
                                 color: "primary",
-                                disabled: !(resourceDraft == null ? void 0 : (_resourceDraft_name = resourceDraft.name) == null ? void 0 : _resourceDraft_name.trim()) || !(((_ref7 = resourceDraft == null ? void 0 : resourceDraft.nightlyRateUsd) != null ? _ref7 : 0) > 0),
+                                disabled: !(resourceDraft == null ? void 0 : (_resourceDraft_name = resourceDraft.name) == null ? void 0 : _resourceDraft_name.trim()) || !(((_ref9 = resourceDraft == null ? void 0 : resourceDraft.nightlyRateUsd) != null ? _ref9 : 0) > 0) || Boolean(unitsProblem(resourceDraft == null ? void 0 : resourceDraft.units)),
                                 onClick: handleResourceSave,
                                 children: 'Save'
                             })
@@ -598,7 +767,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                         children: [
                             /*#__PURE__*/ _jsx(TextField, {
                                 label: "Resource",
-                                value: (_ref8 = walkIn == null ? void 0 : walkIn.resourceId) != null ? _ref8 : '',
+                                value: (_ref10 = walkIn == null ? void 0 : walkIn.resourceId) != null ? _ref10 : '',
                                 onChange: (event)=>setWalkIn((prev)=>prev ? _extends({}, prev, {
                                             resourceId: event.target.value
                                         }) : prev),
@@ -619,7 +788,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Check-in",
                                         type: "date",
-                                        value: (_ref9 = walkIn == null ? void 0 : walkIn.checkIn) != null ? _ref9 : '',
+                                        value: (_ref11 = walkIn == null ? void 0 : walkIn.checkIn) != null ? _ref11 : '',
                                         onChange: (event)=>setWalkIn((prev)=>prev ? _extends({}, prev, {
                                                     checkIn: event.target.value
                                                 }) : prev),
@@ -634,7 +803,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                                     /*#__PURE__*/ _jsx(TextField, {
                                         label: "Check-out",
                                         type: "date",
-                                        value: (_ref10 = walkIn == null ? void 0 : walkIn.checkOut) != null ? _ref10 : '',
+                                        value: (_ref12 = walkIn == null ? void 0 : walkIn.checkOut) != null ? _ref12 : '',
                                         onChange: (event)=>setWalkIn((prev)=>prev ? _extends({}, prev, {
                                                     checkOut: event.target.value
                                                 }) : prev),
@@ -650,7 +819,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                             }),
                             /*#__PURE__*/ _jsx(TextField, {
                                 label: "Guest name",
-                                value: (_ref11 = walkIn == null ? void 0 : walkIn.guestName) != null ? _ref11 : '',
+                                value: (_ref13 = walkIn == null ? void 0 : walkIn.guestName) != null ? _ref13 : '',
                                 onChange: (event)=>setWalkIn((prev)=>prev ? _extends({}, prev, {
                                             guestName: event.target.value
                                         }) : prev),
@@ -667,7 +836,7 @@ const day = (dayMs)=>dayMs ? new Date(dayMs).toISOString().slice(0, 10) : '—';
                             /*#__PURE__*/ _jsx(Button, {
                                 variant: "contained",
                                 color: "primary",
-                                disabled: !(walkIn == null ? void 0 : walkIn.resourceId) || !(walkIn == null ? void 0 : walkIn.checkIn) || !(walkIn == null ? void 0 : walkIn.checkOut),
+                                disabled: walkInBusy || !(walkIn == null ? void 0 : walkIn.resourceId) || !(walkIn == null ? void 0 : walkIn.checkIn) || !(walkIn == null ? void 0 : walkIn.checkOut),
                                 onClick: handleWalkIn,
                                 children: 'Reserve'
                             })