@fluid-app/portal-sdk 0.1.484 → 0.1.485

package/dist/{SubscriptionsScreen-DPymXVC4.cjs → SubscriptionsScreen-9NJY-K63.cjs}

@@ -2600,6 +2600,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);
@@ -2620,6 +2633,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("-");
@@ -4194,6 +4237,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) {
@@ -4214,11 +4281,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] = (0, react.useState)(1);
 	const [selectedTokens, setSelectedTokens] = (0, react.useState)(() => /* @__PURE__ */ new Set());
 	const today = (0, react.useMemo)(() => /* @__PURE__ */ new Date(), []);
-	const [selectedYear, setYearState] = (0, react.useState)(today.getUTCFullYear());
+	const [selectedYear, setYearState] = (0, react.useState)(today.getFullYear());
 	const [selectedMonth, setMonthState] = (0, react.useState)(null);
 	const [selectedDay, setDayState] = (0, react.useState)(null);
 	const [selectedAddressId, setSelectedAddressId] = (0, react.useState)(() => pickDefaultAddressId(addresses, defaultAddressId));
@@ -4237,55 +4304,73 @@ function useBundleForm({ addresses, paymentMethods, defaultAddressId, defaultPay
 		paymentMethods,
 		defaultPaymentMethodId
 	]);
+	const toggleToken = (0, react.useCallback)((token) => {
+		setSelectedTokens((prev) => {
+			const next = new Set(prev);
+			if (next.has(token)) next.delete(token);
+			else next.add(token);
+			return next;
+		});
+	}, []);
+	const bounds = (0, react.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 = (0, react.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 = (0, react.useCallback)((m) => {
+		setMonthState(m);
+		if (selectedDay != null && isDayOutOfRange(selectedYear, m, selectedDay, bounds)) setDayState(null);
+	}, [
+		selectedDay,
+		selectedYear,
+		bounds
+	]);
+	const setDay = (0, react.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: (0, react.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: (0, react.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: (0, react.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: (0, react.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: (0, react.useMemo)(() => {
@@ -4514,34 +4599,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 = (0, react.useMemo)(() => /* @__PURE__ */ new Date(), []);
-	const currentYear = today.getUTCFullYear();
-	const currentMonth = today.getUTCMonth();
-	const currentDay = today.getUTCDate();
+	const currentYear = bounds.today.getFullYear();
 	const availableYears = (0, react.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__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "flex-1 overflow-y-auto px-6 py-4",
@@ -4564,10 +4635,13 @@ function DrawerStepDate({ selectedYear, selectedMonth, selectedDay, onYearChange
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "grid grid-cols-3 gap-2",
 					children: availableYears.map((year) => {
+						const isActive = selectedYear === year;
+						const disabled = isYearDisabled(year);
 						return /* @__PURE__ */ (0, react_jsx_runtime.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);
 					})
@@ -4811,6 +4885,7 @@ function BundleSubscriptionsDrawer({ open, onOpenChange, subscriptions: subscrip
 	const { t } = useSubscriptionsTranslation();
 	const { isMobile } = require_sidebar.useSidebar();
 	const form = useBundleForm({
+		subscriptions: subscriptionList,
 		addresses,
 		paymentMethods,
 		defaultAddressId,
@@ -4855,7 +4930,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__ */ (0, react_jsx_runtime.jsx)(DrawerStepAddress, {
 				addresses,
@@ -5416,7 +5492,8 @@ function PauseSubscriptionDialog({ open, onOpenChange, onConfirm, isLoading, err
 	const { t, locale } = useSubscriptionsTranslation();
 	const [pauseType, setPauseType] = (0, react.useState)("indefinite");
 	const [selectedOrderCount, setSelectedOrderCount] = (0, react.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;
 	(0, react.useEffect)(() => {
 		if (!open) return;
@@ -5496,10 +5573,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__ */ (0, react_jsx_runtime.jsx)(require_src.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__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -8615,4 +8693,4 @@ Object.defineProperty(exports, "subscriptionsScreenPropertySchema", {
 	}
 });
 
-//# sourceMappingURL=SubscriptionsScreen-DPymXVC4.cjs.map
+//# sourceMappingURL=SubscriptionsScreen-9NJY-K63.cjs.map