Fix infinite query type inferrence

audioverse-org · Oct 17, 2024 · 9c1d0a4 · 9c1d0a4
1 parent c3e9244
commit 9c1d0a4
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 37 deletions.
diff --git a/src/components/organisms/cardSlider/section/continueListening.tsx b/src/components/organisms/cardSlider/section/continueListening.tsx
@@ -4,10 +4,7 @@ import { useIntl } from 'react-intl';
 import { CardRecordingFragment } from '~src/components/molecules/card/__generated__/recording';
 import CardRecording from '~src/components/molecules/card/recording';
 
-import {
-	GetSectionContinueListeningQuery,
-	useInfiniteGetSectionContinueListeningQuery,
-} from './__generated__/continueListening';
+import { useInfiniteGetSectionContinueListeningQuery } from './__generated__/continueListening';
 import Section from './index';
 
 export default function ContinueListening(): JSX.Element {
@@ -29,9 +26,7 @@ export default function ContinueListening(): JSX.Element {
 				defaultMessage: 'Next continue listening',
 			})}
 			selectNodes={(p) =>
-				(
-					p as GetSectionContinueListeningQuery
-				)?.me?.user.continueListening.nodes?.map((n) => n.recording)
+				p?.me?.user.continueListening.nodes?.map((n) => n.recording)
 			}
 			selectPageInfo={(p) => p?.me?.user.continueListening.pageInfo}
 			Card={(p: { node: CardRecordingFragment }) => (

diff --git a/src/components/organisms/cardSlider/section/index.tsx b/src/components/organisms/cardSlider/section/index.tsx
@@ -79,6 +79,7 @@ export default function Section<T extends GraphqlInfiniteQuery, N>({
 		infiniteQuery(
 			{ language, after: null },
 			{
+				initialPageParam: { language, after: null },
 				getNextPageParam: (last: Maybe<GraphqlInfiniteQuery>) => {
 					if (!last) return;
 					const pageInfo = selectPageInfo(last);

diff --git a/src/components/organisms/cardSlider/section/trendingMusic.tsx b/src/components/organisms/cardSlider/section/trendingMusic.tsx
@@ -7,10 +7,7 @@ import root from '~src/lib/routes';
 import useLanguageRoute from '~src/lib/useLanguageRoute';
 
 import Section from '.';
-import {
-	GetSectionTrendingMusicQuery,
-	useInfiniteGetSectionTrendingMusicQuery,
-} from './__generated__/trendingMusic';
+import { useInfiniteGetSectionTrendingMusicQuery } from './__generated__/trendingMusic';
 
 export default function TrendingMusic(): JSX.Element {
 	const route = useLanguageRoute();
@@ -32,11 +29,7 @@ export default function TrendingMusic(): JSX.Element {
 				defaultMessage: 'Next trending scripture songs',
 			})}
 			seeAllUrl={root.lang(route).songs.albums.get()}
-			selectNodes={(p) =>
-				(p as GetSectionTrendingMusicQuery)?.trendingMusic.nodes?.map(
-					(n) => n.recording,
-				)
-			}
+			selectNodes={(p) => p?.trendingMusic.nodes?.map((n) => n.recording)}
 			Card={(p: { node: CardRecordingFragment }) => (
 				<CardRecording recording={p.node} />
 			)}

diff --git a/src/components/organisms/cardSlider/section/trendingTeachings.tsx b/src/components/organisms/cardSlider/section/trendingTeachings.tsx
@@ -6,10 +6,7 @@ import CardRecording from '~src/components/molecules/card/recording';
 import root from '~src/lib/routes';
 import useLanguageRoute from '~src/lib/useLanguageRoute';
 
-import {
-	GetSectionTrendingTeachingsQuery,
-	useInfiniteGetSectionTrendingTeachingsQuery,
-} from './__generated__/trendingTeachings';
+import { useInfiniteGetSectionTrendingTeachingsQuery } from './__generated__/trendingTeachings';
 import Section from './index';
 
 export default function TrendingTeachings(): JSX.Element {
@@ -32,11 +29,7 @@ export default function TrendingTeachings(): JSX.Element {
 				defaultMessage: 'Next trending teachings',
 			})}
 			seeAllUrl={root.lang(route).teachings.trending.get()}
-			selectNodes={(p) =>
-				(p as GetSectionTrendingTeachingsQuery)?.trendingTeachings.nodes?.map(
-					(n) => n.recording,
-				)
-			}
+			selectNodes={(p) => p?.trendingTeachings.nodes?.map((n) => n.recording)}
 			Card={(p: { node: CardRecordingFragment }) => (
 				<CardRecording recording={p.node} fullBleed />
 			)}

diff --git a/src/types/graphql-codegen.ts b/src/types/graphql-codegen.ts
@@ -1,22 +1,26 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import {
 	UseInfiniteQueryOptions,
 	UseInfiniteQueryResult,
 } from '@tanstack/react-query';
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+type GraphqlInfiniteQueryOptions<T> = Omit<
+	UseInfiniteQueryOptions<T, unknown, unknown>,
+	'queryKey'
+> & {
+	queryKey?: UseInfiniteQueryOptions<T, unknown, unknown>['queryKey'];
+};
+
 export type GraphqlInfiniteQuery<T = any, V = any> = (
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	pageParamKey: any,
 	variables: V,
-	options?: UseInfiniteQueryOptions<T, unknown, T>,
+	options: GraphqlInfiniteQueryOptions<T>,
 ) => UseInfiniteQueryResult<T, unknown>;
 
-export type InferGraphqlInfiniteQueryType<T> = T extends GraphqlInfiniteQuery
-	? NonNullable<Parameters<T>[2]> extends UseInfiniteQueryOptions<
-			infer T,
-			unknown,
-			unknown
-		>
-		? T
-		: never
+type X<T> = T extends GraphqlInfiniteQueryOptions<infer R> ? R : never;
+
+export type InferGraphqlInfiniteQueryType<T> = T extends (
+	variables: infer V,
+	options: infer O,
+) => UseInfiniteQueryResult<any, any>
+	? X<O>
 	: never;