@behindthemusictree/app-kit-ui 35.0.0 → 36.0.0

package/dist/{chunk-YC3WBUVO.js → chunk-RTXLUHJY.js}

@@ -1096,7 +1096,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 { usePlaybackContext, useFetchWrapper } from "@behindthemusictree/app-kit/transport";
+import { usePlaybackContext, usePlaybackFetch } 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";
@@ -1174,7 +1174,7 @@ function GenrePlaylistTracks({
   const trackNoun = useTrackNoun();
   const uuid = genrePlaylist?.uuid;
   const genreName = selectedGenreName ?? genrePlaylist?.name ?? "Genre";
-  const { fetch } = useFetchWrapper(getBackendBaseUrl);
+  const { fetchBound } = usePlaybackFetch(getBackendBaseUrl);
   const playback = usePlaybackContext();
   const { data, isPending, isError, refetch, hasNextPage, isFetchingNextPage, fetchNextPage } = useInfiniteQuery({
     queryKey: [...scope === "me" ? uuid ? genrePlaylistQueryKeys.me.tracks(uuid) : ["missing-personal-genre-playlist", genreUuid] : artist ? [...libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid, selection), "artist", artist.uuid] : libraryQueryKeys.reference.songs.byGenre(getBackendBaseUrl(), genreUuid, selection), ...playback.key ? [playback.key] : []],
@@ -1183,7 +1183,7 @@ function GenrePlaylistTracks({
         if (!uuid) throw new Error("Personal genre has no playlist");
         return fetchGenrePlaylistTracksPage(uuid, scope, Number(pageParam));
       }
-      const response = await fetch(
+      const response = await fetchBound(
         libraryEndpoints.reference.songs.list(),
         true,
         false,
@@ -1195,7 +1195,9 @@ function GenrePlaylistTracks({
     },
     initialPageParam: scope === "me" ? 1 : "",
     getNextPageParam: (lastPage) => lastPage.nextPage ?? void 0,
-    enabled: playback.ready && (scope !== "me" || uuid !== void 0 && sessionRestored && !!session?.accessToken)
+    enabled: playback.ready && (scope !== "me" || uuid !== void 0 && sessionRestored && !!session?.accessToken),
+    retry: (failureCount, error) => failureCount < 1 && error instanceof DOMException && error.name === "AbortError",
+    retryDelay: 0
   });
   const [sentinel, setSentinel] = useState6(null);
   useEffect3(() => {
@@ -1852,7 +1854,7 @@ import {
   songUnplayableReason as songUnplayableReason3,
   useTrackList as useTrackList4
 } from "@behindthemusictree/app-kit/genre-tree";
-import { PaginatedResponseSchema as PaginatedResponseSchema2, useFetchWrapper as useFetchWrapper2, useQueryWithParse } from "@behindthemusictree/app-kit/transport";
+import { PaginatedResponseSchema as PaginatedResponseSchema2, usePlaybackQuery } from "@behindthemusictree/app-kit/transport";
 
 // src/genre-tree/track-list-sidebar/TrackItem.tsx
 import { usePlayer as usePlayer7 } from "@behindthemusictree/app-kit/player";
@@ -1988,12 +1990,12 @@ var SORTS = [
 function ArtistSongs({ artist, getBackendBaseUrl, renderArtistLink, renderSongLink }) {
   const [page, setPage] = useState7(1);
   const [ordering, setOrdering] = useState7("title");
-  const { fetch } = useFetchWrapper2(getBackendBaseUrl);
   const { playNewTrackListFromArtist } = useTrackList4();
   const { playerTrackObject } = usePlayer8();
-  const { data, isPending, isError } = useQueryWithParse({
+  const { data, isPending, isError } = usePlaybackQuery({
+    getBackendBaseUrl,
     queryKey: ["referenceSongs", "artist", artist.uuid, ordering, page],
-    queryFn: () => fetch(libraryEndpoints2.reference.songs.list(), true, false, void 0, {
+    queryFn: (fetchBound) => fetchBound(libraryEndpoints2.reference.songs.list(), true, false, void 0, {
       artist: artist.uuid,
       ordering,
       page
@@ -2439,6 +2441,8 @@ function GenreTreeView({
   };
   const {
     isLoading,
+    isError,
+    refetch,
     isFetching: isTreeFetching,
     genrePlaylistByNodeId,
     visibleGenrePlaylists,
@@ -2571,7 +2575,7 @@ function GenreTreeView({
   }, [selectedGenreUuid, artistUuid, songUuid]);
   const [isWheelRevealed, setIsWheelRevealed] = useState9(false);
   const usesHandoff = viewMode === "wheel" || viewMode === "pop-core";
-  const isTreeReady = !isLoading && (!usesHandoff || isWheelRevealed);
+  const isTreeReady = !isLoading && !isError && (!usesHandoff || isWheelRevealed);
   const [resolveStyle, setResolveStyle] = useState9(null);
   const handleNodeStyleResolverChange = useCallback6(
     (resolver) => setResolveStyle(() => resolver),
@@ -2751,7 +2755,7 @@ function GenreTreeView({
     ] });
   };
   const actions = /* @__PURE__ */ jsxs26(Fragment14, { children: [
-    !isLoading && /* @__PURE__ */ jsx34(
+    !isLoading && !isError && /* @__PURE__ */ jsx34(
       GenreTreeSearch,
       {
         artistBaseUrl,
@@ -2782,9 +2786,9 @@ function GenreTreeView({
         extraGroups: extraSearchGroups
       }
     ),
-    !isLoading && filterArtist && /* @__PURE__ */ jsx34("div", { className: "hidden w-full justify-center max-md:flex", children: renderArtistFilter() }),
+    !isLoading && !isError && filterArtist && /* @__PURE__ */ jsx34("div", { className: "hidden w-full justify-center max-md:flex", children: renderArtistFilter() }),
     /* @__PURE__ */ jsxs26("div", { className: "contents max-md:flex max-md:w-full max-md:items-center max-md:gap-2 max-md:overflow-x-auto max-md:[scrollbar-width:none] max-md:[&>*]:shrink-0", children: [
-      !isLoading && !isControlled && /* @__PURE__ */ jsx34(
+      !isLoading && !isError && !isControlled && /* @__PURE__ */ jsx34(
         SegmentedControl2,
         {
           "aria-label": "Tree view mode",
@@ -2798,7 +2802,7 @@ function GenreTreeView({
           ]
         }
       ),
-      !isLoading && showDisplayOptions && /* @__PURE__ */ jsx34(
+      !isLoading && !isError && showDisplayOptions && /* @__PURE__ */ jsx34(
         "div",
         {
           className: "flex items-center gap-1",
@@ -2815,7 +2819,7 @@ function GenreTreeView({
           )
         }
       ),
-      !isLoading && !readOnly && showAddRoot && /* @__PURE__ */ jsx34(
+      !isLoading && !isError && !readOnly && showAddRoot && /* @__PURE__ */ jsx34(
         IconTextButton,
         {
           icon: Plus2,
@@ -2838,7 +2842,7 @@ function GenreTreeView({
             children: actions
           }
         ),
-        !isLoading && filterArtist && /* @__PURE__ */ jsx34(
+        !isLoading && !isError && filterArtist && /* @__PURE__ */ jsx34(
           "div",
           {
             className: `absolute left-1/2 z-30 hidden -translate-x-1/2 md:block ${placement === "regions" ? "top-[calc(var(--layout-gutter)+var(--layout-panel-inset))]" : "top-5"}`,
@@ -2846,8 +2850,12 @@ function GenreTreeView({
           }
         ),
         /* @__PURE__ */ jsx34("div", { className: "content-container flex-1 min-h-0 flex flex-row gap-4", children: /* @__PURE__ */ jsxs26("div", { className: "tree-view-container relative flex-1 min-w-0 flex flex-col h-full", children: [
-          !isLoading && viewMode === "outline" && floatingControlsLeading && /* @__PURE__ */ jsx34("div", { className: "absolute bottom-3 right-3 z-10", children: floatingControlsLeading }),
-          isLoading ? /* @__PURE__ */ jsx34(GenreTreeViewSkeleton, { viewMode }) : viewMode === "wheel" ? (
+          !isLoading && !isError && viewMode === "outline" && floatingControlsLeading && /* @__PURE__ */ jsx34("div", { className: "absolute bottom-3 right-3 z-10", children: floatingControlsLeading }),
+          isLoading ? /* @__PURE__ */ jsx34(GenreTreeViewSkeleton, { viewMode }) : isError ? /* @__PURE__ */ jsxs26("p", { role: "alert", className: "m-auto text-center", children: [
+            "Couldn't load the genre tree.",
+            " ",
+            /* @__PURE__ */ jsx34("button", { type: "button", className: "underline", onClick: refetch, children: "Retry" })
+          ] }) : viewMode === "wheel" ? (
             // The info panel's top edge aligns with the tree's; the search bar floats `--layout-panel-inset` below it,
             // and the header inset (the bar's height plus that inset) extends the header's fill behind the bar,
             // Google Maps style; the 8px bottom padding mirrors the inset above the bar, and the hidden title's height is zeroed.
@@ -3453,4 +3461,4 @@ export {
   GenreTreeViewSkeleton2 as GenreTreeViewSkeleton,
   GenreTreeOutlineSkeleton
 };
-//# sourceMappingURL=chunk-YC3WBUVO.js.map
+//# sourceMappingURL=chunk-RTXLUHJY.js.map