@fluid-app/portal-sdk 0.1.484 → 0.1.486

package/dist/{SubscriptionsScreen-BKJALFrF.mjs → SubscriptionsScreen-DQuqYGHH.mjs}

@@ -15,7 +15,7 @@ import { n as useAppNavigation } from "./AppNavigationContext-BFStgikI.mjs";
 import { t as useStore } from "./use-store-CEDJ-H-8.mjs";
 import { f as useSidebar } from "./sidebar-DwB6s4af.mjs";
 import { n as ScreenHeaderBreadcrumbs } from "./ScreenHeaderContext-DnGLNAvp.mjs";
-import { _ as ProfileTranslationBridge, a as getBrowserInfo, c as EditPaymentMethodDialog, d as getCardDisplayName, f as getCardExpiry, g as EllipsesDropdown, h as ConfirmActionDialog, i as isThreeDsRequiredCreate, l as FluidPayCoreProvider, n as createFluidPayApiAdapter, o as CreditCardFormDialog, p as getPaymentMethodLogoBrand, r as mapToFluidPayPaymentMethod, s as AddressFormDialog, t as usePortalCardAdd3DSFlow, u as PaymentIcon, v as useProfileTranslation } from "./use-portal-card-add-3ds-flow-CaxgEoqx.mjs";
+import { _ as ProfileTranslationBridge, a as getBrowserInfo, c as EditPaymentMethodDialog, d as getCardDisplayName, f as getCardExpiry, g as EllipsesDropdown, h as ConfirmActionDialog, i as isThreeDsRequiredCreate, l as FluidPayCoreProvider, n as createFluidPayApiAdapter, o as CreditCardFormDialog, p as getPaymentMethodLogoBrand, r as mapToFluidPayPaymentMethod, s as AddressFormDialog, t as usePortalCardAdd3DSFlow, u as PaymentIcon, v as useProfileTranslation } from "./use-portal-card-add-3ds-flow-CCxDpsu-.mjs";
 import { a as paymentDescriptorLabel, d as normalizeCardBrand, i as normalizePaymentDescriptor, s as resolvePaymentMethodDisplay, t as isCardPaymentDescriptor, u as getPaymentBrandName } from "./display-BEVe3Jb4.mjs";
 import { createContext, use, useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
 import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
@@ -2538,6 +2538,19 @@ function getMaxEditableBillDate(billingInterval = 1, billingIntervalUnit = "mont
 	if (maxDate.getDate() !== day) maxDate.setDate(0);
 	return maxDate;
 }
+/**
+* Latest date a whole bundle's bill date may be edited to. Every member moves
+* to one shared date, so the strictest member binds: a bundle holding one
+* monthly plan is capped at 12 months even if its other members are yearly.
+*
+* An empty list falls back to the 12-month cap, which is also what a member of
+* unknown cadence resolves to via getMaxEditableBillDate's own default.
+*/
+function getMaxEditableBillDateForBundle(members, from = /* @__PURE__ */ new Date()) {
+	const [first, ...rest] = members.map((member) => getMaxEditableBillDate(member.billingInterval, member.billingIntervalUnit, from));
+	if (!first) return getMaxEditableBillDate(1, "month", from);
+	return rest.reduce((strictest, current) => current < strictest ? current : strictest, first);
+}
 function calculateNextBillDate(billingInterval = 1, billingIntervalUnit = "month") {
 	const now = /* @__PURE__ */ new Date();
 	const nextBillDate = new Date(now);
@@ -2558,6 +2571,36 @@ function calculateNextBillDate(billingInterval = 1, billingIntervalUnit = "month
 	}
 	return nextBillDate.toISOString().split("T")[0] || "";
 }
+/** Longest pause the dialogs have ever offered, before the cap narrows it. */
+const MAX_SKIPPABLE_ORDERS = 99;
+/**
+* How many upcoming orders a pause may skip: the largest count whose resume
+* date still lands inside the bill-date cap.
+*
+* Pausing for a number of orders sets a bill date like any other edit, so the
+* API caps the date it derives from that count, 2 years out for a yearly cadence
+* and 12 months for everything else, and rejects the request naming
+* number_of_orders. Offering counts past that offers a pause the API refuses.
+*
+* Returns 0 when even a single skip overshoots, which happens on a subscription
+* whose next bill date already sits near the cap. Callers should read that as
+* "pausing by order count is unavailable here" and leave the indefinite pause.
+*
+* The two ends deliberately measure from different places: the resume date
+* counts forward from the current bill date, the cap counts forward from today.
+* The API stays the backstop, so the exact boundary count depends on its
+* resume-date arithmetic agreeing with calculateResumeDate.
+*/
+function getMaxSkippableOrders(billingInterval = 1, billingIntervalUnit = "month", currentNextBillDate, from = /* @__PURE__ */ new Date()) {
+	const cap = getMaxEditableBillDate(billingInterval, billingIntervalUnit, from);
+	let allowed = 0;
+	for (let count = 1; count <= MAX_SKIPPABLE_ORDERS; count += 1) {
+		const resume = calculateResumeDate(billingInterval, billingIntervalUnit, count, currentNextBillDate ?? from);
+		if (new Date(resume.getUTCFullYear(), resume.getUTCMonth(), resume.getUTCDate()) > cap) break;
+		allowed = count;
+	}
+	return allowed;
+}
 function formatDate(dateString, locale = "en-US") {
 	if (!dateString) return "";
 	const parts = (dateString.split("T")[0] ?? dateString).split("-");
@@ -4132,6 +4175,30 @@ function isPaymentMethodUsable(pm) {
 	return Boolean(addr.address1 && addr.city && addr.state && addr.zip && addr.country_code);
 }
 //#endregion
+//#region src/screens/subscriptions/bundle-drawer/bill-date-bounds.ts
+function getDaysInMonth(year, month) {
+	return new Date(year, month + 1, 0).getDate();
+}
+function isYearOutOfRange(year, { today, maxDate }) {
+	return year < today.getFullYear() || year > maxDate.getFullYear();
+}
+function isMonthOutOfRange(year, month, bounds) {
+	const { today, maxDate } = bounds;
+	if (isYearOutOfRange(year, bounds)) return true;
+	if (year === maxDate.getFullYear() && month > maxDate.getMonth()) return true;
+	if (year > today.getFullYear()) return false;
+	return month < today.getMonth();
+}
+function isDayOutOfRange(year, month, day, bounds) {
+	const { today, maxDate } = bounds;
+	if (day > getDaysInMonth(year, month)) return true;
+	if (isMonthOutOfRange(year, month, bounds)) return true;
+	if (year === maxDate.getFullYear() && month === maxDate.getMonth() && day > maxDate.getDate()) return true;
+	if (year > today.getFullYear()) return false;
+	if (month > today.getMonth()) return false;
+	return day < today.getDate();
+}
+//#endregion
 //#region src/screens/subscriptions/bundle-drawer/use-bundle-form.ts
 function pickDefaultAddressId(addresses, defaultAddressId) {
 	if (defaultAddressId != null) {
@@ -4152,11 +4219,11 @@ function pickDefaultPaymentMethodId(paymentMethods, defaultPaymentMethodId) {
 	if (flagged) return flagged.id;
 	return usable[0]?.id ?? null;
 }
-function useBundleForm({ addresses, paymentMethods, defaultAddressId, defaultPaymentMethodId }) {
+function useBundleForm({ subscriptions: subscriptionList, addresses, paymentMethods, defaultAddressId, defaultPaymentMethodId }) {
 	const [step, setStep] = useState(1);
 	const [selectedTokens, setSelectedTokens] = useState(() => /* @__PURE__ */ new Set());
 	const today = useMemo(() => /* @__PURE__ */ new Date(), []);
-	const [selectedYear, setYearState] = useState(today.getUTCFullYear());
+	const [selectedYear, setYearState] = useState(today.getFullYear());
 	const [selectedMonth, setMonthState] = useState(null);
 	const [selectedDay, setDayState] = useState(null);
 	const [selectedAddressId, setSelectedAddressId] = useState(() => pickDefaultAddressId(addresses, defaultAddressId));
@@ -4175,55 +4242,73 @@ function useBundleForm({ addresses, paymentMethods, defaultAddressId, defaultPay
 		paymentMethods,
 		defaultPaymentMethodId
 	]);
+	const toggleToken = useCallback((token) => {
+		setSelectedTokens((prev) => {
+			const next = new Set(prev);
+			if (next.has(token)) next.delete(token);
+			else next.add(token);
+			return next;
+		});
+	}, []);
+	const bounds = useMemo(() => {
+		return {
+			today,
+			maxDate: getMaxEditableBillDateForBundle(Array.from(selectedTokens).map((token) => {
+				const plan = subscriptionList.find((sub) => sub.subscription_token === token)?.subscription_plan;
+				return {
+					billingInterval: plan?.billing_interval,
+					billingIntervalUnit: plan?.billing_interval_unit
+				};
+			}), today)
+		};
+	}, [
+		selectedTokens,
+		subscriptionList,
+		today
+	]);
+	const setYear = useCallback((y) => {
+		setYearState(y);
+		if (selectedMonth == null) return;
+		if (isMonthOutOfRange(y, selectedMonth, bounds)) {
+			setMonthState(null);
+			setDayState(null);
+			return;
+		}
+		if (selectedDay != null && isDayOutOfRange(y, selectedMonth, selectedDay, bounds)) setDayState(null);
+	}, [
+		selectedMonth,
+		selectedDay,
+		bounds
+	]);
+	const setMonth = useCallback((m) => {
+		setMonthState(m);
+		if (selectedDay != null && isDayOutOfRange(selectedYear, m, selectedDay, bounds)) setDayState(null);
+	}, [
+		selectedDay,
+		selectedYear,
+		bounds
+	]);
+	const setDay = useCallback((d) => setDayState(d), []);
+	const canProceedFromStep1 = selectedTokens.size >= 2;
+	const selectedDateOutOfRange = selectedMonth !== null && selectedDay !== null && isDayOutOfRange(selectedYear, selectedMonth, selectedDay, bounds);
 	return {
 		step,
 		setStep,
 		selectedTokens,
-		toggleToken: useCallback((token) => {
-			setSelectedTokens((prev) => {
-				const next = new Set(prev);
-				if (next.has(token)) next.delete(token);
-				else next.add(token);
-				return next;
-			});
-		}, []),
+		toggleToken,
 		selectedYear,
 		selectedMonth,
 		selectedDay,
-		setYear: useCallback((y) => {
-			setYearState(y);
-			if (selectedMonth != null) {
-				const isPastMonth = y < today.getUTCFullYear() || y === today.getUTCFullYear() && selectedMonth < today.getUTCMonth();
-				const isPastDay = y === today.getUTCFullYear() && selectedMonth === today.getUTCMonth() && selectedDay != null && selectedDay < today.getUTCDate();
-				if (isPastMonth) {
-					setMonthState(null);
-					setDayState(null);
-				} else if (isPastDay) setDayState(null);
-			}
-		}, [
-			selectedMonth,
-			selectedDay,
-			today
-		]),
-		setMonth: useCallback((m) => {
-			setMonthState(m);
-			if (selectedDay != null) {
-				const daysInNewMonth = new Date(Date.UTC(selectedYear, m + 1, 0)).getUTCDate();
-				const isPastDay = selectedYear === today.getUTCFullYear() && m === today.getUTCMonth() && selectedDay < today.getUTCDate();
-				if (selectedDay > daysInNewMonth || isPastDay) setDayState(null);
-			}
-		}, [
-			selectedDay,
-			selectedYear,
-			today
-		]),
-		setDay: useCallback((d) => setDayState(d), []),
+		setYear,
+		setMonth,
+		setDay,
 		selectedAddressId,
 		setSelectedAddressId,
 		selectedPaymentMethodId,
 		setSelectedPaymentMethodId,
-		canProceedFromStep1: selectedTokens.size >= 2,
-		canProceedFromStep2: selectedMonth !== null && selectedDay !== null,
+		bounds,
+		canProceedFromStep1,
+		canProceedFromStep2: selectedMonth !== null && selectedDay !== null && !selectedDateOutOfRange,
 		canProceedFromStep3: selectedAddressId != null,
 		canProceedFromStep4: selectedPaymentMethodId != null,
 		formattedDate: useMemo(() => {
@@ -4452,34 +4537,20 @@ const MONTHS = [
 	"Nov",
 	"Dec"
 ];
-function getDaysInMonth(year, month) {
-	return new Date(Date.UTC(year, month + 1, 0)).getUTCDate();
-}
-function DrawerStepDate({ selectedYear, selectedMonth, selectedDay, onYearChange, onMonthChange, onDayChange }) {
+function DrawerStepDate({ selectedYear, selectedMonth, selectedDay, onYearChange, onMonthChange, onDayChange, bounds }) {
 	const { t } = useSubscriptionsTranslation();
-	const today = useMemo(() => /* @__PURE__ */ new Date(), []);
-	const currentYear = today.getUTCFullYear();
-	const currentMonth = today.getUTCMonth();
-	const currentDay = today.getUTCDate();
+	const currentYear = bounds.today.getFullYear();
 	const availableYears = useMemo(() => [
 		currentYear,
 		currentYear + 1,
 		currentYear + 2
 	], [currentYear]);
-	const isMonthDisabled = (monthIndex) => {
-		if (selectedYear < currentYear) return true;
-		if (selectedYear > currentYear) return false;
-		return monthIndex < currentMonth;
-	};
+	const isYearDisabled = (year) => isYearOutOfRange(year, bounds);
+	const isMonthDisabled = (monthIndex) => isMonthOutOfRange(selectedYear, monthIndex, bounds);
 	const daysInSelectedMonth = selectedMonth == null ? 31 : getDaysInMonth(selectedYear, selectedMonth);
 	const isDayDisabled = (day) => {
 		if (selectedMonth == null) return true;
-		if (day > getDaysInMonth(selectedYear, selectedMonth)) return true;
-		if (selectedYear < currentYear) return true;
-		if (selectedYear > currentYear) return false;
-		if (selectedMonth > currentMonth) return false;
-		if (selectedMonth < currentMonth) return true;
-		return day < currentDay;
+		return isDayOutOfRange(selectedYear, selectedMonth, day, bounds);
 	};
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex-1 overflow-y-auto px-6 py-4",
@@ -4502,10 +4573,13 @@ function DrawerStepDate({ selectedYear, selectedMonth, selectedDay, onYearChange
 				}), /* @__PURE__ */ jsx("div", {
 					className: "grid grid-cols-3 gap-2",
 					children: availableYears.map((year) => {
+						const isActive = selectedYear === year;
+						const disabled = isYearDisabled(year);
 						return /* @__PURE__ */ jsx("button", {
 							type: "button",
+							disabled,
 							onClick: () => onYearChange(year),
-							className: `rounded-lg px-3 py-2.5 text-xs font-semibold transition-all ${selectedYear === year ? "bg-primary text-primary-foreground" : "text-foreground ring-border hover:ring-foreground/20 bg-transparent ring-1"}`,
+							className: `rounded-lg px-3 py-2.5 text-xs font-semibold transition-all ${isActive ? "bg-primary text-primary-foreground" : "text-foreground ring-border hover:ring-foreground/20 bg-transparent ring-1"} ${disabled ? "cursor-not-allowed opacity-40" : ""}`,
 							children: year
 						}, year);
 					})
@@ -4749,6 +4823,7 @@ function BundleSubscriptionsDrawer({ open, onOpenChange, subscriptions: subscrip
 	const { t } = useSubscriptionsTranslation();
 	const { isMobile } = useSidebar();
 	const form = useBundleForm({
+		subscriptions: subscriptionList,
 		addresses,
 		paymentMethods,
 		defaultAddressId,
@@ -4793,7 +4868,8 @@ function BundleSubscriptionsDrawer({ open, onOpenChange, subscriptions: subscrip
 				selectedDay: form.selectedDay,
 				onYearChange: form.setYear,
 				onMonthChange: form.setMonth,
-				onDayChange: form.setDay
+				onDayChange: form.setDay,
+				bounds: form.bounds
 			}),
 			form.step === 3 && /* @__PURE__ */ jsx(DrawerStepAddress, {
 				addresses,
@@ -5354,7 +5430,8 @@ function PauseSubscriptionDialog({ open, onOpenChange, onConfirm, isLoading, err
 	const { t, locale } = useSubscriptionsTranslation();
 	const [pauseType, setPauseType] = useState("indefinite");
 	const [selectedOrderCount, setSelectedOrderCount] = useState(null);
-	const orderCountOptions = Array.from({ length: 99 }, (_, i) => i + 1);
+	const maxSkippableOrders = getMaxSkippableOrders(billingInterval, billingIntervalUnit, currentNextBillDate);
+	const orderCountOptions = Array.from({ length: maxSkippableOrders }, (_, i) => i + 1);
 	const calculatedResumeDate = selectedOrderCount && currentNextBillDate ? calculateResumeDate(billingInterval, billingIntervalUnit, selectedOrderCount, currentNextBillDate) : null;
 	useEffect(() => {
 		if (!open) return;
@@ -5434,10 +5511,11 @@ function PauseSubscriptionDialog({ open, onOpenChange, onConfirm, isLoading, err
 									type: "radio",
 									checked: pauseType === "order_count",
 									onChange: () => setPauseType("order_count"),
-									className: "border-border accent-primary size-4 focus:ring-0"
+									disabled: maxSkippableOrders === 0,
+									className: "border-border accent-primary size-4 focus:ring-0 disabled:opacity-40"
 								}), /* @__PURE__ */ jsx(Label, {
 									htmlFor: "pause-order-count",
-									className: "text-foreground cursor-pointer text-sm font-medium",
+									className: `text-sm font-medium ${maxSkippableOrders === 0 ? "text-muted-foreground cursor-not-allowed" : "text-foreground cursor-pointer"}`,
 									children: t("pause_for_orders")
 								})]
 							}), pauseType === "order_count" && /* @__PURE__ */ jsxs("div", {
@@ -8542,4 +8620,4 @@ const subscriptionsScreenPropertySchema = {
 //#endregion
 export { subscriptionsScreenPropertySchema as n, SubscriptionsScreen as t };
 
-//# sourceMappingURL=SubscriptionsScreen-BKJALFrF.mjs.map
+//# sourceMappingURL=SubscriptionsScreen-DQuqYGHH.mjs.map