Merge branch 'master' into dependencies-update

graphql-codegen/graphql-plugin-prefetch.ts

@@ -28,16 +28,21 @@ const options = {
 
 async function doPrefetch<T extends Key>(k: T, v: Vars[T], client: QueryClient) {
 	const r = await fns[k](v as any);
+
+	const hasVars = Object.keys(v as any).length > 0;
+	const queryKey = hasVars ? [k, v] : [k];
+	const infiniteQueryKey = hasVars ? [\`\${k}.infinite\`, v] : [\`\${k}.infinite\`];
+
     await client.prefetchQuery({
-        queryKey: [k, v],
+        queryKey,
         queryFn: () => r,
-        ...options,
+        ...options
     });
     await client.prefetchInfiniteQuery({
-        queryKey: [\`\${k}.infinite\`, v],
+        queryKey: infiniteQueryKey,
         queryFn: () => r,
         initialPageParam: null,
-        ...options,
+        ...options
     });
 }
 

src/containers/library/playlist/libraryPlaylistDetail.tsx

@@ -1,21 +1,17 @@
-import { useQuery } from '@tanstack/react-query';
 import { useRouter } from 'next/router';
 import React from 'react';
 
 import NotFound from '~components/organisms/notFound';
 import PlaylistDetail from '~containers/library/playlist/detail';
 import LoadingCards from '~src/components/molecules/loadingCards';
 
-import { getLibraryPlaylistPageData } from './__generated__/detail';
+import { useGetLibraryPlaylistPageDataQuery } from './__generated__/detail';
 
 function LibraryPlaylistDetail(): JSX.Element {
 	const router = useRouter();
 	const playlistId = router.query.playlist as string;
-
-	const { data, isLoading } = useQuery({
-		queryKey: ['getLibraryPlaylistPageData', { id: playlistId }],
-		queryFn: () => getLibraryPlaylistPageData({ id: playlistId }),
-		staleTime: Infinity,
+	const { data, isLoading } = useGetLibraryPlaylistPageDataQuery({
+		id: playlistId,
 	});
 
 	if (isLoading) {