@fluid-app/portal-sdk 0.1.206 → 0.1.208

package/dist/{SubscriptionsScreen-COOAJ8r5.mjs → SubscriptionsScreen-CuP9OfBI.mjs}

@@ -1,14 +1,14 @@
 import { r as __exportAll } from "./es-DmEK0Umf.mjs";
-import { C as subscriptions_skip, S as subscriptions_show, _ as subscriptions_cancel, b as subscriptions_reactivate, v as subscriptions_list, w as subscriptions_update, x as subscriptions_resume, y as subscriptions_pause } from "./portal_tenant-VLrtyCZ3.mjs";
+import { C as subscriptions_skip, S as subscriptions_show, _ as subscriptions_cancel, b as subscriptions_reactivate, v as subscriptions_list, w as subscriptions_update, x as subscriptions_resume, y as subscriptions_pause } from "./portal_tenant-Mu12SQA1.mjs";
 import { n as usePortalTenantClient } from "./PortalTenantClientProvider-4ZmY6hac.mjs";
-import { $t as startOfWeek, Bt as longFormatters, C as Skeleton, Cn as AlertDialogFooter, En as Button, Ht as getWeekYear, It as format, K as Label, Lt as isProtectedDayOfYearToken, Pn as cn$1, Qt as startOfISOWeek, Rt as isProtectedWeekYearToken, Sn as AlertDialogDescription, Tn as AlertDialogTitle, Ut as getISOWeek, Vt as getWeek, Wt as enUS, Zt as getTimezoneOffsetInMilliseconds, a as ToggleGroup, an as millisecondsInHour, b as fluidToast, bn as AlertDialogCancel, cn as Breadcrumb, ct as DialogFooter, d as Table$1, dn as BreadcrumbList, en as getDefaultOptions$1, f as TableBody, fn as BreadcrumbPage, ft as DialogTitle, g as TableRow, h as TableHeader, ht as PopoverTrigger, in as constructFrom, it as Dialog, jt as Calendar$1, ln as BreadcrumbItem, lt as DialogHeader, mt as PopoverContent, nn as addDays, o as ToggleGroupItem, on as millisecondsInMinute, ot as DialogContent, p as TableCell, pn as BreadcrumbSeparator, pt as Popover, rn as toDate, sn as millisecondsInSecond, un as BreadcrumbLink, vn as AlertDialog, wn as AlertDialogHeader, xn as AlertDialogContent, yn as AlertDialogAction, zt as warnOrThrowProtectedError } from "./src-BEx23d86.mjs";
+import { $t as startOfWeek, Bt as longFormatters, C as Skeleton, Cn as AlertDialogFooter, En as Button, Ht as getWeekYear, It as format, K as Label, L as Input, Lt as isProtectedDayOfYearToken, Pn as cn$1, Qt as startOfISOWeek, Rt as isProtectedWeekYearToken, Sn as AlertDialogDescription, Tn as AlertDialogTitle, Ut as getISOWeek, Vt as getWeek, Wt as enUS, Zt as getTimezoneOffsetInMilliseconds, a as ToggleGroup, an as millisecondsInHour, b as fluidToast, bn as AlertDialogCancel, cn as Breadcrumb, ct as DialogFooter, d as Table$1, dn as BreadcrumbList, en as getDefaultOptions$1, f as TableBody, fn as BreadcrumbPage, ft as DialogTitle, g as TableRow, h as TableHeader, ht as PopoverTrigger, in as constructFrom, it as Dialog, jt as Calendar$1, ln as BreadcrumbItem, lt as DialogHeader, mt as PopoverContent, nn as addDays, o as ToggleGroupItem, on as millisecondsInMinute, ot as DialogContent, p as TableCell, pn as BreadcrumbSeparator, pt as Popover, rn as toDate, sn as millisecondsInSecond, un as BreadcrumbLink, vn as AlertDialog, wn as AlertDialogHeader, xn as AlertDialogContent, yn as AlertDialogAction, zt as warnOrThrowProtectedError } from "./src-BEx23d86.mjs";
 import { r as useScreenHeaderBreadcrumbs } from "./ScreenHeaderContext-FYyYk97y.mjs";
 import { t as useAccount } from "./use-account-B16Tor2Q.mjs";
 import { n as useAppNavigation } from "./AppNavigationContext-BW3lSpfT.mjs";
 import { t as SearchSort } from "./SearchSort-TmuNOCwA.mjs";
 import { t as InfiniteScrollSentinel } from "./InfiniteScrollSentinel-BnPwh0Hr.mjs";
 import { r as TableColumn } from "./order-status-badge-BfOyK_Yi.mjs";
-import { createContext, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { CalendarIcon, Pause, Play, RotateCcw, SkipForward, XCircle } from "lucide-react";
@@ -2205,6 +2205,20 @@ function useReactivateSubscription(options) {
 	});
 }
 //#endregion
+//#region ../../subscriptions/core/src/hooks/use-update-subscription-info.ts
+function useUpdateSubscriptionInfo(options) {
+	const api = useSubscriptionsApi();
+	const queryClient = useQueryClient();
+	return useMutation({
+		mutationFn: (params) => api.updateSubscriptionInfo(params.subscriptionToken, params.body),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: subscriptionsKeys.all });
+			options?.onSuccess?.();
+		},
+		onError: options?.onError
+	});
+}
+//#endregion
 //#region ../../subscriptions/core/src/utils/subscription-helpers.ts
 function formatSubscriptionFrequency(frequency) {
 	if (frequency === "day") return "Daily";
@@ -2615,7 +2629,10 @@ function createPortalSubscriptionsAdapter(client) {
 			return mapSubscriptionDetail(await subscriptions_reactivate(client, subscriptionToken));
 		},
 		updateSubscriptionInfo: async (subscriptionToken, body) => {
-			return mapSubscriptionDetail(await subscriptions_update(client, subscriptionToken, { subscription: { payment_method_id: body.payment_method_id } }));
+			const subscription = {};
+			if (body.payment_method_id != null) subscription.payment_method_id = body.payment_method_id;
+			if (body.quantity != null) subscription.quantity = body.quantity;
+			return mapSubscriptionDetail(await subscriptions_update(client, subscriptionToken, { subscription }));
 		}
 	};
 }
@@ -3429,11 +3446,12 @@ function SubscriptionDetailSkeleton() {
 		})]
 	});
 }
-function SubscriptionItemsSection({ subscription }) {
+function SubscriptionItemsSection({ subscription, displayQuantity, canEditQuantity = false, onQuantityChange, isUpdatingQuantity = false }) {
 	const variant = subscription.variant;
 	const product = variant?.product;
-	const quantity = subscription.quantity;
+	const quantity = displayQuantity ?? subscription.quantity;
 	const totalPrice = formatCurrency(subscription.price * quantity);
+	const quantityInputId = `subscription-${subscription.subscription_token}-quantity`;
 	const discount = subscription.original_price != null ? subscription.original_price - subscription.price : 0;
 	const subtotal = discount > 0 ? formatCurrency(subscription.original_price * quantity) : totalPrice;
 	return /* @__PURE__ */ jsx("section", {
@@ -3474,9 +3492,9 @@ function SubscriptionItemsSection({ subscription }) {
 				}),
 				/* @__PURE__ */ jsx("div", {
 					className: "py-6",
-					children: /* @__PURE__ */ jsx("div", {
+					children: /* @__PURE__ */ jsxs("div", {
 						className: "flex flex-row items-center space-x-4",
-						children: /* @__PURE__ */ jsxs("div", {
+						children: [/* @__PURE__ */ jsxs("div", {
 							className: "flex min-w-0 flex-1 flex-row space-x-4",
 							children: [/* @__PURE__ */ jsx("div", {
 								className: "relative shrink-0",
@@ -3514,7 +3532,28 @@ function SubscriptionItemsSection({ subscription }) {
 									}) })
 								]
 							})]
-						})
+						}), canEditQuantity && onQuantityChange && /* @__PURE__ */ jsxs("div", {
+							className: "flex shrink-0 flex-col items-center",
+							children: [/* @__PURE__ */ jsx("label", {
+								htmlFor: quantityInputId,
+								className: "text-muted-foreground mb-1 text-xs",
+								children: "Quantity"
+							}), /* @__PURE__ */ jsx(Input, {
+								id: quantityInputId,
+								type: "number",
+								min: 1,
+								step: 1,
+								value: quantity || "",
+								onChange: (e) => {
+									if (!e.target.value) return;
+									const next = parseInt(e.target.value, 10);
+									if (Number.isFinite(next) && next > 0) onQuantityChange(next);
+								},
+								disabled: isUpdatingQuantity,
+								className: cn$1("border-border bg-background h-10 w-16 border text-center", isUpdatingQuantity && "cursor-not-allowed opacity-50"),
+								"aria-label": "Quantity"
+							})]
+						})]
 					})
 				}),
 				/* @__PURE__ */ jsxs("div", {
@@ -3814,6 +3853,44 @@ function SubscriptionDetail({ token, onNotFound, onError, onSuccess, onMutationE
 		onSuccess: () => onSuccess?.("Subscription reactivated"),
 		onError: (err) => onMutationError?.("Failed to reactivate subscription", err)
 	});
+	const [pendingQuantity, setPendingQuantity] = useState(null);
+	const quantityDebounceRef = useRef(null);
+	const quantityMutation = useUpdateSubscriptionInfo({
+		onSuccess: () => {
+			onSuccess?.("Quantity updated");
+		},
+		onError: (err) => {
+			setPendingQuantity(null);
+			onMutationError?.("Failed to update quantity", err);
+		}
+	});
+	const serverQuantity = data?.subscription.quantity;
+	useEffect(() => {
+		if (pendingQuantity != null && serverQuantity === pendingQuantity) setPendingQuantity(null);
+	}, [pendingQuantity, serverQuantity]);
+	useEffect(() => () => {
+		if (quantityDebounceRef.current) clearTimeout(quantityDebounceRef.current);
+	}, []);
+	const quantityMutate = quantityMutation.mutate;
+	const handleQuantityChange = useCallback((next) => {
+		const clamped = Math.max(1, next);
+		setPendingQuantity(clamped);
+		if (quantityDebounceRef.current) clearTimeout(quantityDebounceRef.current);
+		quantityDebounceRef.current = setTimeout(() => {
+			if (clamped === data?.subscription.quantity) {
+				setPendingQuantity(null);
+				return;
+			}
+			quantityMutate({
+				subscriptionToken: token,
+				body: { quantity: clamped }
+			});
+		}, 500);
+	}, [
+		data?.subscription.quantity,
+		quantityMutate,
+		token
+	]);
 	const onErrorRef = useRef(onError);
 	onErrorRef.current = onError;
 	const onNotFoundRef = useRef(onNotFound);
@@ -3878,7 +3955,13 @@ function SubscriptionDetail({ token, onNotFound, onError, onSuccess, onMutationE
 	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsxs("div", {
 			className: "flex flex-col lg:grid lg:grid-cols-8",
-			children: [/* @__PURE__ */ jsx(SubscriptionItemsSection, { subscription }), /* @__PURE__ */ jsx(SubscriptionManagementSection, {
+			children: [/* @__PURE__ */ jsx(SubscriptionItemsSection, {
+				subscription,
+				displayQuantity: pendingQuantity ?? void 0,
+				canEditQuantity: isActive,
+				onQuantityChange: handleQuantityChange,
+				isUpdatingQuantity: quantityMutation.isPending
+			}), /* @__PURE__ */ jsx(SubscriptionManagementSection, {
 				subscription,
 				isActive,
 				isPaused,
@@ -4026,4 +4109,4 @@ const subscriptionsScreenPropertySchema = {
 //#endregion
 export { SubscriptionsScreen_exports as n, subscriptionsScreenPropertySchema as r, SubscriptionsScreen as t };
 
-//# sourceMappingURL=SubscriptionsScreen-COOAJ8r5.mjs.map
+//# sourceMappingURL=SubscriptionsScreen-CuP9OfBI.mjs.map