@behindthemusictree/app-kit-ui 33.0.0 → 33.1.0

package/dist/{chunk-GHFKICEB.js → chunk-2M4Q2IJU.js}

@@ -554,7 +554,7 @@ function GenreSearch({
         onPick: handlePick,
         status,
         loading: loading ? "Searching\u2026" : void 0,
-        inputClassName: `h-[var(--layout-search-h,3rem)] ${onPrevious ? "pl-11" : "pl-6"} pr-20 text-base transition-[padding] duration-200 ease-out motion-reduce:transition-none bg-[var(--color-surface)] border-[var(--color-border)] rounded-full shadow-md`,
+        inputClassName: `h-[var(--layout-search-h,3rem)] ${onPrevious ? "pl-11" : "pl-6"} pr-20 text-base transition-[padding] duration-200 ease-out motion-reduce:transition-none bg-[var(--color-surface)] border-[var(--color-border)] rounded-full shadow-md focus-visible:ring-0`,
         className: "genre-search-results z-40 rounded-xl shadow-md",
         listClassName: "max-h-[min(20rem,50dvh)]",
         optionClassName: "[@media(pointer:coarse)]:min-h-[var(--layout-touch-target)]"
@@ -953,7 +953,7 @@ import { z } from "zod";
 import { FaPlay, FaPause } from "react-icons/fa";
 import { PanelSection, RingLoader, Skeleton } from "@behindthemusictree/ui";
 import { useSession } from "@behindthemusictree/app-kit/auth";
-import { useFetchWrapper } from "@behindthemusictree/app-kit/transport";
+import { usePlaybackContext, useFetchWrapper } from "@behindthemusictree/app-kit/transport";
 import { PaginatedResponseSchema } from "@behindthemusictree/app-kit/transport";
 import { parseWithLog } from "@behindthemusictree/app-kit/transport";
 import { usePlayer as usePlayer4 } from "@behindthemusictree/app-kit/player";
@@ -1028,8 +1028,9 @@ function GenrePlaylistTracks({
   const trackNoun = useTrackNoun();
   const { uuid } = genrePlaylist;
   const { fetch } = useFetchWrapper(getBackendBaseUrl);
+  const playback = usePlaybackContext();
   const { data, isPending, isError, refetch, hasNextPage, isFetchingNextPage, fetchNextPage } = useInfiniteQuery({
-    queryKey: scope === "me" ? genrePlaylistQueryKeys.me.tracks(uuid) : artist ? [...libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid), "artist", artist.uuid] : libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid),
+    queryKey: [...scope === "me" ? genrePlaylistQueryKeys.me.tracks(uuid) : artist ? [...libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid), "artist", artist.uuid] : libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid), ...playback.key ? [playback.key] : []],
     queryFn: async ({ pageParam }) => {
       if (scope === "me") return fetchGenrePlaylistTracksPage(uuid, scope, Number(pageParam));
       const response = await fetch(
@@ -1044,7 +1045,7 @@ function GenrePlaylistTracks({
     },
     initialPageParam: scope === "me" ? 1 : "",
     getNextPageParam: (lastPage) => lastPage.nextPage ?? void 0,
-    enabled: scope !== "me" || sessionRestored && !!session?.accessToken
+    enabled: playback.ready && (scope !== "me" || sessionRestored && !!session?.accessToken)
   });
   const [sentinel, setSentinel] = useState5(null);
   useEffect3(() => {
@@ -3157,7 +3158,7 @@ function PlayerPanel({
   renderArtistLink,
   renderSongLink
 }) {
-  const { playerTrackObject } = usePlayer11();
+  const { playerTrackObject, retryPlayback } = usePlayer11();
   const { toggleTrackListSidebar, isTrackListSidebarVisible } = useTrackListSidebarVisibility();
   const [lastLoadedTrackTitle, setLastLoadedTrackTitle] = useState9("");
   const loadedTrackTitle = playerTrackObject?.track.title;
@@ -3220,7 +3221,12 @@ function PlayerPanel({
                 /* @__PURE__ */ jsx33("div", { className: "flex shrink-0 items-center justify-between gap-2 border-b border-zinc-800 p-2", children: /* @__PURE__ */ jsx33("span", { className: "min-w-0 truncate text-sm font-semibold", children: loadedTrackTitle || lastLoadedTrackTitle }) }),
                 /* @__PURE__ */ jsxs26("div", { className: "relative w-full shrink-0", children: [
                   /* @__PURE__ */ jsx33(PlayerVideoSurface, { className: "aspect-video w-full bg-black" }),
-                  playerTrackObject?.loadError && /* @__PURE__ */ jsx33("span", { className: "absolute bottom-2 left-2 right-2 text-xs text-red-400", children: playerTrackObject.loadError })
+                  playerTrackObject?.loadError && /* @__PURE__ */ jsxs26("span", { className: "absolute bottom-2 left-2 right-2 text-xs text-red-400", children: [
+                    playerTrackObject.loadError,
+                    /* @__PURE__ */ jsx33("button", { type: "button", className: "ml-2 underline", onClick: () => {
+                      void retryPlayback();
+                    }, children: "Retry" })
+                  ] })
                 ] }),
                 /* @__PURE__ */ jsx33(PlayerControls, {})
               ] }),
@@ -3303,4 +3309,4 @@ export {
   GenreTreeViewSkeleton2 as GenreTreeViewSkeleton,
   GenreTreeOutlineSkeleton
 };
-//# sourceMappingURL=chunk-GHFKICEB.js.map
+//# sourceMappingURL=chunk-2M4Q2IJU.js.map