@fluid-app/portal-sdk 0.1.196 → 0.1.197

package/dist/{PortalContentApiProvider-3zgq-z26.mjs → PortalContentApiProvider-C2cVPFwK.mjs}

@@ -1422,6 +1422,35 @@ function ProductDetailScreen({ productId, countryCode, fetchProduct: fetchPortal
 	});
 }
 //#endregion
+//#region ../../shareables/ui/src/components/OwnerFilterTabs.tsx
+function getFilteredEmptyMessage({ searchTerm, ownerFilter, hasOtherFilters = false, entityName = "items", defaultMessage = "Nothing available at the moment." }) {
+	const isFiltered = ownerFilter !== "all" || hasOtherFilters;
+	if (searchTerm && isFiltered) return `No ${entityName} match "${searchTerm}" with the current filters. Try a different search term or switch to "All".`;
+	if (searchTerm) return `No ${entityName} match "${searchTerm}". Try a different search term.`;
+	if (isFiltered) return `No matching ${entityName} for the current filters.`;
+	return defaultMessage;
+}
+function OwnerFilterTabs({ value, onValueChange, myLabel = "Mine" }) {
+	return /* @__PURE__ */ jsx(Tabs, {
+		value,
+		onValueChange: (v) => onValueChange(v),
+		children: /* @__PURE__ */ jsxs(TabsList, { children: [
+			/* @__PURE__ */ jsx(TabsTrigger, {
+				value: "all",
+				children: "All"
+			}),
+			/* @__PURE__ */ jsx(TabsTrigger, {
+				value: "my",
+				children: myLabel
+			}),
+			/* @__PURE__ */ jsx(TabsTrigger, {
+				value: "company",
+				children: "Company"
+			})
+		] })
+	});
+}
+//#endregion
 //#region ../../shareables/ui/src/components/screens/MediaListingScreen.tsx
 const PAGE_SIZE$3 = 24;
 const GRID_CLASS$2 = "grid grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-4";
@@ -1573,23 +1602,10 @@ function MediaListingScreen({ onNavigate }) {
 		children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-3",
-				children: [/* @__PURE__ */ jsx(Tabs, {
+				children: [/* @__PURE__ */ jsx(OwnerFilterTabs, {
 					value: ownerFilter,
-					onValueChange: (value) => setOwnerFilter(value),
-					children: /* @__PURE__ */ jsxs(TabsList, { children: [
-						/* @__PURE__ */ jsx(TabsTrigger, {
-							value: "all",
-							children: "All"
-						}),
-						/* @__PURE__ */ jsx(TabsTrigger, {
-							value: "my",
-							children: "My Media"
-						}),
-						/* @__PURE__ */ jsx(TabsTrigger, {
-							value: "company",
-							children: "Company"
-						})
-					] })
+					onValueChange: setOwnerFilter,
+					myLabel: "My Media"
 				}), /* @__PURE__ */ jsxs("div", {
 					className: "ml-auto flex items-center gap-2",
 					children: [
@@ -1670,7 +1686,13 @@ function MediaListingScreen({ onNavigate }) {
 				className: "flex flex-col items-center justify-center py-16",
 				children: /* @__PURE__ */ jsx("p", {
 					className: "text-muted-foreground text-sm",
-					children: debouncedSearch ? "No media match your search." : ownerFilter !== "all" || kindFilter !== "all" ? "No matching media on this page — try another page or adjusting filters." : "No media available."
+					children: getFilteredEmptyMessage({
+						searchTerm: debouncedSearch,
+						ownerFilter,
+						hasOtherFilters: kindFilter !== "all",
+						entityName: "media",
+						defaultMessage: "No media available."
+					})
 				})
 			}) : viewMode === "grid" ? /* @__PURE__ */ jsx("div", {
 				className: GRID_CLASS$2,
@@ -8913,7 +8935,11 @@ function PlaylistsListingScreen(_props) {
 	const [searchTerm, setSearchTerm] = useState("");
 	const [debouncedSearch, setDebouncedSearch] = useState("");
 	const [sortValue, setSortValue] = useState("title");
+	const [ownerFilter, setOwnerFilter] = useState("all");
 	const [selectedIds, setSelectedIds] = useState(/* @__PURE__ */ new Set());
+	useEffect(() => {
+		setSelectedIds(/* @__PURE__ */ new Set());
+	}, [ownerFilter]);
 	useEffect(() => {
 		const timer = setTimeout(() => setDebouncedSearch(searchTerm), 300);
 		return () => clearTimeout(timer);
@@ -8944,6 +8970,15 @@ function PlaylistsListingScreen(_props) {
 		placeholderData: keepPreviousData
 	});
 	const allPlaylists = useMemo(() => data?.pages.flatMap((page) => page.playlists) ?? [], [data?.pages]);
+	const filteredPlaylists = useMemo(() => {
+		if (ownerFilter === "all" || !user?.id) return allPlaylists;
+		if (ownerFilter === "my") return allPlaylists.filter((p) => p.user_id === user.id);
+		return allPlaylists.filter((p) => p.user_id !== user.id);
+	}, [
+		allPlaylists,
+		ownerFilter,
+		user?.id
+	]);
 	useEffect(() => {
 		const target = observerTarget.current;
 		if (!target) return;
@@ -8970,9 +9005,9 @@ function PlaylistsListingScreen(_props) {
 		});
 	}, []);
 	const handleSelectAll = useCallback(() => {
-		if (selectedIds.size === allPlaylists.length) setSelectedIds(/* @__PURE__ */ new Set());
-		else setSelectedIds(new Set(allPlaylists.map((p) => p.id)));
-	}, [selectedIds.size, allPlaylists]);
+		if (selectedIds.size === filteredPlaylists.length) setSelectedIds(/* @__PURE__ */ new Set());
+		else setSelectedIds(new Set(filteredPlaylists.map((p) => p.id)));
+	}, [selectedIds.size, filteredPlaylists]);
 	const handleClearSelection = useCallback(() => {
 		setSelectedIds(/* @__PURE__ */ new Set());
 	}, []);
@@ -9072,14 +9107,18 @@ function PlaylistsListingScreen(_props) {
 		children: [
 			hasSelection ? /* @__PURE__ */ jsx(BulkSelectionBar, {
 				selectedCount: selectedIds.size,
-				totalCount: allPlaylists.length,
+				totalCount: filteredPlaylists.length,
 				onSelectAll: handleSelectAll,
 				onClearSelection: handleClearSelection,
 				onBulkFavorite: handleBulkFavorite
-			}) : /* @__PURE__ */ jsx("div", {
-				className: "flex justify-end",
-				children: /* @__PURE__ */ jsx("div", {
-					className: "w-full max-w-sm",
+			}) : /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-3",
+				children: [/* @__PURE__ */ jsx(OwnerFilterTabs, {
+					value: ownerFilter,
+					onValueChange: setOwnerFilter,
+					myLabel: "My Playlists"
+				}), /* @__PURE__ */ jsx("div", {
+					className: "ml-auto w-full max-w-sm",
 					children: /* @__PURE__ */ jsx(SearchSort, {
 						searchValue: searchTerm,
 						onSearchChange: setSearchTerm,
@@ -9105,17 +9144,22 @@ function PlaylistsListingScreen(_props) {
 						sortValue,
 						onSortChange: setSortValue
 					})
-				})
+				})]
 			}),
-			allPlaylists.length === 0 ? /* @__PURE__ */ jsx("div", {
+			filteredPlaylists.length === 0 && !isFetchingNextPage && !hasNextPage ? /* @__PURE__ */ jsx("div", {
 				className: "flex flex-col items-center justify-center py-16",
 				children: /* @__PURE__ */ jsx("p", {
 					className: "text-muted-foreground text-sm",
-					children: searchTerm ? `No playlists match "${searchTerm}". Try a different search term.` : "There are no playlists available at the moment."
+					children: getFilteredEmptyMessage({
+						searchTerm,
+						ownerFilter,
+						entityName: "playlists",
+						defaultMessage: "There are no playlists available at the moment."
+					})
 				})
 			}) : /* @__PURE__ */ jsx("div", {
 				className: GRID_CLASS$1,
-				children: allPlaylists.map((playlist) => {
+				children: filteredPlaylists.map((playlist) => {
 					const firstItem = playlist.items?.[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;
@@ -11778,4 +11822,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-3zgq-z26.mjs.map
+//# sourceMappingURL=PortalContentApiProvider-C2cVPFwK.mjs.map