Guest messages
A React block (a whole screen) in Beamline's Hotel & restaurant app.
Conversations with guests beside the booking each is about, for a host stand, salon front desk or hotel. Guests waiting for an answer come first with how long they've waited (half an hour in the warning tint). The thread shows each of your messages' delivery in words (sending, sent, delivered, read) and a failed one with its reason and Retry. The booking card beside it has the date and time, party, table and status, only what the guest declared as needs, and its own change ("Move to 8:00 PM") from the times the venue can offer, since a reply that promises a change changes nothing; messages and booking changes, and a refused move with its reason, are logged apart.
Use it for
- Answering guests about their bookings, with the booking and its change beside the thread.
- A front desk where who has waited longest must be seen first.
Not for
- A support team's ticket queue with SLAs (helpdesk-inbox).
- Assigning rooms to bookings (reservation-desk).
- A team's own chat (team-chat).
Anatomy
- header: the product's mark, the title, how many guests wait
- conversations: each guest with how long they've waited, the booking in a line, the last message
- thread: the guest's name, the messages with delivery, the composer
- booking: when, party, table, status; what the guest told us; Move to a time with Move; the activity, messages and changes apart
States
- a guest waiting (minutes, warning from half an hour), answered
- a message sending, sent, delivered, read, failed with Retry
- a booking confirmed, seated, cancelled; moving, moved, refused with the reason
- no conversations; none chosen
- phone: the conversations, then the thread with the booking under it and Back
- right to left: mirrors
Keyboard
- Tab through the conversations, the composer and Send, the move time and Move
Motion
None of its own.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
conversations (required) | GuestConversation[] | — | |
slots | Record<string, string[]> | — | Times each booking could move to, by booking id ("20:00"). |
activity | Record<string, BookingEvent[]> | — | Past activity by booking id. |
onSend | ((conversationId: string, text: string) => Promise<void>) | — | Send a message; reject to mark it failed with Retry. Sending never changes the booking. |
onMove | ((bookingId: string, time: string) => Promise<{ time: string; }>) | — | Move a booking; resolve with the time it moved to, reject to keep it (said). |
now | string | — | |
defaultConversation | string | null | — | |
venue | string | — | The venue's name, used as the host's name in threads. |
product | string | — | |
className | string | — | Classes on the documented visual root; no override by default. |
ref | Ref<HTMLDivElement> | — | Receives the documented native target or imperative handle; omitted by default. |
Built from
- Alert
- Attachment
- Avatar
- Bottom sheet
- Button
- Chat thread
- Conversation
- Emoji picker
- Empty state
- Glow
- Kbd
- Label
- Marker
- Popover
- Search field
- Segmented control
- Select
- Slot text
- Spinner
- Text morph
- Tooltip
Dependencies
lucide-react
Import
import { GuestMessages } from "@beamline/guest-messages";
Get it
Guest messages is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. Get Beamline · Connect your agent
More in Hotel & restaurant
- Reservation desk: A front desk's bookings without a room for a night, beside the rooms that could take them: bookings grouped by room type with their stay, party and…
- Table service: A restaurant table's service in three places sharing one order. The floor: tables placed on a plan by drag, arrow keys or typed numbers (Shift and an…
- Counter service: A counter and its kitchen. The counter: the order on the left (its name, eat here / takeaway / drive-through, each line with its options and quantity…
- Room readiness: Housekeeping's rooms for the day: condition, occupancy, the front desk's plan (arriving with its time or not known, departing, staying on), who is…
- Stay folio: A stay's folio: the chosen folio's lines filtered by kind, posted and pending said, voided lines on request, every row in the ledger's currency; beside…
- Shift briefing: A team's pre-shift briefing for a restaurant service (or any shift with bookings): the venue, the service and when its reservation snapshot was read, an…
- Map explorer: A map with one operational layer over real ground (an optional map base: relief, lakes, streams, woods, roads), explored without losing your place; its…
- Page header: The top of a record or project page: breadcrumb, title with status, description and meta, a primary action with secondary actions that fold into a More…
- Turntable review: A 3D asset reviewed on a turntable. The object large at the angle in view with front, side and back said, standing on a plate whose rim shows the twelve…