@wix/himalaya-cli 0.1581.0 → 0.1583.0

package/templates/branded-lite/tier5-src/himi-booking-service/index.ts

@@ -1,8 +1,19 @@
 // Tier-5 bundle: himi-booking — single service detail.
+//
+// Opened from an Agenda row (`sessionId` + `start` in the input), the screen is about THAT
+// session: its date and time show under the name and in the facts, and the footer offers what
+// the Agenda row offers, from the same session state (`_shared/booking-session.ts`): Book (Choose
+// Time opens with the session picked), Join Waitlist (joined from here), a disabled Book with the
+// reason, or the member's own place (Booked / On waitlist). A course keeps its course footer.
+// Opened without a session (the Services list), the footer is "Choose a Time", as before.
 import { defineService, navigate } from "@himalaya/state";
 import { share as shareSheet } from "@himalaya/share";
 import { open, defaultMode } from "@himalaya/open-url";
-import { getService, queryServiceAvailability, type WixAvailabilityEntry, type WixService, type WixServiceAddress, type WixServiceBookingPolicy } from "@himalaya/wix-bookings";
+import { addDays, dayKey, dayLabel, timeLabel } from "@himalaya/time";
+import { getService, queryServiceAvailability, registerToWaitlist, type WixAvailabilityEntry, type WixService, type WixServiceAddress, type WixServiceBookingPolicy } from "@himalaya/wix-bookings";
+import { getMyMember } from "@himalaya/wix-members";
+import { memberAccess, type MemberAccess } from "../_shared/member-access.js";
+import { placesIn, sessionControl, sessionOf, type MemberPlace, type Session, type SessionControl } from "../_shared/booking-session.js";
 import { categoryName, courseDatesText, courseReadWindows, courseSessionsAvailability, courseWindowOpen, serviceDurationText, servicePriceLine, slotStartInstant, type BookingLabel, type ServicePriceLine } from "../_shared/himi-bookings.js";
 import { formatServiceMoney, serviceCurrency } from "../_shared/wix-service-price.js";
 import { stashCopy, copyParam, copyTemplate, copyPlural } from "../_shared/himi-copy.js";
@@ -145,6 +156,32 @@ interface S {
   notLoading: boolean;
   hasService: boolean;
   noEmpty: boolean;
+  // ---- The session an Agenda row opened this screen on (all "" without one) ----
+  /** Its Wix session id ("" when it has none) and start instant: Book opens Choose Time on it. */
+  sessionId: string;
+  sessionStart: string;
+  /** "Tue, Nov 5 · 6:00 PM" under the name; the date and the time range apart for the fact row. */
+  sessionWhen: string;
+  sessionDate: string;
+  sessionTime: string;
+  noSession: boolean;
+  /** The control the Agenda row shows for this session (`sessionControl`), "" without a session. */
+  sessionControl: "" | SessionControl;
+  /** Why a closed session cannot be booked: "Full", "Not open yet" or "Closed". */
+  closedLabel: string;
+  noSessionBook: boolean;
+  noSessionRequest: boolean;
+  noSessionWaitlist: boolean;
+  noSessionClosed: boolean;
+  noSessionBooked: boolean;
+  noSessionWaitlisted: boolean;
+  /** "Change time" shows while the member can still choose another session. */
+  noChangeTime: boolean;
+  /** The outcome of a waitlist join, above the footer's control: it went through (a check) or not. */
+  sessionMessage: string;
+  sessionMessageOk: boolean;
+  sessionMessageFailed: boolean;
+  noSessionMessage: boolean;
 }
 
 function inputId(): string {
@@ -158,6 +195,15 @@ function inputId(): string {
   return screenId.startsWith("himi_service_") ? screenId.slice("himi_service_".length) : "";
 }
 
+/** The session an Agenda row opened this screen on, from the same input as `id`: `sessionId`
+ *  (the Wix session id, "" for a session without one) and `start` (its ISO instant). No valid
+ *  `start` — opened from the Services list — and the screen has no session. */
+function inputSession(): { sessionId: string; start: string } {
+  const input = (globalThis as { himalaya?: { input?: { sessionId?: unknown; start?: unknown } } }).himalaya?.input;
+  const start = typeof input?.start === "string" && Number.isFinite(Date.parse(input.start)) ? input.start : "";
+  return { sessionId: start && typeof input?.sessionId === "string" ? input.sessionId.trim() : "", start };
+}
+
 function stringOf(value: unknown): string {
   return typeof value === "string" ? value.trim() : "";
 }
@@ -546,12 +592,146 @@ async function withGroupAvailability(s: S, service: WixService): Promise<S> {
   }
 }
 
+// ---- The session from the Agenda -------------------------------------------------
+
+/** The session as last read, with the member its place was read for: a join checks against them. */
+interface Picked { session: Session; place: MemberPlace | undefined; who: MemberAccess | undefined }
+
+const NO_SESSION = {
+  sessionId: "", sessionStart: "", sessionWhen: "", sessionDate: "", sessionTime: "", sessionControl: "" as const, closedLabel: "",
+};
+const NO_SESSION_MESSAGE = { sessionMessage: "", sessionMessageOk: false, sessionMessageFailed: false };
+
+let picked: Picked | undefined;
+/** The record the last load showed: a join that finds another member re-reads its session. */
+let loadedService: WixService | undefined;
+/** A waitlist join is in flight: a second tap registers nothing. */
+let joining = false;
+
+/** The input session as the Agenda read it: the service's availability on that LOCAL day (the
+ *  Agenda reads whole local days), the entry with the session id — or, for a session without
+ *  one, the same start instant — and the signed-in member's place in it. `undefined` when the
+ *  screen has no session, the service is not a class or course, the session is no longer listed,
+ *  or a read fails: the screen then offers "Choose a Time", as from the Services list. */
+async function readSession(service: WixService): Promise<Picked | undefined> {
+  const want = inputSession();
+  const type = stringOf(service.type).toUpperCase();
+  if (!want.start || (type !== "CLASS" && type !== "COURSE")) return undefined;
+  const day = dayKey(want.start);
+  try {
+    const from = new Date(`${day}T00:00:00`).toISOString();
+    const to = new Date(`${dayKey(addDays(day, 1))}T00:00:00`).toISOString();
+    const res = await queryServiceAvailability(service.id, from, to, { bookable: false });
+    const sessions = (res.availabilityEntries ?? []).map((entry) => sessionOf(entry, service)).filter((x): x is Session => !!x);
+    const at = Date.parse(want.start);
+    // Two sessions of a class can start at the same instant: the session id decides when there is one.
+    const session = want.sessionId
+      ? sessions.find((x) => x.sessionId === want.sessionId)
+      : sessions.find((x) => !x.sessionId && Date.parse(x.start) === at) ?? sessions.find((x) => Date.parse(x.start) === at);
+    if (!session) return undefined;
+    // A failed bookings read is not "no place": Book on a session the member holds invites a
+    // duplicate, so the screen falls back to Choose a Time instead (placesIn throws).
+    const { who, found } = await placesIn(day, day, [session]);
+    return { session, place: found.get(session.key), who };
+  } catch (err) {
+    // Not silent: the screen still offers "Choose a Time", and the host log says why it did not
+    // offer the session's own control.
+    console.warn("himi_service: the Agenda session could not be read; offering Choose a Time", err);
+    return undefined;
+  }
+}
+
+/** How long the session read may take before the screen paints without it. The read asks the host
+ *  for the member's identity, and a host whose identity dispatch never settles must not pin the
+ *  skeleton (the time screen's D5 case). */
+const SESSION_READ_BUDGET_MS = 10_000;
+
+/** `readSession`, or `undefined` once the budget is spent. A worker engine with no timer waits
+ *  for the read itself. */
+function readSessionBounded(service: WixService): Promise<Picked | undefined> {
+  const host = globalThis as { setTimeout?: (fn: () => void, ms: number) => unknown; clearTimeout?: (timer: unknown) => void };
+  const read = readSession(service);
+  if (typeof host.setTimeout !== "function") return read;
+  return new Promise((resolve) => {
+    const timer = host.setTimeout!(() => resolve(undefined), SESSION_READ_BUDGET_MS);
+    void read.then((sel) => {
+      try { host.clearTimeout?.(timer); } catch { /* best-effort */ }
+      resolve(sel);
+    });
+  });
+}
+
+/** A class session's own spots: "4 spots left", or full — with "You can join the waitlist" only
+ *  when Join Waitlist is offered. The service-wide line describes the NEXT session, which may be
+ *  another one. Unknown capacity (the site reports none) shows no line, as on the Agenda row. */
+function sessionSpots(session: Session, control: SessionControl): Pick<S, "spotsText" | "spotsWarning"> {
+  if (session.total <= 0) return { spotsText: "", spotsWarning: false };
+  if (session.open > 0) return { spotsText: spotText(session.open), spotsWarning: session.open <= 3 };
+  return {
+    spotsText: control === "waitlist"
+      ? copyParam("service.classFullWaitlist", "The class is fully booked. You can join the waitlist.")
+      : copyParam("service.classFull", "The class is fully booked."),
+    spotsWarning: false,
+  };
+}
+
+/** `s` showing `sel` — or no session. Records `sel` as the session a join acts on. */
+function withSession(s: S, sel: Picked | undefined): S {
+  picked = sel;
+  if (!sel) return derive({ ...s, ...NO_SESSION });
+  const { session, place } = sel;
+  const { control, closedLabel } = sessionControl(session, place);
+  const date = dayLabel(session.start, { absolute: true });
+  const time = Date.parse(session.end) > Date.parse(session.start)
+    ? `${timeLabel(session.start)} – ${timeLabel(session.end)}`
+    : timeLabel(session.start);
+  return derive({
+    ...s,
+    ...(session.kind === "class" ? sessionSpots(session, control) : {}),
+    sessionId: session.sessionId,
+    sessionStart: session.start,
+    sessionDate: date,
+    sessionTime: time,
+    // The start only: beside "Change Time" a full range broke mid-range on a phone. The fact row
+    // below carries the range.
+    sessionWhen: [date, timeLabel(session.start)].filter(Boolean).join(" · "),
+    sessionControl: control,
+    closedLabel,
+  });
+}
+
+/** The member's name for a waitlist registration, when their member record has one (the Agenda's
+ *  rule). The email alone registers; a failed profile read registers by email alone. */
+async function memberName(): Promise<{ firstName?: string; lastName?: string }> {
+  const res = await getMyMember({ fieldsets: ["FULL"] }).catch(() => undefined);
+  const contact = res?.member?.contact as { firstName?: string; lastName?: string } | undefined;
+  return { firstName: contact?.firstName || undefined, lastName: contact?.lastName || undefined };
+}
+
+const sameMember = (a: MemberAccess | undefined, b: MemberAccess | undefined): boolean =>
+  !!a?.email && a.email === b?.email && a.scope === b?.scope;
+
+/** Where a visitor's Join Waitlist signs in: the app's sign-in screen and how it opens, from the
+ *  appear (or tap) params — Branded Lite passes `himi_sign_in` as a sheet. */
+let signInScreenId = "";
+let signInPresentation: "" | "sheet" | "full_screen" = "";
+function rememberSignIn(arg: unknown): void {
+  const a = (arg ?? {}) as { signInScreenId?: unknown; signInPresentation?: unknown };
+  if (typeof a.signInScreenId === "string" && a.signInScreenId.trim()) signInScreenId = a.signInScreenId.trim();
+  if (a.signInPresentation === "sheet" || a.signInPresentation === "full_screen") signInPresentation = a.signInPresentation;
+}
+
 // ---- State -----------------------------------------------------------------------
 
 function derive(s: S): S {
   const isLoading = s.status === "loading";
   const hasService = !!s.name;
   const hasImage = s.images.length > 0;
+  const control = s.sessionControl;
+  // The session's own control replaces the service-wide one; a course session not yet booked
+  // keeps the course footer ("course"), as on the Agenda, where it opens this screen.
+  const sessionCta = control !== "" && control !== "course";
+  const ownPlace = control === "booked" || control === "waitlisted";
   return {
     ...s,
     isLoading,
@@ -593,20 +773,33 @@ function derive(s: S): S {
     noPay: !s.payText,
     noPaySub: !s.paySub,
     notRequestToBook: !s.requestToBook,
-    hideChooseTime: s.isCourse || s.requestToBook,
-    hideRequestTime: s.isCourse || !s.requestToBook,
-    noCourseCtaBook: !s.courseCtaBook,
-    noCourseCtaRequest: !s.courseCtaRequest,
-    noCourseCtaFull: !s.courseCtaFull,
-    noCourseCtaClosed: !s.courseCtaClosed,
+    hideChooseTime: s.isCourse || s.requestToBook || sessionCta,
+    hideRequestTime: s.isCourse || !s.requestToBook || sessionCta,
+    noCourseCtaBook: !s.courseCtaBook || sessionCta,
+    noCourseCtaRequest: !s.courseCtaRequest || sessionCta,
+    noCourseCtaFull: !s.courseCtaFull || sessionCta,
+    noCourseCtaClosed: !s.courseCtaClosed || sessionCta,
+    noSession: !s.sessionWhen,
+    // Book where the Agenda row says Book; "Request to Book" when the business confirms each one.
+    noSessionBook: control !== "book" || s.requestToBook,
+    noSessionRequest: control !== "book" || !s.requestToBook,
+    noSessionWaitlist: control !== "waitlist",
+    noSessionClosed: control !== "closed",
+    noSessionBooked: control !== "booked",
+    noSessionWaitlisted: control !== "waitlisted",
+    // Change Time opens the time screen, which cannot book a service closed to online booking.
+    noChangeTime: (control !== "book" && control !== "waitlist" && control !== "closed") || !s.bookableOnline,
+    noSessionMessage: !s.sessionMessage,
     notBookableOnline: !s.bookableOnline,
     noAbout: !s.about && !s.aboutJson,
     noPolicy: s.policyLines.length === 0,
     policyCollapsed: !s.policyExpanded,
-    noFacts: !s.courseDates && !s.durationText && !s.spotsText && s.locations.length === 0 && !s.online && !s.staffText && !s.payText,
+    noFacts: !s.sessionWhen && !s.courseDates && !s.durationText && !s.spotsText && s.locations.length === 0 && !s.online && !s.staffText && !s.payText,
     noKeyFacts: !s.priceText && !s.durationText && !s.category,
     hideContent: isLoading || s.errored || !hasService,
-    hideFooter: isLoading || s.errored || !hasService || !s.bookableOnline,
+    // The session's own status still shows when the service has since closed online booking: the
+    // member's place, or the Agenda row's disabled Book with its reason.
+    hideFooter: isLoading || s.errored || !hasService || (!s.bookableOnline && !ownPlace && control !== "closed"),
     emptyText: s.errored
       ? copyParam("service.errorText", "Service details could not be loaded.")
       : copyParam("service.emptyText", "This service is not available."),
@@ -701,7 +894,12 @@ const svc = defineService<S, {
   toggleSchedule: (s: S) => S;
   openDirections: (s: S, arg?: unknown) => Promise<S>;
   chooseTime: (s: S) => S;
+  book: (s: S) => S;
+  changeTime: (s: S) => S;
+  joinWaitlist: (s: S, arg?: unknown) => Promise<S>;
 }>("himiBookingService", {
+  // A join's outcome belongs to that visit: a cold start must not replay it from saved state.
+  notHydrated: ["sessionMessage", "sessionMessageOk", "sessionMessageFailed", "noSessionMessage"],
   state: derive({
     status: "loading",
     id,
@@ -796,24 +994,42 @@ const svc = defineService<S, {
     notLoading: false,
     hasService: false,
     noEmpty: true,
+    ...NO_SESSION,
+    noSession: true,
+    noSessionBook: true,
+    noSessionRequest: true,
+    noSessionWaitlist: true,
+    noSessionClosed: true,
+    noSessionBooked: true,
+    noSessionWaitlisted: true,
+    noChangeTime: true,
+    ...NO_SESSION_MESSAGE,
+    noSessionMessage: true,
   }),
   actions: {
     load: async (s, arg) => {
       stashCopy(arg);
+      rememberSignIn(arg);
       if (!s.id) return derive({ ...s, status: "ready", errored: true });
-      const start = { ...s, policyExpanded: false, scheduleExpanded: false };
+      // A new view: a join's outcome from before is not news when the screen shows again.
+      const start = { ...s, policyExpanded: false, scheduleExpanded: false, ...NO_SESSION_MESSAGE };
       try {
         const service = await fetchService(s.id);
-        return service ? withGroupAvailability(withService(start, service), service) : derive({ ...start, status: "ready" });
+        if (!service) return withSession(derive({ ...start, status: "ready" }), undefined);
+        loadedService = service;
+        // The session the Agenda row opened on, read beside the service-wide availability.
+        const [shown, sel] = await Promise.all([withGroupAvailability(withService(start, service), service), readSessionBounded(service)]);
+        return withSession(shown, sel);
       } catch {
         // Offline: paint from the last-synced services cache (written by the list
         // worker) before falling back to the error state. The cache holds the name,
         // the category and one image; every other row stays hidden.
         const cached = await readCached(s.id);
+        // No session state offline: the member's place in it cannot be read.
         if (cached) {
           const name = String(cached.name ?? "") || "Service";
           const image = String(cached.image ?? "");
-          return derive({
+          return withSession({
             ...start,
             status: "ready",
             errored: false,
@@ -822,9 +1038,9 @@ const svc = defineService<S, {
             category: String(cached.category ?? ""),
             images: image ? [{ url: image, alt: name }] : [],
             timeScreenId: `himi_time_${s.id}`,
-          });
+          }, undefined);
         }
-        return derive({ ...start, status: "ready", errored: true, name: "" });
+        return withSession({ ...start, status: "ready", errored: true, name: "" }, undefined);
       }
     },
     openLink: async (_state, arg) => { await openRichLink(arg); return undefined; },
@@ -844,6 +1060,53 @@ const svc = defineService<S, {
     // not a `himi.open` with a `$service:` id param: the iOS and Android sticky footers
     // dispatch their taps without resolving `$service:` params, so the id never arrived.
     chooseTime: (s) => (s.id && s.hasService ? navigate(s, { screenId: "himi_time", args: { id: s.id, ...(s.isCourse ? { course: "true" } : {}) } }) : s),
+    // Book the session the screen opened on: Choose Time opens with it picked — the Agenda row's
+    // own Book (`{ id, start, sessionId }`), so the member does not choose the time again.
+    book: (s) => (s.id && s.hasService && s.sessionControl === "book"
+      ? navigate(s, { screenId: "himi_time", args: { id: s.id, start: s.sessionStart, sessionId: s.sessionId } })
+      : s),
+    // "Change time": Choose Time for the service, with nothing picked.
+    changeTime: (s) => (s.id && s.hasService ? navigate(s, { screenId: "himi_time", args: { id: s.id } }) : s),
+    // Join the session's waitlist from here — the Agenda row's join: a visitor signs in first; the
+    // member's email and name are read, and the registration goes out only while the member is the
+    // one the session's place was read for. The screen then shows "On waitlist".
+    joinWaitlist: async (s, arg): Promise<S> => {
+      rememberSignIn(arg);
+      const sel = picked;
+      if (!sel || joining || s.sessionControl !== "waitlist" || !sel.session.sessionId) return s;
+      joining = true;
+      try {
+        const before = await memberAccess().catch(() => undefined);
+        if (!before?.email) {
+          joining = false;
+          // Without a sign-in screen, Choose Time opens on the session: it signs a guest in and
+          // joins the waitlist itself. A sign-in sheet only closes, and this screen loads again.
+          if (!signInScreenId) return navigate(s, { screenId: "himi_time", args: { id: s.id, start: s.sessionStart, sessionId: s.sessionId } });
+          return navigate(s, signInPresentation
+            ? { screenId: signInScreenId, presentation: signInPresentation, args: { mode: "signin", modal: "1" } }
+            : { screenId: signInScreenId, args: { mode: "signin" } });
+        }
+        const name = await memberName();
+        const current = await memberAccess().catch(() => undefined);
+        if (!sameMember(before, current) || !sameMember(sel.who, current)) {
+          // Another member since the load — or the load was a visitor's, whose place was never
+          // read: read the session again for whoever is signed in now; nothing is registered.
+          const reread = loadedService ? await readSession(loadedService) : undefined;
+          joining = false;
+          return withSession(svc.getState() as S, reread);
+        }
+        const res = await registerToWaitlist(sel.session.sessionId, { email: current!.email, ...name });
+        const place: MemberPlace = { bookingId: res?.booking?.id ?? "", revision: "", place: "waitlisted", registrationId: res?.registrationId, confirmed: false };
+        joining = false;
+        // Against the state as it is NOW; a load that landed meanwhile read this session again.
+        const now = svc.getState() as S;
+        return withSession({ ...now, sessionMessage: copyParam("agenda.joinedWaitlist", "You're on the waitlist."), sessionMessageOk: true, sessionMessageFailed: false },
+          { ...(picked?.session.key === sel.session.key ? picked : sel), place });
+      } catch {
+        joining = false;
+        return derive({ ...(svc.getState() as S), sessionMessage: copyParam("agenda.waitlistFailed", "Couldn't join the waitlist. Try again."), sessionMessageOk: false, sessionMessageFailed: true });
+      }
+    },
     openDirections: async (s, arg) => {
       const url = s.locations[tappedIndex(arg)]?.directionsUrl ?? "";
       if (!url) return s;