mirror of
https://github.com/hanzo-apps/booking-timeslot.git
synced 2026-10-30 19:24:48 +00:00
Vite + React 19 + @hanzo/gui + @hanzo/iam + @hanzo/base, forked from hanzo-starter. Three views (Book / Bookings / Availability) over two org-scoped Base collections (slots, bookings); 'booked' is derived from bookings so every action is a single write. Calm light single-accent scheduler. tsc + vite build green.
4.2 KiB
4.2 KiB
booking-timeslot (Cadence) — agent notes
Cadence is a calm timeslot-booking scheduler on the Hanzo stack, forked from
hanzo-starter. Vite + React 19 + @hanzo/gui (UI) + @hanzo/iam (auth) +
@hanzo/base (data). Keep it minimal and REAL — every surface must build and
run, no fabricated UI.
What it is
Publish the windows you are free, then let clients claim one. Three views over two org-scoped Base collections:
- Book (
src/views/book.tsx) — open slots laid out as a calm agenda, one day per row; pick a slot, add name/email/note, confirm. That writes onebookingsrow. - Bookings (
src/views/bookings.tsx) — every reservation joined to its slot time; cancel deletes the booking row. - Availability (
src/views/availability.tsx) — publish slots, toggle open/closed, remove. A booked slot can't be removed here.
One way, decomplected
- Providers (
src/providers.tsx) mount in the canonical order every Hanzo surface ships:GuiProvider→IamProvider→BaseProvider.BaseProvidergets aBaseClientcarrying the IAM access token; it is rebuilt when the token changes (src/lib/base.tsbaseAs). That single seam is what makes everyuseQuery/useMutationorg-scoped to the signed-in user. Cadence fixes the light theme for its calm look. - Env is one place (
src/env.ts), read fromimport.meta.env.VITE_*.VITE_HANZO_CLIENT_IDfalls back tohanzo-app. - Domain + look are one place (
src/lib/booking.ts): theSlot/Bookingtypes, the single accent (calm teal) + neutral palette, and the time helpers. - "Booked" is derived, never stored twice. A slot shows booked iff a
bookingsrow points at its id, so every action (book, cancel, open/close) is a single write and nothing can drift.slots.openis only the owner's publish toggle. - UI is one system —
@hanzo/guiprimitives only (no second kit, no Tailwind). The shared inputs/buttons live insrc/views/ui.tsx.
Gotchas (do not regress)
@hanzo/guiunder Vite needs three things invite.config.ts(it is the Tamagui line; the in-browser builder runtime can't do this, which is the whole reason this ships as a real repo): (1) aliasreact-native→react-native-web, (2)defineprocess.env.TAMAGUI_TARGET/NODE_ENV/__DEV__, (3)dedupereact/react-dom/react-native-web.@hanzo/guiprops are Tamagui LONGHAND with this v5 config:alignItems/justifyContent/backgroundColor/padding/alignSelf/borderRadius/textAlign— NOT theitems/justify/bg/p/self/rounded/textshorthands. Shorthands pass at runtime but FAILtsc.Buttonhas nocolor/fontWeightprop. It is a frame — put text styling on an explicit<Text>child (this is whyui.tsxwraps every label).ButtonusesonPress;Inputusesvalue/onChangeText.useMutation('x','update')needsdata.idin the object it is given (mutate({ id, ...fields }));deleteneedsmutate({ id }).- PKCE storage is
localStorageso the verifier/state survive the round-trip to hanzo.id. schema.sqlis the data contract — thedatabaseSchemaDDL the deploy translates into Base collections (provisionBaseFromDDL). Keep it in lockstep withsrc/lib/booking.ts+ the three views.
Deploy contract (Hanzo Cloud)
- Static SPA:
npm run build→dist/, served at<slug>.hanzo.appfrom object storage. No server process. - On publish,
schema.sql→provisionBaseFromDDLcreatesslots+bookings(org-scoped, IAM-native). Runtime read/write is browser →VITE_HANZO_BASE_URLwith the IAM token. - IAM redirect registration is the one external requirement: the IAM client
(
VITE_HANZO_CLIENT_ID, defaulthanzo-app) must allow this origin's/auth/callback(ahttps://*.hanzo.app/auth/callbackwildcard on the shared client, or a per-apphanzo-booking-timeslotclient).
Proven
tsc --noEmit clean · vite build → dist/ (899 modules). Longhand props and
<Text>-child button labels compile green under tsc.
Build
CI (.github/workflows/ci.yml) runs npm ci && npm run typecheck && npm run build — build-verification only, NEVER a container image (Hanzo Cloud owns
deploys; do not build images locally).