@fluid-app/portal-sdk 0.1.199 → 0.1.201

package/dist/{PortalContentApiProvider-CWRAw9kL.mjs → PortalContentApiProvider-CzLqEN5C.mjs}

@@ -1,7 +1,7 @@
 import { t as useDropzone } from "./es-BeIE2Uzn.mjs";
 import { A as playlists_update, C as playlists_create, D as playlists_items_remove, E as playlists_items_list, M as shares_list, O as playlists_list, T as playlists_items_add, _ as media_products_add, a as content_playlists_metrics_share_visits, b as media_show, c as dam_asset_paths_list, d as dam_assets_discard, f as dam_assets_list, g as media_list, h as media_destroy, i as content_pages_metrics_visits, j as shares_create, k as playlists_show, l as dam_assets_create, m as media_create, n as content_media_metrics_visits, o as content_playlists_metrics_visits, p as dam_query, r as content_pages_metrics_share_visits, s as dam_asset_paths_create, t as content_media_metrics_share_visits, u as dam_assets_destroy, v as media_products_list, w as playlists_destroy, x as media_update, y as media_products_remove } from "./portal_tenant_content-DzIQtSLE.mjs";
 import { n as usePortalTenantClient } from "./PortalTenantClientProvider-4ZmY6hac.mjs";
-import { $ as DropdownMenuSeparator, $t as BreadcrumbPage, A as Select, At as Checkbox, B as Form, C as Skeleton, Et as CardContent, G as FormMessage, H as FormField, J as DropdownMenuContent, K as Label, L as Input, M as SelectItem, N as SelectTrigger, P as SelectValue, Qt as BreadcrumbList, S as Slider, U as FormItem, V as FormControl, W as FormLabel, Xt as BreadcrumbItem, Y as DropdownMenuItem, Yt as Breadcrumb, Zt as BreadcrumbLink, _ as Switch, an as AlertDialog, bn as useZodForm, c as Tabs, cn as AlertDialogContent, ct as DialogFooter, dn as AlertDialogHeader, dt as DialogPortal, en as BreadcrumbSeparator, et as DropdownMenuSub, fn as AlertDialogTitle, ft as DialogTitle, ht as PopoverTrigger, i as TooltipTrigger, it as Dialog, j as SelectContent, k as Separator, l as TabsList, ln as AlertDialogDescription, lt as DialogHeader, mn as Content, mt as PopoverContent, n as TooltipContent, nt as DropdownMenuSubTrigger, on as AlertDialogAction, ot as DialogContent, pn as Button, pt as Popover, q as DropdownMenu, r as TooltipProvider, rt as DropdownMenuTrigger, s as Textarea, sn as AlertDialogCancel, st as DialogDescription, t as Tooltip, tn as Badge, tt as DropdownMenuSubContent, u as TabsTrigger, un as AlertDialogFooter, ut as DialogOverlay, wt as Card, xn as cn, y as Spinner } from "./src-BTbz18gY.mjs";
+import { $ as DropdownMenuSeparator, $t as BreadcrumbPage, A as Select, At as Checkbox, B as Form, C as Skeleton, Et as CardContent, G as FormMessage, H as FormField, J as DropdownMenuContent, K as Label, L as Input, M as SelectItem, N as SelectTrigger, P as SelectValue, Qt as BreadcrumbList, S as Slider, U as FormItem, V as FormControl, W as FormLabel, Xt as BreadcrumbItem, Y as DropdownMenuItem, Yt as Breadcrumb, Zt as BreadcrumbLink, _ as Switch, an as AlertDialog, bn as useZodForm, c as Tabs, cn as AlertDialogContent, dn as AlertDialogHeader, dt as DialogPortal, en as BreadcrumbSeparator, et as DropdownMenuSub, fn as AlertDialogTitle, ft as DialogTitle, ht as PopoverTrigger, i as TooltipTrigger, it as Dialog, j as SelectContent, k as Separator, l as TabsList, ln as AlertDialogDescription, lt as DialogHeader, mn as Content, mt as PopoverContent, n as TooltipContent, nt as DropdownMenuSubTrigger, on as AlertDialogAction, ot as DialogContent, pn as Button, pt as Popover, q as DropdownMenu, r as TooltipProvider, rt as DropdownMenuTrigger, s as Textarea, sn as AlertDialogCancel, st as DialogDescription, t as Tooltip, tn as Badge, tt as DropdownMenuSubContent, u as TabsTrigger, un as AlertDialogFooter, ut as DialogOverlay, wt as Card, xn as cn, y as Spinner } from "./src-BTbz18gY.mjs";
 import { n as useScreenHeaderActions, r as useScreenHeaderBreadcrumbs } from "./ScreenHeaderContext-BD6Zo-ep.mjs";
 import { a as useEditor, o as Placeholder, r as EditorContent, t as StarterKit } from "./dist-tv6N_HgZ.mjs";
 import { t as SearchSort } from "./SearchSort-TmRTxK16.mjs";
@@ -617,7 +617,7 @@ function ProductsScreen({ countryCode, fetchProducts: fetchPortalProducts, onNav
 	}, [handleIntersect]);
 	const products = useMemo(() => {
 		if (!data) return [];
-		if (usePortal) return data?.pages.flatMap((page) => page.products.map((p) => ({
+		if (usePortal) return data?.pages.flatMap((page) => (page.products ?? []).map((p) => ({
 			id: p.id ?? 0,
 			title: p.name ?? "",
 			image_url: p.images?.[0]?.url ?? null,
@@ -8937,6 +8937,7 @@ function PlaylistsListingScreen(_props) {
 	const [sortValue, setSortValue] = useState("title");
 	const [ownerFilter, setOwnerFilter] = useState("all");
 	const [selectedIds, setSelectedIds] = useState(/* @__PURE__ */ new Set());
+	const [pendingDeleteId, setPendingDeleteId] = useState(null);
 	useEffect(() => {
 		setSelectedIds(/* @__PURE__ */ new Set());
 	}, [ownerFilter]);
@@ -9068,27 +9069,31 @@ function PlaylistsListingScreen(_props) {
 	const handleEdit = useCallback((playlistId) => {
 		navigate(`playlists/${playlistId}/edit`);
 	}, [navigate]);
-	const handleDelete = useCallback(async (playlistId) => {
-		if (!onDeletePlaylist) return;
-		if (!window.confirm("Are you sure you want to delete this playlist?")) return;
-		try {
-			await onDeletePlaylist(playlistId);
+	const { mutate: deletePlaylist, isPending: isDeleting } = useMutation({
+		mutationFn: (playlistId) => {
+			if (!onDeletePlaylist) return Promise.reject(/* @__PURE__ */ new Error("Delete not available"));
+			return onDeletePlaylist(playlistId);
+		},
+		onSuccess: () => {
 			queryClient.invalidateQueries({ queryKey: shareablesKeys.playlists.all });
 			showToast({
 				title: "Playlist deleted",
 				type: "success"
 			});
-		} catch {
+			setPendingDeleteId(null);
+		},
+		onError: (error) => {
 			showToast({
 				title: "Failed to delete playlist",
-				type: "error"
+				type: "error",
+				error
 			});
+			setPendingDeleteId(null);
 		}
-	}, [
-		onDeletePlaylist,
-		queryClient,
-		showToast
-	]);
+	});
+	const confirmDelete = useCallback(() => {
+		if (pendingDeleteId != null) deletePlaylist(pendingDeleteId);
+	}, [pendingDeleteId, deletePlaylist]);
 	if (isLoading) return /* @__PURE__ */ jsxs("div", {
 		className: "space-y-6 px-4 py-4 md:px-10 md:py-6",
 		children: [/* @__PURE__ */ jsxs("div", {
@@ -9176,7 +9181,7 @@ function PlaylistsListingScreen(_props) {
 						onSelectionChange: (selected) => handleToggleSelection(playlist.id, selected),
 						onToggleFavorite: onToggleFavorite ? () => handleFavorite(playlist.id) : void 0,
 						onEdit: () => handleEdit(playlist.id),
-						onDelete: onDeletePlaylist ? () => void handleDelete(playlist.id) : void 0
+						onDelete: onDeletePlaylist ? () => setPendingDeleteId(playlist.id) : void 0
 					}, playlist.id);
 				})
 			}),
@@ -9191,6 +9196,24 @@ function PlaylistsListingScreen(_props) {
 			error && /* @__PURE__ */ jsxs("p", {
 				className: "bg-destructive/10 text-destructive rounded-lg px-3 py-2",
 				children: ["Error: ", error.message]
+			}),
+			/* @__PURE__ */ jsx(AlertDialog, {
+				open: pendingDeleteId !== null,
+				onOpenChange: (open) => {
+					if (!open && !isDeleting) setPendingDeleteId(null);
+				},
+				children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete this playlist?" }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: "This removes the playlist from your library. Shared links that point to it will stop working." })] }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
+					disabled: isDeleting,
+					children: "Cancel"
+				}), /* @__PURE__ */ jsx(AlertDialogAction, {
+					onClick: (e) => {
+						e.preventDefault();
+						confirmDelete();
+					},
+					disabled: isDeleting,
+					className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+					children: isDeleting ? /* @__PURE__ */ jsx(Spinner, { className: "size-4" }) : "Delete"
+				})] })] })
 			})
 		]
 	});
@@ -9276,7 +9299,7 @@ function TaggedProductsList({ products, onProductClick }) {
 					const displayPrice = resolvePrice(product);
 					return /* @__PURE__ */ jsxs("button", {
 						onClick: (e) => handleProductClick(product.id, e),
-						className: "group bg-muted hover:bg-muted-600 flex w-[168px] shrink-0 flex-col gap-2 rounded-lg p-3 text-left transition-all",
+						className: "group bg-muted hover:bg-muted/60 flex w-[168px] shrink-0 flex-col gap-2 rounded-lg p-3 text-left transition-all",
 						children: [/* @__PURE__ */ jsx("div", {
 							className: "bg-background relative h-[168px] w-full overflow-hidden rounded-lg",
 							children: renderImage({
@@ -9378,7 +9401,7 @@ function PlaylistItemsList({ items, onSelectItem, selectedItemIndex = 0, onNavig
 				const fileType = getFileType(item.media_format ?? relateable?.media_format, item.image_url ?? relateable?.image_url);
 				return /* @__PURE__ */ jsxs("div", {
 					onClick: () => handleCardClick(index),
-					className: `hover:bg-muted-600 flex w-full cursor-pointer items-start gap-3 rounded-lg p-3 text-left transition-all ${index === selectedItemIndex ? "bg-muted-600" : "bg-muted"}`,
+					className: `hover:bg-muted/60 flex w-full cursor-pointer items-start gap-3 rounded-lg p-3 text-left transition-all ${index === selectedItemIndex ? "bg-muted/60" : "bg-muted"}`,
 					children: [/* @__PURE__ */ jsxs("div", {
 						className: "bg-background relative h-[104px] w-[104px] shrink-0 overflow-hidden rounded-lg",
 						children: [renderImage({
@@ -9458,11 +9481,9 @@ function PlaylistItemsList({ items, onSelectItem, selectedItemIndex = 0, onNavig
 const DEFAULT_IMAGE$1 = "https://assets.fluid.app/fluid-admin/images/we-commerce/we-commerce.png";
 function PlaylistDetailScreen({ playlistId, onNavigate }) {
 	const api = useShareablesApi();
-	const { navigate, showToast, onDeletePlaylist, user, readOnly } = useShareablesUI();
+	const { navigate, user, readOnly } = useShareablesUI();
 	const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false);
 	const [selectedPlaylistItemIndex, setSelectedPlaylistItemIndex] = useState(0);
-	const [isDeleteOpen, setIsDeleteOpen] = useState(false);
-	const [isDeleting, setIsDeleting] = useState(false);
 	const { data: playlistResponse, isLoading } = useQuery({
 		queryKey: shareablesKeys.playlists.detail(Number(playlistId)),
 		queryFn: () => api.playlists.getPlaylistById(Number(playlistId))
@@ -9473,25 +9494,19 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
 	const displayTitle = playlist?.title || "";
 	useScreenHeaderActions(useMemo(() => {
 		if (!canEdit) return null;
-		return /* @__PURE__ */ jsxs("div", {
+		return /* @__PURE__ */ jsx("div", {
 			className: "flex items-center gap-2",
-			children: [/* @__PURE__ */ jsxs(Button, {
+			children: /* @__PURE__ */ jsxs(Button, {
 				variant: "outline",
 				size: "sm",
 				onClick: () => navigate(`playlists/${playlistId}/edit`),
 				children: [/* @__PURE__ */ jsx(Pencil, { className: "mr-1 h-3.5 w-3.5" }), "Edit"]
-			}), onDeletePlaylist && /* @__PURE__ */ jsxs(Button, {
-				variant: "destructive",
-				size: "sm",
-				onClick: () => setIsDeleteOpen(true),
-				children: [/* @__PURE__ */ jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), "Delete"]
-			})]
+			})
 		});
 	}, [
 		canEdit,
 		navigate,
-		playlistId,
-		onDeletePlaylist
+		playlistId
 	]));
 	useScreenHeaderBreadcrumbs(useMemo(() => /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsxs(BreadcrumbList, {
 		className: "text-lg",
@@ -9511,31 +9526,6 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
 			}) })
 		]
 	}) }), [displayTitle, navigate]));
-	const handleDelete = useCallback(async () => {
-		if (!onDeletePlaylist) return;
-		setIsDeleting(true);
-		try {
-			await onDeletePlaylist(Number(playlistId));
-			showToast({
-				title: "Playlist deleted successfully",
-				type: "success"
-			});
-			navigate("playlists");
-		} catch {
-			showToast({
-				title: "Failed to delete playlist",
-				type: "error"
-			});
-		} finally {
-			setIsDeleting(false);
-			setIsDeleteOpen(false);
-		}
-	}, [
-		onDeletePlaylist,
-		playlistId,
-		showToast,
-		navigate
-	]);
 	const selectedPlaylistItem = playlist?.items?.[selectedPlaylistItemIndex];
 	const displayImage = selectedPlaylistItem?.image_url ?? selectedPlaylistItem?.relateable?.image_url ?? selectedPlaylistItem?.relateable?.compressed_image_url ?? DEFAULT_IMAGE$1;
 	const strippedDescription = stripTags(playlist?.description || playlist?.search_engine_optimizer?.description || "");
@@ -9555,9 +9545,9 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
 			children: "Playlist not found or failed to load."
 		})
 	});
-	return /* @__PURE__ */ jsxs("div", {
+	return /* @__PURE__ */ jsx("div", {
 		className: "flex flex-col gap-4 px-4 py-4 md:px-10 md:py-6",
-		children: [/* @__PURE__ */ jsxs("div", {
+		children: /* @__PURE__ */ jsxs("div", {
 			className: "mx-auto flex w-full max-w-[480px] flex-col gap-6 md:h-[calc(100vh-140px)] md:max-w-none md:flex-row",
 			children: [/* @__PURE__ */ jsx("div", {
 				className: "aspect-square w-full md:aspect-auto md:h-full",
@@ -9625,21 +9615,7 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
 					})
 				]
 			})]
-		}), /* @__PURE__ */ jsx(Dialog, {
-			open: isDeleteOpen,
-			onOpenChange: setIsDeleteOpen,
-			children: /* @__PURE__ */ jsxs(DialogContent, { children: [/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Delete Playlist" }), /* @__PURE__ */ jsx(DialogDescription, { children: "Are you sure you want to delete this playlist? This action cannot be undone." })] }), /* @__PURE__ */ jsxs(DialogFooter, { children: [/* @__PURE__ */ jsx(Button, {
-				variant: "outline",
-				onClick: () => setIsDeleteOpen(false),
-				disabled: isDeleting,
-				children: "Cancel"
-			}), /* @__PURE__ */ jsx(Button, {
-				variant: "destructive",
-				onClick: () => void handleDelete(),
-				disabled: isDeleting,
-				children: isDeleting ? "Deleting..." : "Delete"
-			})] })] })
-		})]
+		})
 	});
 }
 //#endregion
@@ -9838,19 +9814,30 @@ function PlaylistFormHeader({ playlistId, isEditMode, onSubmit, isSaving }) {
 	};
 	useScreenHeaderActions(useMemo(() => /* @__PURE__ */ jsxs("div", {
 		className: "flex items-center gap-2",
-		children: [playlistId && onDeletePlaylist && /* @__PURE__ */ jsxs(Button, {
-			variant: "destructive",
-			size: "sm",
-			onClick: () => setIsDeleteOpen(true),
-			disabled: isMutating,
-			children: [/* @__PURE__ */ jsx(Trash2, { className: "mr-1 h-4 w-4" }), "Delete"]
-		}), /* @__PURE__ */ jsx(Button, {
+		children: [playlistId && onDeletePlaylist && /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "outline",
+				size: "sm",
+				className: "h-8 w-8 p-0",
+				"aria-label": "Playlist actions",
+				disabled: isMutating,
+				children: /* @__PURE__ */ jsx(MoreVertical, { className: "h-4 w-4" })
+			})
+		}), /* @__PURE__ */ jsx(DropdownMenuContent, {
+			align: "end",
+			children: /* @__PURE__ */ jsxs(DropdownMenuItem, {
+				onClick: () => setIsDeleteOpen(true),
+				className: "text-destructive focus:text-destructive",
+				children: [/* @__PURE__ */ jsx(Trash2, { className: "mr-2 h-4 w-4" }), "Delete"]
+			})
+		})] }), /* @__PURE__ */ jsx(Button, {
 			onClick: () => {
 				onSubmit().catch(() => {});
 			},
 			disabled: isMutating || !isDirty || !isFormValid,
 			size: "sm",
-			children: isSaving ? "Saving..." : "Save"
+			children: isSaving ? /* @__PURE__ */ jsx(Spinner, { className: "size-4" }) : "Save"
 		})]
 	}), [
 		playlistId,
@@ -9879,19 +9866,22 @@ function PlaylistFormHeader({ playlistId, isEditMode, onSubmit, isSaving }) {
 			}) })
 		]
 	}) }), [isEditMode, navigate]));
-	return /* @__PURE__ */ jsx(Dialog, {
+	return /* @__PURE__ */ jsx(AlertDialog, {
 		open: isDeleteOpen,
-		onOpenChange: setIsDeleteOpen,
-		children: /* @__PURE__ */ jsxs(DialogContent, { children: [/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Delete Playlist" }), /* @__PURE__ */ jsx(DialogDescription, { children: "Are you sure you want to delete this playlist? This action cannot be undone." })] }), /* @__PURE__ */ jsxs(DialogFooter, { children: [/* @__PURE__ */ jsx(Button, {
-			variant: "outline",
-			onClick: () => setIsDeleteOpen(false),
+		onOpenChange: (open) => {
+			if (!open && !isDeleting) setIsDeleteOpen(false);
+		},
+		children: /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: "Delete this playlist?" }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: "This removes the playlist from your library. Shared links that point to it will stop working." })] }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, {
 			disabled: isDeleting,
 			children: "Cancel"
-		}), /* @__PURE__ */ jsx(Button, {
-			variant: "destructive",
-			onClick: () => void handleDelete(),
+		}), /* @__PURE__ */ jsx(AlertDialogAction, {
+			onClick: (e) => {
+				e.preventDefault();
+				handleDelete();
+			},
 			disabled: isDeleting,
-			children: isDeleting ? "Deleting..." : "Delete"
+			className: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+			children: isDeleting ? /* @__PURE__ */ jsx(Spinner, { className: "size-4" }) : "Delete"
 		})] })] })
 	});
 }
@@ -10452,6 +10442,42 @@ function PlaylistFormContent({ playlistId, playlist, isEditMode, itemsToUse, onB
 	const { form, updateField, validateForm } = usePlaylistForm();
 	const playlistTitle = form.title || "";
 	const slugValue = form.slug ?? "";
+	useScreenHeaderBreadcrumbs(useMemo(() => /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsxs(BreadcrumbList, {
+		className: "text-lg",
+		children: [/* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbLink, {
+			href: "#",
+			onClick: (e) => {
+				e.preventDefault();
+				(onBack ?? (() => navigate("playlists")))();
+			},
+			children: "Playlists"
+		}) }), isEditMode ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			/* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
+			/* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbLink, {
+				href: "#",
+				onClick: (e) => {
+					e.preventDefault();
+					navigate(`playlists/${playlistId}`);
+				},
+				className: "block max-w-[40vw] truncate align-bottom md:max-w-[60ch]",
+				children: playlistTitle || "Playlist"
+			}) }),
+			/* @__PURE__ */ jsx(BreadcrumbSeparator, {}),
+			/* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbPage, {
+				className: "font-semibold",
+				children: "Edit"
+			}) })
+		] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(BreadcrumbSeparator, {}), /* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbPage, {
+			className: "font-semibold",
+			children: "New Playlist"
+		}) })] })]
+	}) }), [
+		isEditMode,
+		playlistTitle,
+		onBack,
+		navigate,
+		playlistId
+	]));
 	useEffect(() => {
 		const isCustomSlug = form.custom_slug || playlist?.custom_slug || false;
 		if (playlistTitle && !isCustomSlug) {
@@ -11924,4 +11950,4 @@ function PortalContentApiProvider({ children }) {
 //#endregion
 export { ShareablesApp as a, ShareablesCoreProvider as c, ProductsApp as i, usePortalContentContext as n, useFilePickerApi as o, toggleFavorite as r, ShareablesUIProvider as s, PortalContentApiProvider as t };
 
-//# sourceMappingURL=PortalContentApiProvider-CWRAw9kL.mjs.map
+//# sourceMappingURL=PortalContentApiProvider-CzLqEN5C.mjs.map