@wix/himalaya-cli 0.1324.0 → 0.1326.0

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

@@ -1,4 +1,7 @@
-import { defineService } from "@himalaya/state";
+import { getStoreProduct } from "../_shared/himi-store.js";
+import { iapPriceCopy } from "../_shared/iap-worker.js";
+import { withIapPresentation } from "../_shared/iap-presentation.js";
+import { type IapCommerce, classifyCart } from "@himalaya/iap-checkout";
 import { createCheckoutFromCurrentCart, createOrder, getCurrentCart, removeLineItemsFromCurrentCart, updateLineItemsQuantity, type WixCartLineItemDetail } from "@himalaya/wix-ecom";
 import { createRedirectSession } from "@himalaya/wix-redirects";
 import { session as wixPlatformSession } from "@himalaya/wix-platform";
@@ -6,6 +9,7 @@ import { payCashierOrder } from "@himalaya/checkout";
 
 /** Wix Stores appDefId — the vertical that owns a cart/ecom order, and therefore the
  *  `appId` its cashier order is paid under. (Same constant Wix's own tooling uses.) */
+const WIX_STORES_CATALOG_ID = "215238eb-22a5-4c36-9e7b-e7c08025e04e";
 const WIX_STORES_APP_ID = "1380b703-ce81-ff05-f115-39571d94dfcd";
 
 /** The site's metaSiteId for the cashier payment config. Best-effort — the native
@@ -40,6 +44,7 @@ async function cacheDrop(id: string): Promise<void> { try { await dbRemove(ENTIT
 async function queueWrite(actionId: string, params: Record<string, string>): Promise<void> { try { await enqueue(actionId, params); } catch { /* capability not granted */ } }
 
 interface Row {
+  catalogReference?: { appId: string; catalogItemId: string; options?: Record<string, unknown> };
   id: string;
   name: string;
   title: string;
@@ -50,6 +55,7 @@ interface Row {
   /** The "−" control at qty 1 removes the line, so it never dead-ends. */
   atMinQuantity: boolean;
   total: string;
+  commerceTotal: string;
   image: string;
   initial: string;
   hasImage: boolean;
@@ -59,6 +65,7 @@ interface State {
   status: "loading" | "ready" | "error";
   items: Row[];
   subtotal: string;
+  commerceSubtotal?: string;
   emptyText: string;
   checkoutHint: string;
   isLoading: boolean;
@@ -118,6 +125,7 @@ function row(item: WixCartLineItemDetail, index: number): Row {
   const name = item.productName?.original || copyParam("cart.itemFallbackName", "Cart item");
   const image = mediaUrl(item);
   return {
+    catalogReference: (item as WixCartLineItemDetail & { catalogReference?: Row["catalogReference"] }).catalogReference,
     id: item.id || `line-${index}`,
     name,
     title: name,
@@ -126,6 +134,7 @@ function row(item: WixCartLineItemDetail, index: number): Row {
     quantityLabel: `${quantity}`,
     atMinQuantity: quantity <= 1,
     total: item.price?.formattedAmount ?? "",
+    commerceTotal: item.price?.formattedAmount ?? "",
     image,
     initial: (name.trim()[0] || "C").toUpperCase(),
     hasImage: Boolean(image),
@@ -163,6 +172,7 @@ async function refresh(state: State, checkoutHint = ""): Promise<State> {
     status: "ready",
     items,
     subtotal: cart.subtotal?.formattedAmount ?? "",
+    commerceSubtotal: cart.subtotal?.formattedAmount ?? "",
     emptyText: items.length ? "" : copyParam("cart.emptyText", "Your cart is empty."),
     checkoutHint,
   });
@@ -190,6 +200,16 @@ function cartConsumedByOrder(): Pick<State, "items" | "subtotal" | "emptyText" |
   };
 }
 
+let cartPricing: IapCommerce;
+const defineService = withIapPresentation<State>({
+  onCreate: commerce => { cartPricing = commerce; },
+  prefix: "cart", transientKeys: ["items", "subtotal"], contentActions: ["load", "remove", "increment", "decrement"],
+  items: state => state.items.flatMap(row => row.catalogReference?.catalogItemId ? [{ reference: { kind: "storesProduct", id: row.catalogReference.catalogItemId }, commerceDisplayPrice: row.commerceTotal ?? row.total }] : []),
+  present: (state, price, allowed) => ({ ...state,
+    items: state.items.map(row => ({ ...row, total: row.catalogReference?.catalogItemId ? price(row.catalogReference.catalogItemId, row.commerceTotal ?? row.total) : row.total })),
+    subtotal: state.items.length > 0 && state.items.every(row => row.catalogReference?.catalogItemId && allowed(row.catalogReference.catalogItemId)) ? state.commerceSubtotal ?? state.subtotal : "" }),
+});
+
 const svc = defineService<State, {
   load: (state: State, arg?: unknown) => Promise<State>;
   remove: (state: State, arg?: unknown) => Promise<State>;
@@ -272,6 +292,25 @@ const svc = defineService<State, {
     // `createOrder` returning no paymentGatewayOrderId means there is nothing to
     // charge (fully covered / zero total) — the order already stands.
     checkout: async (state) => {
+      let validatedLines: WixCartLineItemDetail[] = [];
+      const signature = (lines: WixCartLineItemDetail[]) => JSON.stringify(lines.map(line => [line.id, line.quantity, (line as WixCartLineItemDetail & { catalogReference?: Row["catalogReference"] }).catalogReference]));
+      try {
+        const cart = await getCurrentCart();
+        const lines = cart.lineItems ?? [];
+        if (!lines.length) return derive({ ...state, checkoutHint: copyParam("cart.checkoutEmptyMessage", "Add an item before checkout.") });
+        const commerce = cartPricing;
+        const items = lines.map(line => (line as WixCartLineItemDetail & { catalogReference?: Row["catalogReference"] }).catalogReference);
+        if (items.some(item => !item?.catalogItemId || !item.appId)) return derive({ ...state, checkoutHint: iapPriceCopy("cart").purchaseUnavailable });
+        await commerce.loadPrices(items.map((item, index) => ({ reference: { kind: "storesProduct", id: item!.catalogItemId }, commerceDisplayPrice: lines[index].price?.formattedAmount })));
+        const classification = classifyCart(items.map((item, index) => ({ route: commerce.pricing.view({ kind: "storesProduct", id: item!.catalogItemId }).route, quantity: lines[index].quantity ?? 1 })));
+        if (classification !== "regular") return derive({ ...state, checkoutHint: classification === "mixedRefused" ? copyParam("cart.iapSingleItemOnly", "Buy digital items individually, with quantity 1 and no options.") : iapPriceCopy("cart").purchaseUnavailable });
+        const products = await Promise.all(items.map(async item => item!.appId === WIX_STORES_CATALOG_ID ? (await getStoreProduct(item!.catalogItemId)).product : undefined));
+        if (products.some(product => product?.productType?.toLowerCase() !== "physical")) return derive({ ...state, checkoutHint: iapPriceCopy("cart").purchaseUnavailable });
+        const latest = await getCurrentCart();
+        if (signature(latest.lineItems ?? []) !== signature(lines)) return derive({ ...state, checkoutHint: copyParam("cart.changedBeforeCheckout", "Your cart changed. Review it before checking out.") });
+        validatedLines = lines;
+      } catch { return derive({ ...state, checkoutHint: iapPriceCopy("cart").purchaseUnavailable }); }
+
       if (!state.items.length) return derive({ ...state, checkoutHint: copyParam("cart.checkoutEmptyMessage", "Add an item before checkout.") });
       try {
         const checkout = await createCheckoutFromCurrentCart();
@@ -288,6 +327,14 @@ const svc = defineService<State, {
           appId: WIX_STORES_APP_ID,
           snapshotId,
           msid: await resolveMsid(),
+          mayCharge: async () => {
+            const latest = await getCurrentCart();
+            if (signature(latest.lineItems ?? []) !== signature(validatedLines)) return false;
+            return validatedLines.every(line => {
+              const reference = (line as WixCartLineItemDetail & { catalogReference?: Row["catalogReference"] }).catalogReference;
+              return !!reference && cartPricing.pricing.continueCheckoutGuard({ kind: "storesProduct", id: reference.catalogItemId }).allowed;
+            });
+          },
           cashierUrl: async () => {
             const redirect = await createRedirectSession({
               ecomCheckout: { checkoutId },

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

@@ -1,6 +1,7 @@
 import { fetchMemberBookings, type MemberBookingRow } from "../_shared/member-bookings.js";
 import { memberAccess, assertMemberAccess } from "../_shared/member-access.js";
-import { defineService } from "../_shared/home-service.js";
+import { defineService as registerHome } from "../_shared/home-service.js";
+import { withIapPresentation } from "../_shared/iap-presentation.js";
 import { queryServices, type WixService } from "@himalaya/wix-bookings";
 import { getPost, queryPosts, type WixPost } from "@himalaya/wix-blog";
 import { queryGroups, type WixGroup } from "@himalaya/wix-groups";
@@ -68,6 +69,7 @@ interface ProductFeature {
 /** Device-local catalog saves are useful to visitors too; they are never
  * presented as account-synced data or mixed with member-only bookings. */
 interface SavedProductCard {
+  commercePrice: string;
   id: string;
   name: string;
   price: string;
@@ -573,7 +575,7 @@ function postCard(post: WixPost): PostCard {
 function savedProductCard(product: SavedProduct): SavedProductCard {
   const name = cleanTitle(product.name) || copyParam("home.savedProductFallbackName", "Saved item");
   const image = product.image ? wixMediaUrl(product.image) : "";
-  return { id: product.id, name, price: product.price, image, initial: initials(name), hasImage: !!image, noImage: !image, detailScreenId: "himi_product" };
+  return { id: product.id, name, price: product.price, commercePrice: product.price, image, initial: initials(name), hasImage: !!image, noImage: !image, detailScreenId: "himi_product" };
 }
 
 function savedPostCard(post: WixPost): SavedPostCard {
@@ -1111,6 +1113,18 @@ async function refresh(state: State, arg?: unknown): Promise<State | undefined>
     weeklyClassCount: current.weeklyClassCount, weeklyClassGoalFraction: current.weeklyClassGoalFraction, weeklyGoalLabel: current.weeklyGoalLabel });
 }
 
+const defineService = withIapPresentation<State>({
+  register: registerHome, prefix: "home", transientKeys: ["featuredProducts", "savedProducts", "heroPrice"], contentActions: ["refresh"],
+  items: state => [
+    ...state.featuredProducts.map(row => ({ reference: { kind: "storesProduct", id: row.id }, commerceDisplayPrice: row.price })),
+    ...state.savedProducts.map(row => ({ reference: { kind: "storesProduct", id: row.id }, commerceDisplayPrice: row.commercePrice })),
+  ],
+  present: (state, price) => derive({ ...state,
+    featuredProducts: state.featuredProducts.map(row => ({ ...row, price: price(row.id) })),
+    savedProducts: state.savedProducts.map(row => ({ ...row, price: price(row.id, row.commercePrice) })),
+  }),
+});
+
 const svc = defineService<State, {
   // `State | undefined`, matching the implementation: `refresh` returns undefined on a
   // STALE generation (`if (gen !== refreshGen) return undefined`) so the runtime keeps

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

@@ -1,3 +1,6 @@
+import { createIapCommerce, classifyCart } from "@himalaya/iap-checkout";
+import { getStoreProduct } from "../_shared/himi-store.js";
+import { iapPriceCopy } from "../_shared/iap-worker.js";
 import { defineService } from "@himalaya/state";
 import { orderMember, assertOrderMember, ownedOrderCache, orderAccessDenied, orderAccessChanged, type OrderMember } from "../_shared/member-orders.js";
 import { addToCurrentCart, getOrder, searchOrders, type WixOrder } from "@himalaya/wix-ecom";
@@ -38,6 +41,8 @@ interface LineRow {
 
 /** What reorder re-adds: catalog item id + quantity per line (internal). */
 interface ReorderRef {
+  appId?: string;
+  options?: Record<string, unknown>;
   catalogItemId: string;
   quantity: number;
 }
@@ -164,10 +169,10 @@ function lineRows(order: WixOrder): LineRow[] {
 /** Catalog references for the reorder CTA — only store-catalog lines re-add. */
 function reorderRefs(order: WixOrder): ReorderRef[] {
   return (order.lineItems ?? []).flatMap((item) => {
-    const ref = (item as { catalogReference?: { catalogItemId?: string } }).catalogReference;
+    const ref = (item as { catalogReference?: { catalogItemId?: string; appId?: string; options?: Record<string, unknown> } }).catalogReference;
     const catalogItemId = ref?.catalogItemId;
     return typeof catalogItemId === "string" && catalogItemId
-      ? [{ catalogItemId, quantity: item.quantity || 1 }]
+      ? [{ catalogItemId, appId: ref.appId, ...(ref.options ? { options: ref.options } : {}), quantity: item.quantity || 1 }]
       : [];
   });
 }
@@ -307,6 +312,7 @@ async function load(state: State, arg?: unknown): Promise<State | undefined> {
  */
 const FOLLOW_TTL_SECONDS = 24 * 60 * 60;
 
+const reorderPricing = createIapCommerce();
 const svc = defineService<State, {
   load: (state: State, arg?: unknown) => Promise<State | undefined>;
   retry: (state: State) => Promise<State | undefined>;
@@ -401,8 +407,23 @@ const svc = defineService<State, {
       catch { return version === loadVersion ? derive({ ...clearOrder(state), status: "error", emptyText: copyParam("order.signInEmptyText", "Sign in to view this order.") }) : undefined; }
       if (version !== loadVersion) return undefined;
       if (!state.reorderRefs.length) return derive({ ...state, reorderMessage: copyParam("order.reorderNoneMessage", "Nothing on this order can be re-added.") });
+      try {
+        const refs = state.reorderRefs;
+        if (refs.some(ref => ref.appId !== "215238eb-22a5-4c36-9e7b-e7c08025e04e")) return derive({ ...state, reorderMessage: iapPriceCopy("order").purchaseUnavailable });
+        await reorderPricing.loadPrices(refs.map(ref => ({ reference: { kind: "storesProduct", id: ref.catalogItemId } })));
+        const route = classifyCart(refs.map(ref => ({ route: reorderPricing.pricing.view({ kind: "storesProduct", id: ref.catalogItemId }).route, quantity: ref.quantity })));
+        const products = await Promise.all(refs.map(async ref => (await getStoreProduct(ref.catalogItemId)).product));
+        if (route !== "regular" || products.some(product => product?.productType?.toLowerCase() !== "physical")) return derive({ ...state, reorderMessage: iapPriceCopy("order").purchaseUnavailable });
+        await assertOrderMember(member);
+        if (version !== loadVersion) return undefined;
+      } catch {
+        if (version !== loadVersion) return undefined;
+        try { await assertOrderMember(member); }
+        catch { return derive({ ...clearOrder(state), status: "error", emptyText: copyParam("order.signInEmptyText", "Sign in to view this order.") }); }
+        return derive({ ...state, reorderMessage: iapPriceCopy("order").purchaseUnavailable });
+      }
       const results = await Promise.allSettled(
-        state.reorderRefs.map((ref) => addToCurrentCart(ref.catalogItemId, ref.quantity)),
+        state.reorderRefs.map((ref) => addToCurrentCart(ref.catalogItemId, ref.quantity, ref.options)),
       );
       // A pending mutation must never restore an older order after navigation or sign-out.
       if (version !== loadVersion) return undefined;

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

@@ -1,21 +1,13 @@
-// Tier-5 bundle: himi-branded-lite — public pricing plans (memberships).
-//
-// Visitors can browse the site's public pricing plans (design §3.5 `plans`
-// vertical). The public GA route works on the anonymous visitor rung, so the
-// list paints with no login. Purchasing is NATIVE (Phase 2b): "Join" creates the
-// member's plan order via createOnlineOrder, then settles any balance on the shared
-// in-app pay rail (@wix/himalaya/checkout) — wallet where the app has one, in-app Wix
-// cashier otherwise. A FREE / fully-discounted plan activates with no payment step at
-// all. A plan-carried purchasable URL still wins when present, and any failure degrades
-// gracefully to the site-directing message rather than a dead button.
-// Four-state (loading / error / rows / empty) like the sibling branded workers.
 import { defineService } from "../_shared/collection-service.js";
 import { createOnlineOrder, listPublicPlans, type WixPlan } from "@himalaya/wix-pricing-plans";
 import { createRedirectSession } from "@himalaya/wix-redirects";
 import { open as openUrl } from "@himalaya/open-url";
 import { session as wixPlatformSession } from "@himalaya/wix-platform";
 import { copyParam, copyTemplate, stashCopy } from "../_shared/himi-copy.js";
-import { payCashierOrder } from "@himalaya/checkout";
+import { activePlanIds, entitlement, payCashierOrder } from "@himalaya/checkout";
+import { hostSessionFromGlobal, iapPriceFields, type IapCatalogItem } from "@himalaya/iap";
+import { createIapCommerce, pricingPlanOrders } from "@himalaya/iap-checkout";
+import { iapPriceCopy, iapPurchaseCopy, resetUnhydratedKeysOnOlderRuntime } from "../_shared/iap-worker.js";
 import { formatCurrency } from "../_shared/engine-intl.js";
 
 /** Wix Pricing Plans appDefId — the vertical that owns a plan order, so the `appId` its
@@ -57,6 +49,11 @@ interface PlanRow {
   hasBadge: boolean;
   /** Purchasable URL when the plan data carries one; "" otherwise. */
   joinUrl: string;
+  joined: boolean;
+  appleSupported: boolean;
+  joinLabel: string;
+  joinDisabled: boolean;
+  joinNote: string;
 }
 
 interface State {
@@ -130,7 +127,7 @@ function planRow(plan: WixPlan): PlanRow {
   const trialDays = plan.pricing?.freeTrialDays ?? 0;
   const trialBadge = trialDays > 0 ? copyTemplate("plans.trialBadge", "{days}-day free trial", { days: trialDays }) : "";
   return {
-    id: plan.id || name,
+    id: plan.id || "",
     name,
     description: (plan.description ?? "").trim(),
     trialBadge,
@@ -145,6 +142,8 @@ function planRow(plan: WixPlan): PlanRow {
     noBadge: !badge,
     hasBadge: !!badge,
     joinUrl: joinUrl(plan),
+    appleSupported: plan.pricing?.singlePaymentUnlimited === true,
+    joined: false, joinLabel: copyParam("plans.joinCta", "Join"), joinDisabled: true, joinNote: "",
   };
 }
 
@@ -170,9 +169,97 @@ function idOf(arg: unknown): string {
   return typeof value === "string" ? value : "";
 }
 
+const commerce = createIapCommerce({ adapters: [pricingPlanOrders], onChange: () => { void svc.pricingPublish(); } });
+let rows: PlanRow[] = [];
+let items: IapCatalogItem[] = [];
+let message = "";
+let started = false;
+let loading = 0;
+let contentReady = false;
+const joining = new Set<string>();
+const memberSession = hostSessionFromGlobal();
+let regularGeneration = -1;
+let regularAccess = new Set<string>();
+
+
+function pricedState(state: State): State {
+  if (!contentReady) return state;
+  const priced = rows.map(row => {
+    const reference = { kind: "pricingPlan", id: row.id };
+    const view = commerce.pricing.view(reference);
+    const price = iapPriceFields(view, iapPriceCopy("plans"));
+    const purchase = commerce.purchaseFields(reference, iapPurchaseCopy("plans"));
+    const apple = purchase.appleRoute;
+    const regularReady = regularGeneration === memberSession.current().generation && (!memberSession.identityBound || memberSession.current().kind === "member");
+    const joined = apple ? purchase.accessReady : regularReady && regularAccess.has(row.id);
+    return { ...row, priceLine: view.route === "disabled" ? row.priceLine : price.priceText,
+      periodLine: apple ? price.priceNote : view.route === "regular" || view.route === "disabled" ? row.periodLine : "",
+      trialBadge: apple || price.actionDisabled ? "" : row.trialBadge,
+      noTrialBadge: apple || price.actionDisabled || row.noTrialBadge,
+      joined,
+      joinLabel: joined ? copyParam("plans.joinedLabel", "Current plan") : apple ? purchase.buyLabel : row.joinLabel,
+      joinDisabled: joined || (apple ? purchase.buyDisabled || !row.appleSupported : price.actionDisabled || !regularReady) || joining.has(row.id),
+      joinNote: apple ? row.appleSupported ? purchase.buyNote : iapPriceCopy("plans").purchaseUnavailable : price.actionNote };
+  });
+  const owned = priced.find(row => row.joined);
+  const poll = commerce.pollDirective("himiBrandedPlans.iapPoll");
+  return { ...state, ...ready(priced, owned ? copyTemplate("plans.joinedMessage", "You've joined {name}.", { name: owned.name }) : message), ...(poll ? { _poll: poll } : {}) };
+}
+
+async function regularJoinMessage(row: PlanRow, reference: { kind: string; id: string }): Promise<string> {
+  const generation = memberSession.current().generation;
+  if (row.joinUrl) {
+    try {
+      const result = await openUrl(row.joinUrl, "in_app_browser");
+      if (result.opened) { return ""; }
+    } catch {
+    }
+  }
+  try {
+    const created = await createOnlineOrder(row.id);
+    const snapshotId = created.purchaseFlowId;
+    if (generation !== memberSession.current().generation) return "";
+    if (created.order?.status === "ACTIVE") {
+      regularAccess.add(row.id);
+      return copyTemplate("plans.joinedMessage", "You've joined {name}.", { name: row.name });
+    }
+    const pay = await payCashierOrder({
+      appId: WIX_PRICING_PLANS_APP_ID,
+      snapshotId: snapshotId ?? "",
+      msid: await resolveMsid(),
+      mayCharge: () => commerce.pricing.continueCheckoutGuard(reference).allowed,
+      cashierUrl: async () => {
+        if (!commerce.pricing.continueCheckoutGuard(reference).allowed) return undefined;
+        const redirect = await createRedirectSession({
+          paidPlansCheckout: { planId: row.id },
+          callbacks: { postFlowUrl: "himalaya-himi-branded-lite://screen/himi_plans" },
+        });
+        return redirect.redirectSession?.fullUrl;
+      },
+    });
+    if (pay.kind === "paid") {
+      const access = await entitlement(row.id);
+      if (generation !== memberSession.current().generation) return "";
+      if (access.entitled) regularAccess.add(row.id);
+      return access.entitled
+        ? copyTemplate("plans.joinedMessage", "You've joined {name}.", { name: row.name })
+        : copyParam("plans.purchaseProcessingText", "Processing your purchase…");
+    }
+    if (pay.kind === "handoff") { return ""; }
+    if (pay.kind === "cancelled") {
+      return copyParam("plans.joinCancelledMessage", "Payment cancelled — you haven't joined.");
+    }
+  } catch {
+  }
+  return copyTemplate("plans.joinOnSiteMessage", "Memberships are purchased on the website — visit the site to join {name}.", { name: row.name });
+}
+
 const svc = defineService<State, {
-  load: (state: State, arg?: unknown) => Promise<State>;
-  join: (state: State, arg?: unknown) => Promise<State>;
+  load: (state: State, arg?: unknown) => Promise<State | undefined>;
+  pricingPublish: (state: State) => State;
+  pricingRefresh: (state: State) => Promise<undefined>;
+  iapPoll: (state: State) => Promise<undefined>;
+  join: (state: State, arg?: unknown) => Promise<State | undefined>;
 }>("himiBrandedPlans", {
   state: {
     status: "loading",
@@ -187,13 +274,38 @@ const svc = defineService<State, {
     noRows: true,
     noEmpty: true,
   },
+  notHydrated: ["rows", "actionMessage"],
   actions: {
+    pricingPublish: pricedState,
+    pricingRefresh: async () => { await commerce.loadPrices(items); return undefined; },
+    iapPoll: async () => { await commerce.poll(); void svc.pricingPublish(); return undefined; },
     load: async (state, arg) => {
       stashCopy(arg);
+      const seq = ++loading;
+      const generation = memberSession.current().generation;
+      regularGeneration = -1;
+      regularAccess = new Set();
       try {
         const response = await listPublicPlans();
-        return ready((response.plans ?? []).filter((plan) => !plan.archived).map(planRow));
+        if (seq !== loading) return undefined;
+        message = "";
+        contentReady = true;
+        rows = (response.plans ?? []).filter(plan => !plan.archived).map(planRow);
+        items = rows.map(row => ({ reference: { kind: "pricingPlan", id: row.id }, commerceDisplayPrice: row.priceLine }));
+        void svc.pricingPublish();
+        const access = rows.length > 0 && memberSession.current().kind === "member" ? await activePlanIds() : [];
+        if (seq !== loading || generation !== memberSession.current().generation) return undefined;
+        regularAccess = new Set(access);
+        regularGeneration = generation;
+        await commerce.loadPrices(items);
+        await (started ? commerce.reconcile() : commerce.start());
+        if (seq !== loading || generation !== memberSession.current().generation) return undefined;
+        started = true;
+        void svc.pricingPublish();
+        return undefined;
       } catch {
+        if (seq !== loading || generation !== memberSession.current().generation) return undefined;
+        contentReady = false;
         // Bridge errors (e.g. a 501 from a serve bridge without the route) land
         // here — a graceful error card with retry, never a dead screen.
         return {
@@ -209,57 +321,26 @@ const svc = defineService<State, {
     },
     join: async (state, arg) => {
       const row = state.rows.find((candidate) => candidate.id === idOf(arg));
-      if (!row) return state;
-      // A plan-carried purchasable URL still takes precedence (defensive: no
-      // documented field emits one today, but if a future payload does we honor
-      // it before minting a redirect session).
-      if (row.joinUrl) {
-        try {
-          const result = await openUrl(row.joinUrl, "in_app_browser");
-          if (result.opened) return { ...state, actionMessage: "" };
-        } catch {
-          // fall through to the redirect-session rail below
-        }
+      if (!row || joining.has(row.id)) return undefined;
+      const reference = { kind: "pricingPlan", id: row.id };
+      const purchase = commerce.purchaseFields(reference, iapPurchaseCopy("plans"));
+      if (purchase.accessReady) return undefined;
+      if (purchase.appleRoute) {
+        if (!row.appleSupported) return undefined;
+        await commerce.buy({ reference });
+        void svc.pricingPublish();
+        return undefined;
       }
-      // Phase 2b — NATIVE join: create the member's plan order, then settle any
-      // balance on the shared in-app pay rail. A FREE (or fully-discounted) plan comes
-      // back active with no `purchaseFlowId` and needs no payment step at all, which is
-      // the case the hosted redirect used to make needlessly heavy.
+      if (regularGeneration !== memberSession.current().generation || (memberSession.identityBound && memberSession.current().kind !== "member") || regularAccess.has(row.id) || !commerce.pricing.checkoutGuard(reference).allowed) return undefined;
+      joining.add(row.id);
+      void svc.pricingPublish();
       try {
-        const created = await createOnlineOrder(row.id);
-        const snapshotId = created.purchaseFlowId;
-        if (!snapshotId) {
-          // Nothing to charge ⇒ the membership is already active.
-          return { ...state, actionMessage: copyTemplate("plans.joinedMessage", "You've joined {name}.", { name: row.name }) };
-        }
-        const pay = await payCashierOrder({
-          appId: WIX_PRICING_PLANS_APP_ID,
-          snapshotId,
-          msid: await resolveMsid(),
-          // Wallet-less apps keep the hosted plans checkout, IN-APP — so a site with no
-          // provisioned wallet can still sell memberships (see @wix/himalaya/checkout).
-          cashierUrl: async () => {
-            const redirect = await createRedirectSession({
-              paidPlansCheckout: { planId: row.id },
-              callbacks: { postFlowUrl: "himalaya-himi-branded-lite://screen/himi_plans" },
-            });
-            return redirect.redirectSession?.fullUrl;
-          },
-        });
-        if (pay.kind === "paid") {
-          return { ...state, actionMessage: copyTemplate("plans.joinedMessage", "You've joined {name}.", { name: row.name }) };
-        }
-        if (pay.kind === "handoff") return { ...state, actionMessage: "" };
-        if (pay.kind === "cancelled") {
-          return { ...state, actionMessage: copyParam("plans.joinCancelledMessage", "Payment cancelled — you haven't joined.") };
-        }
-      } catch {
-        // Order/pay failure → graceful site-directing fallback below.
+        message = await regularJoinMessage(row, reference);
+        return undefined;
+      } finally {
+        joining.delete(row.id);
+        void svc.pricingPublish();
       }
-      return {
-        ...state,
-        actionMessage: copyTemplate("plans.joinOnSiteMessage", "Memberships are purchased on the website — visit the site to join {name}.", { name: row.name }),
-      };
     },
   },
 });
@@ -270,5 +351,13 @@ const svc = defineService<State, {
 // loading skeleton indefinitely on iOS. onAppear still fires afterwards and
 // re-loads with the screen's copy pack; it passes no required params here
 // (`appear(..., undefined, "<prefix>.")`), so a param-less first load is safe.
+resetUnhydratedKeysOnOlderRuntime(svc, { ...svc.getState(), rows: [], actionMessage: "" }, ["rows", "actionMessage"]);
+memberSession.subscribe(() => {
+  message = "";
+  regularGeneration = -1;
+  regularAccess = new Set();
+  void svc.pricingPublish();
+  void svc.load();
+});
 svc.load();
 export { svc };

package/templates/branded-lite/tier5-src/himi-store-product/index.ts

@@ -1,5 +1,7 @@
 // Tier-5 bundle: himi-store — product detail.
-import { defineService } from "@himalaya/state";
+import { withIapPresentation } from "../_shared/iap-presentation.js";
+import { type IapCommerce } from "@himalaya/iap-checkout";
+import { iapPriceCopy } from "../_shared/iap-worker.js";
 import { share as shareSheet } from "@himalaya/share";
 import { addToCurrentCart, getCurrentCart } from "@himalaya/wix-ecom";
 import { get, upsert, enqueue, type DbEntity } from "@himalaya/local-db";
@@ -74,6 +76,7 @@ let lastProduct: StoreProduct | undefined;
  *  `refreshServices()` → `load()`, so this is what tells a genuine navigation to a
  *  DIFFERENT product (drop the picks) from the same product coming back (keep them). */
 let lastLoadedId: string | undefined;
+let productLoadSequence = 0;
 
 interface OptionSlots {
   opt1Label: string; opt1Chips: OptionChip[]; opt1Selected: string[]; noOpt1: boolean;
@@ -136,6 +139,7 @@ interface S {
   status: "loading" | "ready" | "error";
   name: string;
   price: string;
+  commercePrice?: string;
   /** The plain-text description: RichContent's fallback, and what shows with no document. */
   description: string;
   /** [rico] #3372 — a V3 product's Ricos `description` (read with `fields=DESCRIPTION`) as ONE document string
@@ -305,6 +309,14 @@ function derive(s: S): S {
 // read answering late — must not replace the badge the add set (#3468 review).
 let cartBadgeEpoch = 0;
 
+let productPricing: IapCommerce;
+const defineService = withIapPresentation<S>({
+  onCreate: commerce => { productPricing = commerce; }, prefix: "product", transientKeys: ["price", "optionsIncomplete"], contentActions: ["load", "paintCached"],
+  items: state => inputId() ? [{ reference: { kind: "storesProduct", id: inputId() }, commerceDisplayPrice: state.price }] : [],
+  present: (state, price, allowed) => ({ ...state, price: price(inputId()), optionsIncomplete: derive(state).optionsIncomplete || !allowed(inputId()) || lastProduct?.productType?.toLowerCase() === "digital",
+    cartHint: lastProduct?.productType?.toLowerCase() === "digital" || (!state.optionsUnknown && !allowed(inputId())) ? iapPriceCopy("product").purchaseUnavailable : state.cartHint === iapPriceCopy("product").purchaseUnavailable ? "" : state.cartHint }),
+});
+
 const svc = defineService<S, {
   load: (s: S, arg?: unknown) => Promise<S>;
   setQuantity: (s: S, arg?: unknown) => S;
@@ -365,8 +377,10 @@ const svc = defineService<S, {
     opt3Label: "", opt3Chips: [], opt3Selected: [], noOpt3: true,
   }),
   actions: {
-    load: async (s, arg) => {
+    load: async (s, arg): Promise<S> => {
       stashCopy(arg);
+      const sequence = ++productLoadSequence;
+      lastProduct = undefined;
       const id = inputId();
       // Storage problems must not prevent browsing or buying a product.
       let saved = false;
@@ -403,6 +417,7 @@ const svc = defineService<S, {
         painted = true;
       }
       const outcome = await live;
+      if (sequence !== productLoadSequence || id !== inputId()) return svc.getState() as S;
       // Once painted the page is INTERACTIVE while the live read is on the wire: the visitor may
       // save, change the quantity or add to cart. Build on the state as it is NOW, and keep what
       // they did — overwriting it would untick a stored save, reset the quantity, and drop the
@@ -448,6 +463,7 @@ const svc = defineService<S, {
           optionsUnknown: false,
           name,
           price: productPrice(p),
+          commercePrice: productPrice(p),
           ...productBody(p),
           image,
           gallery: productGallery(p),
@@ -543,6 +559,7 @@ const svc = defineService<S, {
         status: "ready",
         name,
         price: String(row.subtitle ?? ""),
+        commercePrice: String(row.subtitle ?? ""),
         description: "",
         descriptionJson: "",
         image: String(row.image ?? ""),
@@ -559,6 +576,7 @@ const svc = defineService<S, {
     },
     addToCart: async (s) => {
       const id = inputId();
+      if (!productPricing.pricing.checkoutGuard({ kind: "storesProduct", id }).allowed || lastProduct?.productType?.toLowerCase() === "digital") return derive({ ...s, cartHint: iapPriceCopy("product").purchaseUnavailable });
       if (!id) return derive({ ...s, cartHint: copyParam("product.cartHintNoProduct", "No product to add.") });
       // A second tap while the first write is in flight must not add the line twice.
       if (s.adding) return s;
@@ -571,6 +589,9 @@ const svc = defineService<S, {
           ? copyParam("product.cartHintOffline", "Reconnect to choose options and add this to your cart.")
           : optionsHint(s.optionGroups, s.selection) || copyParam("product.cartHintNoVariant", "That combination is not available. Try another.") });
       }
+      if (lastLoadedId !== id || lastProduct?.productType?.toLowerCase() !== "physical") {
+        return derive({ ...s, cartHint: copyParam("product.cartHintOffline", "Reconnect to choose options and add this to your cart.") });
+      }
       // Which variant the choice resolves to is the SDK's job — V3 addresses the
       // choice by variantId, V1 by a name→choice map, and it throws rather than
       // hand back a payload that would add a line with no variant.
@@ -613,7 +634,7 @@ const svc = defineService<S, {
     toggleSave: (s) => {
       if (s.status !== "ready" || !s.name || !inputId()) return s;
       try {
-        const saved = toggleSavedProduct({ id: inputId(), name: s.name, price: s.price, image: s.image });
+        const saved = toggleSavedProduct({ id: inputId(), name: s.name, price: lastProduct ? productPrice(lastProduct) : s.commercePrice ?? "", image: s.image });
         return derive({ ...s, saved, saveHint: saved
           ? copyParam("product.saveSuccess", "Saved on this device.")
           : copyParam("product.saveRemoved", "Removed from saved products.") });

package/templates/branded-lite/tier5-src/himi-store-saved/index.ts

@@ -1,9 +1,9 @@
-import { defineService } from "@himalaya/state";
+import { withIapPresentation } from "../_shared/iap-presentation.js";
 import { withEmptyFlags } from "../_shared/empty-flags.js";
 import { readSavedProducts, removeSavedProduct, type SavedProduct } from "../_shared/himi-store-saved.js";
 import { stashCopy, copyParam } from "../_shared/himi-copy.js";
 
-interface Row extends SavedProduct { initial: string; noImage: boolean; hasImage: boolean; detailScreenId: string }
+interface Row extends SavedProduct { commercePrice?: string; initial: string; noImage: boolean; hasImage: boolean; detailScreenId: string }
 interface S {
   status: "loading" | "ready" | "error";
   rows: Row[];
@@ -18,11 +18,16 @@ function shape(s: Pick<S, "status" | "rows" | "error">): S {
   return { ...s, isLoading: s.status === "loading", notLoading: s.status !== "loading", notErrored: s.status !== "error", noEmpty: s.status !== "ready" || s.rows.length > 0, emptyText: copyParam("savedProducts.empty", "Save a product to find it here later.") };
 }
 function loadRows(): Row[] {
-  return readSavedProducts().map(row => ({ ...row, initial: row.name.slice(0, 1).toUpperCase(), hasImage: !!row.image, noImage: !row.image, detailScreenId: "himi_product" }));
+  return readSavedProducts().map(row => ({ ...row, commercePrice: row.price, initial: row.name.slice(0, 1).toUpperCase(), hasImage: !!row.image, noImage: !row.image, detailScreenId: "himi_product" }));
 }
 function failed(s: S): S {
   return shape({ ...s, status: "error", error: copyParam("savedProducts.error", "Could not update saved products. Try again.") });
 }
+const defineService = withIapPresentation<S>({
+  prefix: "savedProducts", transientKeys: ["rows"], contentActions: ["load", "remove"],
+  items: state => state.rows.map(row => ({ reference: { kind: "storesProduct", id: row.id }, commerceDisplayPrice: row.commercePrice ?? row.price })),
+  present: (state, price) => ({ ...state, rows: state.rows.map(row => ({ ...row, price: price(row.id, row.commercePrice ?? row.price) })) }),
+});
 const svc = defineService<S, {
   load: (s: S, arg?: unknown) => S;
   remove: (s: S, arg?: unknown) => S;