@tribe-nest/forge 3.54.0 → 3.58.0

package/src/ui/headless/checkout/_tests/useCheckoutSeats.spec.tsx

@@ -0,0 +1,313 @@
+// @vitest-environment jsdom
+import { describe, it, expect, beforeEach, afterEach } from "vitest";
+import { act, renderHook, waitFor } from "@testing-library/react";
+import axios, { type AxiosAdapter, type InternalAxiosRequestConfig } from "axios";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import type { ReactNode } from "react";
+import { ForgeClientProvider } from "../../../../provider/ForgeProvider";
+import { PublicAuthProvider } from "../../../../contexts/PublicAuthContext";
+import { CartProvider, useCart, type TicketCartItem } from "../../../../contexts/CartContext";
+import { useCheckout } from "../useCheckout";
+import { buildLayout, buildSeating, seatAt, GA_TIER, STALLS_TIER } from "../../event/_tests/seatingFixture";
+import type { PublicEventSeating } from "../../../../data/queries/useEvents";
+import { ProductDeliveryType } from "../../../../types/models";
+
+/**
+ * Reserved seats through the BUNDLE checkout (seating wave 2, docs §12), over
+ * the real hook with only the network faked.
+ *
+ * A seat in the cart is not held, so the rules under test are the ones that
+ * keep a buyer from paying for a seat they will not get: the seats are
+ * re-read before the bundle is created, the create body names them per line,
+ * a seat that has gone (by the read or by the server's 409) stops payment and
+ * is named, and the buyer's way out prunes exactly those seats and sends
+ * them back to that event's picker. Nothing substitutes a seat.
+ */
+
+const PROFILE_ID = "profile-1";
+const EVENT_ID = "ev-seated";
+const SLUG = "seated-show";
+
+type Sent = { method: string; url: string; body: Record<string, unknown> };
+let sent: Sent[] = [];
+let realAdapter: AxiosAdapter | undefined;
+let seating: PublicEventSeating;
+let createResponse: { ok: Record<string, unknown> } | { reject: { status: number; data: Record<string, unknown> } };
+
+function installAdapter() {
+  sent = [];
+  const adapter: AxiosAdapter = async (config: InternalAxiosRequestConfig) => {
+    const url = config.url ?? "";
+    const body = typeof config.data === "string" ? (JSON.parse(config.data) as Record<string, unknown>) : {};
+    sent.push({ method: (config.method ?? "get").toLowerCase(), url, body });
+    const ok = (data: unknown) => ({ data, status: 200, statusText: "OK", headers: {}, config }) as never;
+
+    if (url.includes(`/public/events/${EVENT_ID}/seating`)) return ok(seating);
+    if (url.endsWith("/public/checkouts")) {
+      if ("reject" in createResponse) {
+        throw Object.assign(new Error("Refused"), {
+          isAxiosError: true,
+          config,
+          response: {
+            status: createResponse.reject.status,
+            statusText: "Conflict",
+            headers: {},
+            config,
+            data: createResponse.reject.data,
+          },
+        });
+      }
+      return ok(createResponse.ok);
+    }
+    if (url.includes("/public/checkouts/start-payment")) {
+      return ok({
+        paymentSecret: "pi_secret",
+        paymentId: "pi_1",
+        paymentProvider: "stripe",
+        amount: 100,
+        currency: "USD",
+      });
+    }
+    if (url.includes("/public/products/shipping-countries")) return ok([]);
+    if (url.includes("/public/currencies")) {
+      return ok({ supportedCurrencies: ["USD"], userCurrency: "USD", exchangeRates: {} });
+    }
+    return ok({});
+  };
+  realAdapter = axios.defaults.adapter as AxiosAdapter | undefined;
+  axios.defaults.adapter = adapter;
+}
+
+const wrapper = ({ children }: { children: ReactNode }) => (
+  <QueryClientProvider
+    client={new QueryClient({ defaultOptions: { queries: { retry: false }, mutations: { retry: false } } })}
+  >
+    <ForgeClientProvider apiUrl="http://api.test" profileId={PROFILE_ID}>
+      <PublicAuthProvider>
+        <CartProvider>{children}</CartProvider>
+      </PublicAuthProvider>
+    </ForgeClientProvider>
+  </QueryClientProvider>
+);
+
+const seatIds = () => ({
+  a1: seatAt(seating, "Stalls", "A", "1"),
+  a2: seatAt(seating, "Stalls", "A", "2"),
+});
+
+const seatedLine = (overrides: Partial<TicketCartItem> = {}): TicketCartItem => {
+  const { a1, a2 } = seatIds();
+  return {
+    eventId: EVENT_ID,
+    eventSlug: SLUG,
+    eventTitle: "Seated show",
+    tickets: { [STALLS_TIER]: 2, [GA_TIER]: 1 },
+    ticketMeta: {
+      [STALLS_TIER]: {
+        title: "Stalls",
+        price: 40,
+        seatIds: [a1, a2],
+        seats: [
+          { id: a1, label: "Stalls · Row A · Seat 1" },
+          { id: a2, label: "Stalls · Row A · Seat 2" },
+        ],
+      },
+      [GA_TIER]: { title: "Standing", price: 20 },
+    },
+    bookingFee: null,
+    ...overrides,
+  };
+};
+
+const addon = {
+  productId: "prod-poster",
+  productVariantId: "var-poster",
+  title: "Tour poster",
+  price: 15,
+  isGift: false,
+  canIncreaseQuantity: true,
+  quantity: 1,
+  payWhatYouWant: false,
+  deliveryType: ProductDeliveryType.Digital,
+  attachedTo: { type: "event" as const, entityId: EVENT_ID },
+};
+
+const saveCart = (tickets: TicketCartItem[], items: unknown[] = [addon]) =>
+  localStorage.setItem("tribenest-cart", JSON.stringify({ items, tickets }));
+
+const mount = async () => {
+  const hook = renderHook(() => ({ checkout: useCheckout(), cart: useCart() }), { wrapper });
+  await waitFor(() => expect(hook.result.current.checkout.isCartReady).toBe(true));
+  await waitFor(() => expect(hook.result.current.checkout.ticketItems.length).toBeGreaterThan(0));
+  return hook;
+};
+
+const enterPayment = (result: { current: { checkout: ReturnType<typeof useCheckout> } }) =>
+  act(() => {
+    result.current.checkout.submitGuest({ firstName: "Fan", lastName: "Person", email: "fan@example.com" });
+  });
+
+const createCalls = () => sent.filter((r) => r.method === "post" && r.url.endsWith("/public/checkouts"));
+const startPaymentCalls = () => sent.filter((r) => r.url.includes("/start-payment"));
+
+beforeEach(() => {
+  localStorage.clear();
+  seating = buildSeating(buildLayout());
+  createResponse = {
+    ok: { checkoutId: "checkout-1", currency: "USD", subtotalCents: 11500, discountCents: 0, totalCents: 11500 },
+  };
+  installAdapter();
+});
+
+afterEach(() => {
+  if (realAdapter) axios.defaults.adapter = realAdapter;
+  localStorage.clear();
+});
+
+describe("useCheckout: reserved seats in the bundle", () => {
+  it("re-reads seating before creating the bundle and sends the seat ids per seated line", async () => {
+    saveCart([seatedLine()]);
+    const { a1, a2 } = seatIds();
+    const { result } = await mount();
+    enterPayment(result);
+
+    await waitFor(() => expect(result.current.checkout.checkoutId).toBe("checkout-1"));
+    // The read came first, then the create.
+    const seatingRead = sent.findIndex((r) => r.url.includes(`/public/events/${EVENT_ID}/seating`));
+    const create = sent.findIndex((r) => r.method === "post" && r.url.endsWith("/public/checkouts"));
+    expect(seatingRead).toBeGreaterThanOrEqual(0);
+    expect(create).toBeGreaterThan(seatingRead);
+
+    const lines = createCalls()[0]!.body.lines as Record<string, unknown>[];
+    expect(lines).toEqual([
+      expect.objectContaining({ type: "event_ticket", ticketId: STALLS_TIER, quantity: 2, seatIds: [a1, a2] }),
+      expect.objectContaining({ type: "event_ticket", ticketId: GA_TIER, quantity: 1 }),
+      expect.objectContaining({ type: "product", productId: "prod-poster" }),
+    ]);
+    expect(lines[1]).not.toHaveProperty("seatIds");
+    expect(result.current.checkout.seatsConflict).toBeNull();
+    await waitFor(() => expect(startPaymentCalls().length).toBe(1));
+  });
+
+  it("a seat that has gone by the pre-payment read stops the bundle before it is created, and names the seat", async () => {
+    saveCart([seatedLine()]);
+    const { a2 } = seatIds();
+    // A2 went to another buyer while this one was filling in their details.
+    seating = buildSeating(buildLayout(), ["Stalls/A/2"]);
+    const { result } = await mount();
+    enterPayment(result);
+
+    await waitFor(() => expect(result.current.checkout.seatsConflict).not.toBeNull());
+    expect(result.current.checkout.seatsConflict).toEqual({
+      eventId: EVENT_ID,
+      eventSlug: SLUG,
+      eventTitle: "Seated show",
+      seatIds: [a2],
+      labels: ["Stalls · Row A · Seat 2"],
+    });
+    expect(createCalls()).toHaveLength(0);
+    expect(startPaymentCalls()).toHaveLength(0);
+    expect(result.current.checkout.checkoutId).toBeNull();
+    expect(result.current.checkout.startError).toBe("");
+  });
+
+  it("a 409 SEATS_TAKEN from the create is authoritative: no payment starts, the seats are named", async () => {
+    saveCart([seatedLine()]);
+    const { a1 } = seatIds();
+    createResponse = {
+      reject: {
+        status: 409,
+        data: { code: "SEATS_TAKEN", message: "Some of those seats were just taken.", details: { eventSeatIds: [a1] } },
+      },
+    };
+    const { result } = await mount();
+    enterPayment(result);
+
+    await waitFor(() => expect(result.current.checkout.seatsConflict).not.toBeNull());
+    expect(result.current.checkout.seatsConflict).toMatchObject({
+      eventId: EVENT_ID,
+      seatIds: [a1],
+      labels: ["Stalls · Row A · Seat 1"],
+    });
+    expect(createCalls()).toHaveLength(1);
+    expect(startPaymentCalls()).toHaveLength(0);
+    expect(result.current.checkout.checkoutId).toBeNull();
+    // Not a generic failure and not a coupon refusal.
+    expect(result.current.checkout.startError).toBe("");
+    expect(result.current.checkout.couponError).toBe("");
+  });
+
+  it("any other refusal is still the ordinary start error", async () => {
+    saveCart([seatedLine()]);
+    createResponse = { reject: { status: 409, data: { code: "INVENTORY_HOLD_EXPIRED", message: "Sold out." } } };
+    const { result } = await mount();
+    enterPayment(result);
+
+    await waitFor(() => expect(result.current.checkout.startError).toBe("Sold out."));
+    expect(result.current.checkout.seatsConflict).toBeNull();
+  });
+
+  it("choose other seats prunes exactly the taken seats from the line and returns the event page path", async () => {
+    saveCart([seatedLine()]);
+    const { a1, a2 } = seatIds();
+    seating = buildSeating(buildLayout(), ["Stalls/A/2"]);
+    const { result } = await mount();
+    enterPayment(result);
+    await waitFor(() => expect(result.current.checkout.seatsConflict).not.toBeNull());
+
+    let path: string | null = null;
+    act(() => {
+      path = result.current.checkout.chooseOtherSeats();
+    });
+    expect(path).toBe(`/i/events/${SLUG}`);
+    expect(result.current.checkout.seatsConflict).toBeNull();
+
+    const line = result.current.cart.ticketItems.find((t) => t.eventId === EVENT_ID);
+    expect(line?.tickets).toEqual({ [STALLS_TIER]: 1, [GA_TIER]: 1 });
+    expect(line?.ticketMeta[STALLS_TIER]).toEqual({
+      title: "Stalls",
+      price: 40,
+      seatIds: [a1],
+      seats: [{ id: a1, label: "Stalls · Row A · Seat 1" }],
+    });
+    // The GA tier and the add-on are untouched.
+    expect(line?.ticketMeta[GA_TIER]).toEqual({ title: "Standing", price: 20 });
+    expect(result.current.cart.cartItems.map((i) => i.productId)).toEqual(["prod-poster"]);
+    // Persisted, so the event page reads the pruned line.
+    const saved = JSON.parse(localStorage.getItem("tribenest-cart") ?? "{}") as { tickets: TicketCartItem[] };
+    expect(saved.tickets[0]?.ticketMeta[STALLS_TIER]?.seatIds).toEqual([a1]);
+    expect(a2).not.toEqual(a1);
+  });
+
+  it("when every seat of the only line is gone the event leaves the cart, add-ons with it", async () => {
+    const { a1, a2 } = seatIds();
+    saveCart([
+      seatedLine({
+        tickets: { [STALLS_TIER]: 2 },
+        ticketMeta: { [STALLS_TIER]: seatedLine().ticketMeta[STALLS_TIER]! },
+      }),
+    ]);
+    seating = buildSeating(buildLayout(), ["Stalls/A/1", "Stalls/A/2"]);
+    const { result } = await mount();
+    enterPayment(result);
+    await waitFor(() => expect(result.current.checkout.seatsConflict?.seatIds).toEqual([a1, a2]));
+
+    act(() => {
+      result.current.checkout.chooseOtherSeats();
+    });
+    expect(result.current.cart.ticketItems).toEqual([]);
+    expect(result.current.cart.cartItems).toEqual([]);
+  });
+
+  it("a cart with no seated line makes no seating read and creates the bundle as before", async () => {
+    saveCart([seatedLine({ tickets: { [GA_TIER]: 2 }, ticketMeta: { [GA_TIER]: { title: "Standing", price: 20 } } })]);
+    const { result } = await mount();
+    enterPayment(result);
+
+    await waitFor(() => expect(result.current.checkout.checkoutId).toBe("checkout-1"));
+    expect(sent.some((r) => r.url.includes("/seating"))).toBe(false);
+    const lines = createCalls()[0]!.body.lines as Record<string, unknown>[];
+    expect(lines[0]).toEqual(expect.objectContaining({ type: "event_ticket", ticketId: GA_TIER, quantity: 2 }));
+    expect(lines[0]).not.toHaveProperty("seatIds");
+  });
+});

package/src/ui/headless/checkout/seatConflict.ts

@@ -0,0 +1,117 @@
+import type { TicketCartItem } from "../../../contexts/CartContext";
+import type { PublicEventSeating } from "../../../data/queries/useEvents";
+import { indexEventSeats } from "../event/useEventSeating";
+
+/**
+ * Reserved seats in the bundle cart, and what happens when they are gone.
+ *
+ * A seat in the cart is NOT held: the bundle takes its holds when
+ * `POST /public/checkouts` runs, which may be minutes after the seat was
+ * picked on the map. So the checkout re-reads seating right before that call
+ * and again treats the server's 409 `SEATS_TAKEN` as the last word. Either
+ * way the answer is the same shape, a `SeatsConflict`, and the buyer's next
+ * move is the same: back to THAT event's picker with the taken seats named.
+ * Nothing here ever substitutes a seat (owner decision, docs §12).
+ *
+ * Pure functions, so they are asserted without a provider tree.
+ */
+
+/** Seats of one event that can no longer be bought as chosen. */
+export interface SeatsConflict {
+  eventId: string;
+  eventSlug: string;
+  eventTitle: string;
+  /** Event seat ids to take out of the cart line. */
+  seatIds: string[];
+  /** Their labels, in the same order, for the alert. */
+  labels: string[];
+}
+
+/** The tiers of a selection that carry seats: the lines a seating re-check covers. */
+export const seatedLinesOf = (item: TicketCartItem): { ticketId: string; seatIds: string[] }[] =>
+  Object.entries(item.ticketMeta)
+    .filter(([ticketId, meta]) => (meta.seatIds?.length ?? 0) > 0 && (item.tickets[ticketId] ?? 0) > 0)
+    .map(([ticketId, meta]) => ({ ticketId, seatIds: meta.seatIds ?? [] }));
+
+/** Whether any event in the cart holds a seated line worth re-checking. */
+export const cartHasSeatedLines = (ticketItems: readonly TicketCartItem[]): boolean =>
+  ticketItems.some((item) => seatedLinesOf(item).length > 0);
+
+/** The label a cart line carries for a seat, else the seating read's, else the id. */
+const labelFor = (item: TicketCartItem, seatId: string, seating?: PublicEventSeating | null): string => {
+  for (const meta of Object.values(item.ticketMeta)) {
+    const seat = meta.seats?.find((s) => s.id === seatId);
+    if (seat) return seat.label;
+  }
+  if (seating) {
+    const found = indexEventSeats(seating).byId.get(seatId);
+    if (found) return found.label;
+  }
+  return seatId;
+};
+
+const conflictOf = (item: TicketCartItem, seatIds: string[], seating?: PublicEventSeating | null): SeatsConflict => ({
+  eventId: item.eventId,
+  eventSlug: item.eventSlug,
+  eventTitle: item.eventTitle,
+  seatIds,
+  labels: seatIds.map((id) => labelFor(item, id, seating)),
+});
+
+/**
+ * Compare a cart line's seats with a fresh seating read.
+ *
+ * A seat that does not read `available` is a conflict, and so is a seat the
+ * read no longer lists (a map rebound since the seat was picked). `null` when
+ * every seat is still free, and when the read is `null`: an event that has
+ * lost its map sells plain quantities, and the server decides what that means
+ * for a line still naming seats.
+ */
+export function findSeatConflict(
+  item: TicketCartItem,
+  seating: PublicEventSeating | null | undefined,
+): SeatsConflict | null {
+  if (!seating) return null;
+  const status = new Map(seating.seats.map((seat) => [seat.id, seat.status]));
+  const gone: string[] = [];
+  for (const line of seatedLinesOf(item)) {
+    for (const id of line.seatIds) {
+      if (status.get(id) !== "available") gone.push(id);
+    }
+  }
+  return gone.length > 0 ? conflictOf(item, gone, seating) : null;
+}
+
+/**
+ * A 409 from `POST /public/checkouts` naming seats another buyer took
+ * (`code: "SEATS_TAKEN"`, `details.eventSeatIds`). The ids, or `null` when the
+ * error is anything else, including a 409 of another kind.
+ */
+export function seatsTakenIdsOf(e: unknown): string[] | null {
+  const res = (e as { response?: { status?: number; data?: { code?: unknown; details?: { eventSeatIds?: unknown } } } })
+    ?.response;
+  if (res?.status !== 409) return null;
+  const ids = res.data?.details?.eventSeatIds;
+  if (Array.isArray(ids) && ids.every((id) => typeof id === "string")) return ids as string[];
+  return res.data?.code === "SEATS_TAKEN" ? [] : null;
+}
+
+/**
+ * Attribute the seats a 409 named to the event whose cart line holds them.
+ *
+ * The response names seats, not events, and a cart can hold several seated
+ * events. The first event holding any of the ids is the conflict surfaced
+ * (one alert at a time; the next event is re-checked when the buyer returns).
+ * Ids no line holds are ignored: there is nothing in the cart to prune.
+ */
+export function seatsTakenConflict(
+  ticketItems: readonly TicketCartItem[],
+  eventSeatIds: readonly string[],
+): SeatsConflict | null {
+  const named = new Set(eventSeatIds);
+  for (const item of ticketItems) {
+    const held = seatedLinesOf(item).flatMap((line) => line.seatIds.filter((id) => named.has(id)));
+    if (held.length > 0) return conflictOf(item, held);
+  }
+  return null;
+}