Appointment Booking | TotalApp Docs

Overview

Appointment Booking gives customers a clean, step-by-step way to book any resource — consultation calls, conference rooms, training sessions, or field service visits — without phone calls or back-and-forth emails. Admins manage all bookings through a drag-and-resize calendar and configure each resource's availability, pricing, and approval rules. A two-way sync with Google Calendar and Microsoft Outlook prevents double-booking across the organisation.

Public Booking Page

A five-step self-service wizard customers use to select a service, choose a date, pick a time slot, enter their details, and confirm — no login required.

Resource Calendar

Month, week, and day views for admins. Click any slot to create a booking; click any event to edit, reschedule, or cancel. Full resource and status filtering.

My Bookings

A personal portal for customers to view upcoming appointments, cancel within the policy window, and reschedule to another available slot.

Calendar Sync

Connect Google Calendar or Microsoft Outlook to push bookings outward and pull external events in as blocked slots, eliminating double-booking.

Quick Start

Open TotalApp and switch to Field Service mode using the mode switcher in the header.
Select Book Appointment in the sidebar to open the public-facing booking wizard.
Walk through the five steps: choose a resource → view details → pick a date → select a time slot → enter contact information and confirm.
Switch to Resource Calendar to see the booking you just created appear on the calendar.
Click the event to open the edit modal, change the status to Confirmed, and save.
Navigate to My Bookings to see the booking in the Upcoming tab.
Go to Calendar Sync and click Connect Google Calendar to begin two-way sync.

First booking in under two minutes

The system ships with four demo resources (Consultation Call, Conference Room A, Technical Training, Field Service Appointment). You can book against any of them immediately without any configuration.

Module Structure

The Appointment Booking module consists of four screens accessible from the sidebar under the Appointment Booking group:

Screen	Sidebar Label	Purpose	Who uses it
Public Booking Page	Book Appointment	Customer-facing five-step booking wizard	Customers, walk-in staff
Resource Calendar	Resource Calendar	Admin calendar — create, edit, filter bookings	Admins, managers
My Bookings	My Bookings	Personal upcoming / past booking list	All authenticated users
Calendar Sync	Calendar Sync	Google / Outlook OAuth connection and sync settings	Admins, individual users

Resource Types

Every bookable entity in the system is a Resource. Resources have a type that determines how they appear to customers and how availability is calculated.

Type	Description	Examples
service	A person-delivered service with a fixed duration and optional price	Consultation call, technical support, coaching session
room	A physical space bookable in time blocks	Conference room, meeting suite, training lab
instructor	A scheduled class or workshop with limited capacity	Technical training, onboarding session, webinar
equipment	A piece of equipment reserved for a period	Camera kit, testing rig, demo unit

Booking Statuses

Status	Colour	Meaning	Set by
Confirmed	Green	Booking is accepted and active	System (free resources) or admin
Pending	Amber	Awaiting admin approval (resources with requiresApproval = true)	System on booking creation
Cancelled	Red	Booking was cancelled by customer or admin	Customer (within policy) or admin
Completed	Grey	Appointment has taken place	Admin after service delivery

Availability Engine

When a customer selects a resource and date, TotalApp calculates free time slots using five parameters defined per resource:

Available Days — which days of the week the resource operates (e.g. Mon–Fri only).
Start Hour / End Hour — the operating window (e.g. 09:00–17:00). No slots are offered outside this window.
Duration — how long each booking occupies (e.g. 60 minutes). Slots are calculated by stepping through the window in Slot Interval increments.
Slot Interval — the stride between slot start times (e.g. 30 min → slots at :00, :30; 60 min → slots at :00 only).
Buffer Between — dead time reserved after each booking ends, so back-to-back appointments never collide (e.g. 15 min clean-up after each call).
Max Per Day — hard cap on bookings per day regardless of remaining time slots.

How slots are marked unavailable

A slot is shown as unavailable (greyed out) when any of these conditions are true: the slot overlaps an existing non-cancelled booking plus its buffer; the day's booking count has reached maxPerDay; or the slot extends beyond the resource's end hour.

Data Storage

All booking data is persisted via the server-backed JSON API at /api/data/appointments. The store has three top-level keys:

Key	Contents
`resources`	All bookable resources indexed by `res-*` ID
`bookings`	All booking records indexed by `book-*` ID
`syncTokens`	OAuth tokens and sync preferences per user per provider

OAuth tokens are stored unencrypted in development

In production, replace the flat JSON store with an encrypted secrets manager before storing real OAuth access and refresh tokens. The service layer (appointmentService.ts) exposes saveSyncToken / deleteSyncToken functions that abstract the storage layer — only those two functions need to change for production encryption.

Integration Points

Module	Integration
Field Service	Field Service Appointment resource type feeds directly into the Dispatch Board as scheduled jobs
Finance	Paid bookings (price > 0) can create draft invoice records in Accounts Receivable
CRM	Bookings appear in the customer's activity timeline
Notifications	Confirmation emails with .ics calendar attachment on booking creation and status change
Google Calendar	Two-way OAuth sync via Calendar Sync screen
Microsoft Outlook	Two-way OAuth sync via Microsoft Graph API

Frequently Asked Questions

Can customers book without creating an account?

Yes. The Public Booking Page requires no login. Customers enter their name, email, and phone as part of the booking form. The My Bookings screen, however, requires authentication to view or manage personal booking history.

How does approval work for restricted resources?

When a resource has requiresApproval set to true, a booking created through the Public Booking Page lands in Pending status. An admin sees the pending booking on the Resource Calendar (highlighted in amber) and can change the status to Confirmed or Cancelled from the edit modal. The customer is not guaranteed a slot until the admin confirms.

What happens if two customers try to book the same slot simultaneously?

Availability is recalculated at booking-creation time against the live bookings store. The first request to hit the server wins; the second will find the slot already occupied and receive an empty slots response if it reloads availability. In high-concurrency scenarios, consider adding an optimistic lock on the booking record (check-and-set pattern) in the server handler.

Can I offer different durations for the same resource?

Each resource has a single fixed duration. To offer multiple durations (e.g. a 30-min quick call and a 60-min deep dive), create two separate resources with the same staff or room but different duration settings. Both will appear on the Public Booking Page under the same resource type filter.

How far in advance can customers book?

There is no hard system limit on how far in advance a customer can navigate the calendar. If you need to restrict bookings to, say, the next 30 days, implement a maximum-date guard in the isDateAvailable function inside PublicBookingPage.tsx by comparing the selected date against today + 30.