@ticketboothapp/booking 1.2.128 → 1.2.129

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ticketboothapp/booking",
-  "version": "1.2.128",
+  "version": "1.2.129",
   "private": false,
   "sideEffects": [
     "**/*.css",

package/src/components/booking/NewBookingFlow.tsx

@@ -5,6 +5,7 @@ import { parseISO } from 'date-fns';
 import { formatInTimeZone, fromZonedTime } from 'date-fns-tz';
 import {
   type Availability,
+  type PricingV2QuoteSnapshot,
 } from '../../lib/booking-api';
 import {
   EARLIEST_AVAILABILITY_DATE,
@@ -42,6 +43,7 @@ import { StandardBookingCheckoutDialogs } from './StandardBookingCheckoutDialogs
 import { StandardBookingItineraryPanel } from './StandardBookingItineraryPanel';
 import { StandardBookingMediaIntro } from './StandardBookingMediaIntro';
 import { StandardBookingSelectionControlsPanel } from './StandardBookingSelectionControlsPanel';
+import { buildCheckoutModalSummaryFromPricingV2Quote } from './pricing-v2-checkout-summary';
 
 export function NewBookingFlow({
   product,
@@ -99,6 +101,8 @@ export function NewBookingFlow({
   const [phoneNumber, setPhoneNumber] = useState('');
   const [promoCodeInput, setPromoCodeInput] = useState('');
   const [appliedPromoCode, setAppliedPromoCode] = useState<string | null>(null);
+  const [checkoutPricingV2QuoteForDisplay, setCheckoutPricingV2QuoteForDisplay] =
+    useState<PricingV2QuoteSnapshot | null>(null);
   const [pickupLocationId, setPickupLocationId] = useState<string | null>(null);
   const [pickupLocationSkipped, setPickupLocationSkipped] = useState(false);
   // Cancellation: change flow seeds from the booking so totals match the quote (server uses booking.cancellationPolicyId).
@@ -488,6 +492,75 @@ export function NewBookingFlow({
     augmentPriceSummary,
   });
 
+  const bookingItemsDisplayKey = useMemo(
+    () =>
+      Object.entries(quantities)
+        .filter(([, count]) => count > 0)
+        .sort(([a], [b]) => a.localeCompare(b))
+        .map(([category, count]) => `${category}:${count}`)
+        .join('|'),
+    [quantities],
+  );
+  const addOnSelectionsDisplayKey = useMemo(
+    () =>
+      normalizeAddOnSelections(addOnSelections)
+        .map((selection) =>
+          [
+            selection.addOnId,
+            selection.variantId ?? '',
+            selection.quantity ?? 1,
+          ].join(':'),
+        )
+        .join('|'),
+    [addOnSelections],
+  );
+  const dependentAddOnSelectionDisplayKey = useMemo(
+    () => JSON.stringify(dependentAddOnSelection ?? null),
+    [dependentAddOnSelection],
+  );
+  const checkoutPricingV2DisplayKey = useMemo(
+    () =>
+      [
+        product.productId,
+        selectedAvailability ? getAvailabilityOptionId(selectedAvailability) : '',
+        selectedAvailability?.availabilityId ?? '',
+        selectedAvailability?.dateTime ?? '',
+        selectedReturnOption?.returnAvailabilityId ?? '',
+        bookingItemsDisplayKey,
+        currency,
+        appliedPromoCode ?? '',
+        cancellationPolicyId ?? '',
+        addOnSelectionsDisplayKey,
+        dependentAddOnSelectionDisplayKey,
+        pricingProfileIdForAvailabilities ?? '',
+        isAdmin ? 'admin' : 'public',
+      ].join('::'),
+    [
+      addOnSelectionsDisplayKey,
+      appliedPromoCode,
+      bookingItemsDisplayKey,
+      cancellationPolicyId,
+      currency,
+      dependentAddOnSelectionDisplayKey,
+      isAdmin,
+      pricingProfileIdForAvailabilities,
+      product.productId,
+      selectedAvailability,
+      selectedReturnOption?.returnAvailabilityId,
+    ],
+  );
+  useEffect(() => {
+    setCheckoutPricingV2QuoteForDisplay(null);
+  }, [checkoutPricingV2DisplayKey]);
+  const checkoutPricingV2DisplaySummary = useMemo(
+    () =>
+      buildCheckoutModalSummaryFromPricingV2Quote(
+        checkoutPricingV2QuoteForDisplay,
+        t('booking.rounding') || 'Rounding',
+      ),
+    [checkoutPricingV2QuoteForDisplay, t],
+  );
+
   useBookingQuantityCapTrim({
     isAdmin,
     selectedAvailability,
@@ -502,18 +575,29 @@ export function NewBookingFlow({
     : undefined;
 
   const checkoutFormError = error || '';
+  const hasServerBackedCheckoutDisplay = checkoutPricingV2DisplaySummary != null;
+  const checkoutDisplayPriceSummaryLines =
+    checkoutPricingV2DisplaySummary?.lines ?? displayCheckoutPriceSummaryLines;
+  const checkoutDisplaySubtotal =
+    checkoutPricingV2DisplaySummary?.subtotal ?? displaySubtotal;
+  const checkoutDisplayTotalPrice =
+    checkoutPricingV2DisplaySummary?.fullTotalAmount ?? displayTotalPrice;
   const checkoutFormSubtotal =
-    subtotal !== totalFromSummary ||
-    effectivePromoDiscountAmount > 0 ||
-    addOnTotal > 0 ||
-    (priceSummaryAugmentation?.subtotalAdjustment ?? 0) !== 0
-      ? displaySubtotal
-      : undefined;
+    checkoutPricingV2DisplaySummary != null
+      ? checkoutPricingV2DisplaySummary.subtotal
+      : subtotal !== totalFromSummary ||
+          effectivePromoDiscountAmount > 0 ||
+          addOnTotal > 0 ||
+          (priceSummaryAugmentation?.subtotalAdjustment ?? 0) !== 0
+        ? displaySubtotal
+        : undefined;
   const checkoutFormTaxAmount =
-    !isTaxIncludedInPrice &&
-    (effectivePromoDiscountAmount > 0 ? effectiveTax : tax) > 0
-      ? (effectivePromoDiscountAmount > 0 ? effectiveTax : tax)
-      : 0;
+    checkoutPricingV2DisplaySummary != null
+      ? checkoutPricingV2DisplaySummary.taxAmount ?? 0
+      : !isTaxIncludedInPrice &&
+          (effectivePromoDiscountAmount > 0 ? effectiveTax : tax) > 0
+        ? (effectivePromoDiscountAmount > 0 ? effectiveTax : tax)
+        : 0;
 
   const handleCheckoutPickupLocationSelect = useCallback((locationId: string | null) => {
     setPickupLocationId(locationId);
@@ -644,8 +728,8 @@ export function NewBookingFlow({
     isAdmin,
     pricingConfig,
     refreshSelectedDateDetailsForCheckout,
-    displayTotalPrice,
-    displaySubtotal,
+    displayTotalPrice: checkoutDisplayTotalPrice,
+    displaySubtotal: checkoutDisplaySubtotal,
     totalPrice,
     currency,
     appliedPromoCode,
@@ -678,6 +762,7 @@ export function NewBookingFlow({
     setError,
     onSuccess,
     onShowManage,
+    onPricingV2QuoteForDisplay: setCheckoutPricingV2QuoteForDisplay,
   });
 
   if (activeOptions.length === 0) {
@@ -863,8 +948,8 @@ export function NewBookingFlow({
           {/* Total and Checkout — shared PriceSummary component */}
           {!selectedBookingOptionsHydrating && selectedAvailability && (
             <StandardBookingCheckoutSection
-              priceSummaryLines={displayCheckoutPriceSummaryLines}
-              totalPrice={displayTotalPrice}
+              priceSummaryLines={checkoutDisplayPriceSummaryLines}
+              totalPrice={checkoutDisplayTotalPrice}
               subtotal={checkoutFormSubtotal}
               taxAmount={checkoutFormTaxAmount}
               taxRate={pricingConfig?.taxRate}
@@ -876,6 +961,7 @@ export function NewBookingFlow({
               promoCodeError={promoCodeError}
               promoCodeValidating={promoCodeValidating}
               promoDiscountAmount={promoDiscountAmount}
+              hidePromoDiscountAmount={hasServerBackedCheckoutDisplay}
               onPromoInputChange={handlePromoInputChange}
               onPromoApply={handleApplyPromo}
               onPromoRemove={handleRemovePromo}

package/src/components/booking/StandardBookingCheckoutSection.tsx

@@ -21,6 +21,7 @@ export interface StandardBookingCheckoutSectionProps {
   promoCodeError: string;
   promoCodeValidating: boolean;
   promoDiscountAmount: number;
+  hidePromoDiscountAmount?: boolean;
   onPromoInputChange: (value: string) => void;
   onPromoApply: () => void;
   onPromoRemove: () => void;
@@ -76,6 +77,7 @@ export function StandardBookingCheckoutSection({
   promoCodeError,
   promoCodeValidating,
   promoDiscountAmount,
+  hidePromoDiscountAmount = false,
   onPromoInputChange,
   onPromoApply,
   onPromoRemove,
@@ -134,6 +136,7 @@ export function StandardBookingCheckoutSection({
           promoCodeError={promoCodeError}
           promoCodeValidating={promoCodeValidating}
           promoDiscountAmount={promoDiscountAmount}
+          hideDiscountAmount={hidePromoDiscountAmount}
           currency={currency}
           locale={locale}
           t={t}

package/src/components/booking/pricing-v2-checkout-summary.ts

@@ -43,6 +43,35 @@ function fallbackLabel(type: string): string {
   }
 }
 
+function isPaymentCreditType(type?: string | null): boolean {
+  const normalized = normalizedLineType(type);
+  return normalized === "GIFT_CARD" || normalized === "PAYMENT_CREDIT";
+}
+
+function isPaymentCreditSummaryLine(line: PriceSummaryLine): boolean {
+  return line.kind === "line" && isPaymentCreditType(line.type);
+}
+
+function movePaymentCreditLinesAfterTax(lines: PriceSummaryLine[]): PriceSummaryLine[] {
+  const paymentCreditLines = lines.filter(isPaymentCreditSummaryLine);
+  if (paymentCreditLines.length === 0) return lines;
+
+  const nonPaymentCreditLines = lines.filter((line) => !isPaymentCreditSummaryLine(line));
+  const taxIndex = nonPaymentCreditLines.findIndex(
+    (line) => line.kind === "line" && normalizedLineType(line.type) === "TAX",
+  );
+
+  if (taxIndex < 0) {
+    return [...nonPaymentCreditLines, ...paymentCreditLines];
+  }
+
+  return [
+    ...nonPaymentCreditLines.slice(0, taxIndex + 1),
+    ...paymentCreditLines,
+    ...nonPaymentCreditLines.slice(taxIndex + 1),
+  ];
+}
+
 function priceSummaryLineFromQuoteLine(
   line: PricingV2QuoteLineSnapshot,
   index: number,
@@ -83,10 +112,11 @@ export function buildCheckoutModalSummaryFromPricingV2Quote(
   const total = pricingV2QuoteTotal(quote);
   if (total == null) return undefined;
 
-  const lines =
+  const mappedLines =
     quote?.lines
       ?.map((line, index) => priceSummaryLineFromQuoteLine(line, index))
       .filter((line): line is PriceSummaryLine => line != null) ?? [];
+  const lines = movePaymentCreditLinesAfterTax(mappedLines);
 
   if (lines.length === 0) return undefined;
 
@@ -122,8 +152,17 @@ export function buildCheckoutModalSummaryFromPricingV2Quote(
       type === "PAYMENT_CREDIT"
     );
   });
+  const paymentCreditTotal = Math.max(
+    0,
+    finiteNumber(quote?.paymentCreditTotal) ?? 0,
+  );
   const subtotal = finiteNumber(
-    quote?.netSubtotalBeforeTax ?? quote?.subtotal ?? quote?.grossSubtotal,
+    paymentCreditTotal > 0
+      ? quote?.taxableSubtotal ??
+          quote?.grossSubtotal ??
+          quote?.netSubtotalBeforeTax ??
+          quote?.subtotal
+      : quote?.netSubtotalBeforeTax ?? quote?.subtotal ?? quote?.grossSubtotal,
   );
   const taxAmount = hasTaxLine
     ? 0

package/src/components/booking/standard-booking-checkout-controller.ts

@@ -12,6 +12,7 @@ import {
   type Availability,
   type ItineraryDisplayStep,
   type PricingConfig,
+  type PricingV2QuoteSnapshot,
   type Product,
   type ReturnOption,
 } from '../../lib/booking-api';
@@ -107,6 +108,7 @@ export interface UseStandardBookingCheckoutControllerParams {
   setError: (error: string) => void;
   onSuccess?: NewBookingFlowProps['onSuccess'];
   onShowManage?: (params: { ref: string; lastName: string }) => void;
+  onPricingV2QuoteForDisplay?: (quote: PricingV2QuoteSnapshot | null) => void;
 }
 
 export function useStandardBookingCheckoutController({
@@ -170,6 +172,7 @@ export function useStandardBookingCheckoutController({
   setError,
   onSuccess,
   onShowManage,
+  onPricingV2QuoteForDisplay,
 }: UseStandardBookingCheckoutControllerParams) {
   const [showCheckoutModal, setShowCheckoutModal] = useState(false);
   const [checkoutClientSecret, setCheckoutClientSecret] = useState('');
@@ -269,6 +272,7 @@ export function useStandardBookingCheckoutController({
     setLoading(true);
     setError('');
     paymentSubmitInFlightRef.current = false;
+    onPricingV2QuoteForDisplay?.(null);
 
     try {
       const reserveResult = await reserveStandardBookingForCheckout({
@@ -309,6 +313,7 @@ export function useStandardBookingCheckoutController({
         timePart,
         itineraryDisplay,
       } = reserveResult;
+      onPricingV2QuoteForDisplay?.(pricingV2Quote?.quote ?? null);
       pendingReservationRef.current = { reservationReference: reservation.reservationReference };
 
       const taxForBreakdown = effectivePromoDiscountAmount > 0 ? effectiveTax : tax;

package/test/change-booking-helpers.test.ts

@@ -4,6 +4,7 @@ import {
   buildChangeBookingPaymentSuccessUrl,
 } from '../src/components/booking/change-booking-payment-modal-builders';
 import { evaluateChangeBookingQuoteForCheckout } from '../src/components/booking/change-booking-quote-guards';
+import { buildCheckoutModalSummaryFromPricingV2Quote } from '../src/components/booking/pricing-v2-checkout-summary';
 import type { ChangeQuoteUiSlice } from '../src/lib/booking/change-flow-pricing';
 import type { ChangeBookingQuoteResponse } from '../src/lib/booking-api';
 
@@ -167,6 +168,56 @@ test('delegates success URL construction to host when provider dashboard asks fo
   assert.equal(url, 'provider://ABC-123/Smith/2026-07-08');
 });
 
+test('maps Pricing V2 gift cards as payment credits after tax', () => {
+  const summary = buildCheckoutModalSummaryFromPricingV2Quote(
+    {
+      currency: 'CAD',
+      grossSubtotal: 449.4,
+      netSubtotalBeforeTax: 350.46,
+      taxableSubtotal: 449.4,
+      taxAmount: 38.2,
+      paymentCreditTotal: 98.94,
+      payableTotal: 388.66,
+      amountToCharge: 388.66,
+      lines: [
+        {
+          lineId: 'ticket_1',
+          type: 'TICKET',
+          label: 'ADULT',
+          amount: 417.42,
+          quantity: 2,
+        },
+        {
+          lineId: 'fee_1',
+          type: 'FEE',
+          label: 'Moraine Lake Road Access Fee',
+          amount: 31.98,
+        },
+        {
+          lineId: 'gift_1',
+          type: 'GIFT_CARD',
+          label: 'Gift card comp',
+          amount: -98.94,
+        },
+        {
+          lineId: 'tax_1',
+          type: 'TAX',
+          label: 'Taxes and fees',
+          amount: 38.2,
+        },
+      ],
+    },
+    'Rounding',
+  );
+
+  assert.equal(summary?.subtotal, 449.4);
+  assert.equal(summary?.fullTotalAmount, 388.66);
+  assert.deepEqual(
+    summary?.lines.map((line) => (line.kind === 'line' ? line.type : 'TICKET')),
+    ['TICKET', 'FEE', 'TAX', 'GIFT_CARD'],
+  );
+});
+
 test('builds paid checkout modal data with trimmed customer and change totals', () => {
   const modalData = buildChangeBookingPaidCheckoutModalData({
     bookingReference: 'bookRef_ABC-123',