@fluid-app/portal-sdk 0.1.131 → 0.1.133

package/dist/{src-k03GJfKt.mjs → src-DcIV4Mpe.mjs}

@@ -1,11 +1,11 @@
+import { t as useDropzone } from "./es-CTLNkiWp.mjs";
 import { $ as Dialog, A as SelectContent, B as FormItem, G as DropdownMenuContent, Gt as BreadcrumbItem, H as FormMessage, J as DropdownMenuSeparator, Jt as BreadcrumbPage, K as DropdownMenuItem, Kt as BreadcrumbLink, L as Form, M as SelectTrigger, N as SelectValue, O as Separator, P as Input, Q as DropdownMenuTrigger, R as FormControl, Tt as Checkbox, U as Label, V as FormLabel, W as DropdownMenu, Wt as Breadcrumb, X as DropdownMenuSubContent, Xt as Badge, Y as DropdownMenuSub, Yt as BreadcrumbSeparator, Z as DropdownMenuSubTrigger, _n as cn, at as DialogOverlay, b as Slider, ct as Popover, g as Switch, gn as useZodForm, i as TooltipTrigger, it as DialogHeader, j as SelectItem, k as Select, ln as Button, lt as PopoverContent, n as TooltipContent, nt as DialogDescription, ot as DialogPortal, qt as BreadcrumbList, r as TooltipProvider, rt as DialogFooter, st as DialogTitle, t as Tooltip, tt as DialogContent, un as Content, ut as PopoverTrigger, v as Spinner, x as Skeleton, xt as CardContent, yt as Card, z as FormField } from "./src-Duo2Iuw-.mjs";
 import { n as useScreenHeaderActions, r as useScreenHeaderBreadcrumbs } from "./ScreenHeaderContext-CrdfLGKk.mjs";
 import { a as useEditor, o as Placeholder, r as EditorContent, t as StarterKit } from "./dist-CMGXkSgZ.mjs";
-import { t as useDropzone } from "./es-BcjHf1ZX.mjs";
-import { n as TextAlign, t as Underline } from "./dist-B1HwSrso.mjs";
-import { a as verticalListSortingStrategy, c as PointerSensor, d as useSensors, f as CSS, i as useSortable, l as closestCenter, n as arrayMove, o as DndContext, r as sortableKeyboardCoordinates, s as KeyboardSensor, t as SortableContext, u as useSensor } from "./sortable.esm-DSrWP4x9.mjs";
+import { n as TextAlign, t as Underline } from "./dist-CayuD99K.mjs";
+import { a as verticalListSortingStrategy, c as PointerSensor, d as useSensors, f as CSS, i as useSortable, l as closestCenter, n as arrayMove, o as DndContext, r as sortableKeyboardCoordinates, s as KeyboardSensor, t as SortableContext, u as useSensor } from "./sortable.esm-BzPsVjTI.mjs";
 import React, { PureComponent, createContext, createRef, forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
-import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { keepPreviousData, useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import * as z$1 from "zod";
 import { z } from "zod";
@@ -1371,15 +1371,20 @@ function MediaListingScreen({ onNavigate }) {
 	const { data, isLoading, isFetchingNextPage, hasNextPage, fetchNextPage, error } = useInfiniteQuery({
 		queryKey: shareablesKeys.media.list(debouncedSearch, sortDesc, repContext),
 		queryFn: async ({ pageParam = 1 }) => {
-			return (await api.media.getMedia({
+			const response = await api.media.getMedia({
 				page: pageParam,
 				per_page: PAGE_SIZE$2,
 				search_query: debouncedSearch || void 0,
 				sorted_by: sortDesc ? "title_desc" : "title_asc"
-			})).media;
+			});
+			return {
+				media: response.media,
+				nextPage: response.meta?.next ?? null
+			};
 		},
-		getNextPageParam: (lastPage, allPages) => lastPage.length === PAGE_SIZE$2 ? allPages.length + 1 : void 0,
-		initialPageParam: 1
+		getNextPageParam: (lastPage) => lastPage.nextPage ?? void 0,
+		initialPageParam: 1,
+		placeholderData: keepPreviousData
 	});
 	const handleIntersect = useCallback((entries) => {
 		if (entries[0]?.isIntersecting && hasNextPage && !isFetchingNextPage) fetchNextPage();
@@ -1398,7 +1403,7 @@ function MediaListingScreen({ onNavigate }) {
 		observer.observe(target);
 		return () => observer.disconnect();
 	}, [handleIntersect]);
-	const mediaItems = data?.pages.flat() ?? [];
+	const mediaItems = data?.pages.flatMap((page) => page.media) ?? [];
 	if (isLoading) return /* @__PURE__ */ jsxs("div", {
 		className: "space-y-6 px-4 py-4 md:px-10 md:py-6",
 		children: [/* @__PURE__ */ jsxs("div", {
@@ -6823,7 +6828,8 @@ function PlaylistsListingScreen(_props) {
 	const observerTarget = useRef(null);
 	const sortParam = currentSort.sortDirection === "desc" ? `-${currentSort.sortBy}` : currentSort.sortBy;
 	const queryKey = [
-		"shareables-playlists",
+		...shareablesKeys.playlists.all,
+		"list",
 		debouncedSearch,
 		sortParam
 	];
@@ -6842,7 +6848,8 @@ function PlaylistsListingScreen(_props) {
 			};
 		},
 		getNextPageParam: (lastPage) => lastPage.nextCursor ?? void 0,
-		initialPageParam: void 0
+		initialPageParam: void 0,
+		placeholderData: keepPreviousData
 	});
 	const allPlaylists = useMemo(() => data?.pages.flatMap((page) => page.playlists) ?? [], [data?.pages]);
 	useEffect(() => {
@@ -6920,7 +6927,7 @@ function PlaylistsListingScreen(_props) {
 			});
 		},
 		onSettled: () => {
-			queryClient.invalidateQueries({ queryKey: ["shareables-playlists"] });
+			queryClient.invalidateQueries({ queryKey: shareablesKeys.playlists.all });
 		}
 	});
 	const handleFavorite = useCallback((playlistId) => {
@@ -6939,7 +6946,7 @@ function PlaylistsListingScreen(_props) {
 		if (!window.confirm("Are you sure you want to delete this playlist?")) return;
 		try {
 			await onDeletePlaylist(playlistId);
-			queryClient.invalidateQueries({ queryKey: ["shareables-playlists"] });
+			queryClient.invalidateQueries({ queryKey: shareablesKeys.playlists.all });
 			showToast({
 				title: "Playlist deleted",
 				type: "success"
@@ -6999,8 +7006,8 @@ function PlaylistsListingScreen(_props) {
 				className: GRID_CLASS$1,
 				children: allPlaylists.map((playlist) => {
 					const firstItem = playlist.items?.[0];
-					const imageUrl = playlist.image_url || firstItem?.relateable?.image_url || firstItem?.relateable?.compressed_image_url;
-					const itemCount = playlist.items?.length ?? 0;
+					const imageUrl = playlist.image_url ?? firstItem?.image_url ?? firstItem?.relateable?.image_url ?? firstItem?.relateable?.compressed_image_url;
+					const itemCount = playlist.items_count ?? playlist.items?.length ?? 0;
 					const canEdit = !readOnly && playlist.user_id === user?.id;
 					return /* @__PURE__ */ jsx(PlaylistCard, {
 						title: playlist.title || "Untitled Playlist",
@@ -7209,17 +7216,18 @@ function PlaylistItemsList({ items, onSelectItem, selectedItemIndex = 0, onNavig
 			className: "space-y-3",
 			children: items.map((item, index) => {
 				const relateable = item.relateable;
-				const imageUrl = relateable?.image_url || relateable?.compressed_image_url || DEFAULT_IMAGE$2;
-				const title = relateable?.title || "Untitled";
+				const imageUrl = item.image_url ?? relateable?.image_url ?? relateable?.compressed_image_url ?? DEFAULT_IMAGE$2;
+				const title = item.title ?? relateable?.title ?? "Untitled";
 				const rawPrice = relateable?.display_price || relateable?.price;
 				const price = rawPrice && parseFloat(rawPrice.replace(/[^0-9.-]/g, "")) > 0 ? rawPrice : null;
-				const itemType = getItemType(item.relateable_type, relateable?.kind);
-				const isVideo = relateable?.kind === "video";
-				const isImage = relateable?.kind === "image";
+				const kind = item.kind ?? relateable?.kind;
+				const itemType = getItemType(item.relateable_type, kind);
+				const isVideo = kind === "video";
+				const isImage = kind === "image";
 				const isProduct = item.relateable_type === "Product";
 				const isNavigable = NAVIGABLE_RELATEABLE_TYPES.has(item.relateable_type ?? "");
-				const videoLength = formatVideoLength(relateable?.duration);
-				const fileType = getFileType(relateable?.media_format, relateable?.image_url);
+				const videoLength = formatVideoLength(item.duration ?? relateable?.duration);
+				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"}`,
@@ -7381,11 +7389,12 @@ function PlaylistDetailScreen({ playlistId, onNavigate }) {
 		navigate
 	]);
 	const selectedPlaylistItem = playlist?.items?.[selectedPlaylistItemIndex];
-	const displayImage = selectedPlaylistItem?.relateable?.image_url || selectedPlaylistItem?.relateable?.compressed_image_url || DEFAULT_IMAGE$1;
+	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 || "");
 	const shouldShowReadMore = strippedDescription.length > 150;
-	const displayVideo = selectedPlaylistItem?.relateable?.kind === "video" ? selectedPlaylistItem?.relateable?.video_url || void 0 : void 0;
-	const isVideo = selectedPlaylistItem?.relateable?.kind === "video" && !!displayVideo;
+	const selectedKind = selectedPlaylistItem?.kind ?? selectedPlaylistItem?.relateable?.kind;
+	const displayVideo = selectedKind === "video" ? selectedPlaylistItem?.video_url ?? selectedPlaylistItem?.relateable?.video_url ?? void 0 : void 0;
+	const isVideo = selectedKind === "video" && !!displayVideo;
 	const taggedProducts = playlist?.items?.filter((item) => item.relateable_type === "Product").map((item) => item.relateable).filter((p) => !!p) || [];
 	if (isLoading) return /* @__PURE__ */ jsx("div", {
 		className: "flex items-center justify-center py-16",
@@ -8014,7 +8023,9 @@ function SortableTable({ items, setItems, onDeleteItem, isDeletePending, enableR
 		relateable_id: item.relateable?.id,
 		relateable: item.relateable,
 		order: index + 1,
-		title: item.relateable?.title || `${item.relateable_type} #${item.relateable?.id}`
+		title: item.title ?? item.relateable?.title ?? `${item.relateable_type} #${item.relateable?.id}`,
+		image_url: item.image_url ?? item.relateable?.image_url ?? null,
+		kind: item.kind ?? item.relateable?.kind ?? null
 	}));
 	const tableContent = /* @__PURE__ */ jsx("div", {
 		className: "border-border w-full overflow-x-auto rounded-lg border",
@@ -8065,8 +8076,8 @@ function SortableTable({ items, setItems, onDeleteItem, isDeletePending, enableR
 								className: "flex min-w-0 items-center gap-3",
 								children: [/* @__PURE__ */ jsx("div", {
 									className: "bg-muted flex h-8 w-8 shrink-0 items-center justify-center overflow-hidden rounded",
-									children: row.relateable?.image_url ? /* @__PURE__ */ jsx("img", {
-										src: String(row.relateable.image_url),
+									children: row.image_url ? /* @__PURE__ */ jsx("img", {
+										src: String(row.image_url),
 										alt: String(row.title),
 										className: "h-full w-full object-cover"
 									}) : getItemIcon(row.relateable_type || "")
@@ -8083,7 +8094,7 @@ function SortableTable({ items, setItems, onDeleteItem, isDeletePending, enableR
 							className: "px-6 py-4 whitespace-nowrap",
 							children: /* @__PURE__ */ jsx("div", {
 								className: "bg-muted text-foreground inline-flex items-center gap-1 rounded-full px-2 py-1 text-xs",
-								children: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(typeBadgeIcon(row.relateable_type || "", row.relateable?.kind || ""), { className: "h-3 w-3 shrink-0" }), getTypeDisplay(row.relateable_type || "", row.relateable?.kind || "")] })
+								children: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(typeBadgeIcon(row.relateable_type || "", row.kind || ""), { className: "h-3 w-3 shrink-0" }), getTypeDisplay(row.relateable_type || "", row.kind || "")] })
 							})
 						}),
 						/* @__PURE__ */ jsx("td", {
@@ -8879,4 +8890,4 @@ function ProductsApp({ countryCode, companyLogoUrl, fetchProducts, fetchProduct,
 //#endregion
 export { ShareablesApiProvider as a, ShareablesUIProvider as i, ShareablesApp as n, ShareablesCoreProvider as o, getFileMimeType as r, ProductsApp as t };
 
-//# sourceMappingURL=src-k03GJfKt.mjs.map
+//# sourceMappingURL=src-DcIV4Mpe.mjs.map