Improve GraphQL input typings (#1057)

.changeset/pink-coins-ring.md

@@ -0,0 +1,7 @@
+---
+'houdini-svelte': patch
+'houdini-react': patch
+'houdini': patch
+---
+
+Improved typings

packages/houdini-react/src/runtime/hooks/useDocumentHandle.ts

@@ -4,6 +4,7 @@ import { cursorHandlers, offsetHandlers } from '$houdini/runtime/lib/pagination'
 import { ArtifactKind } from '$houdini/runtime/lib/types'
 import type {
 	GraphQLObject,
+	GraphQLVariables,
 	CursorHandlers,
 	OffsetHandlers,
 	PageInfo,
@@ -17,7 +18,7 @@ import React from 'react'
 export function useDocumentHandle<
 	_Artifact extends QueryArtifact,
 	_Data extends GraphQLObject,
-	_Input extends Record<string, any>
+	_Input extends GraphQLVariables
 >({
 	artifact,
 	observer,
@@ -134,7 +135,7 @@ export function useDocumentHandle<
 export type DocumentHandle<
 	_Artifact extends QueryArtifact,
 	_Data extends GraphQLObject = GraphQLObject,
-	_Input extends {} = []
+	_Input extends GraphQLVariables = GraphQLVariables
 > = {
 	data: _Data
 	partial: boolean

packages/houdini-react/src/runtime/hooks/useDocumentStore.ts

@@ -1,4 +1,4 @@
-import type { DocumentArtifact, QueryResult } from '$houdini/lib/types'
+import type { DocumentArtifact, GraphQLVariables, QueryResult } from '$houdini/lib/types'
 import type { DocumentStore, ObserveParams } from '$houdini/runtime/client'
 import type { GraphQLObject } from 'houdini'
 import * as React from 'react'
@@ -15,7 +15,7 @@ export type UseDocumentStoreParams<
 
 export function useDocumentStore<
 	_Data extends GraphQLObject = GraphQLObject,
-	_Input extends {} = {},
+	_Input extends GraphQLVariables = GraphQLVariables,
 	_Artifact extends DocumentArtifact = DocumentArtifact
 >({
 	artifact,

packages/houdini-react/src/runtime/hooks/useDocumentSubscription.ts

@@ -1,4 +1,4 @@
-import type { DocumentArtifact, QueryResult } from '$houdini/lib/types'
+import type { DocumentArtifact, GraphQLVariables, QueryResult } from '$houdini/lib/types'
 import type { DocumentStore, SendParams } from '$houdini/runtime/client'
 import type { GraphQLObject } from 'houdini'
 
@@ -8,7 +8,7 @@ import { useDocumentStore, type UseDocumentStoreParams } from './useDocumentStor
 export function useDocumentSubscription<
 	_Artifact extends DocumentArtifact = DocumentArtifact,
 	_Data extends GraphQLObject = GraphQLObject,
-	_Input extends {} = {}
+	_Input extends GraphQLVariables = GraphQLVariables
 >({
 	artifact,
 	variables,

packages/houdini-react/src/runtime/hooks/useFragment.ts

@@ -1,7 +1,7 @@
 import cache from '$houdini/runtime/cache'
 import { deepEquals } from '$houdini/runtime/lib/deepEquals'
 import { fragmentKey } from '$houdini/runtime/lib/types'
-import type { GraphQLObject, FragmentArtifact } from '$houdini/runtime/lib/types'
+import type { GraphQLObject, GraphQLVariables, FragmentArtifact } from '$houdini/runtime/lib/types'
 import * as React from 'react'
 
 import { useDeepCompareMemoize } from './useDeepCompareEffect'
@@ -10,7 +10,7 @@ import { useDocumentSubscription } from './useDocumentSubscription'
 export function useFragment<
 	_Data extends GraphQLObject,
 	_ReferenceType extends {},
-	_Input extends {} = {}
+	_Input extends GraphQLVariables = GraphQLVariables
 >(
 	reference: _Data | { [fragmentKey]: _ReferenceType } | null,
 	document: { artifact: FragmentArtifact }

packages/houdini-react/src/runtime/hooks/useFragmentHandle.ts

@@ -3,6 +3,7 @@ import type {
 	FragmentArtifact,
 	QueryArtifact,
 	fragmentKey,
+	GraphQLVariables,
 } from '$houdini/runtime/lib/types'
 
 import { useDocumentHandle, type DocumentHandle } from './useDocumentHandle'
@@ -16,7 +17,7 @@ export function useFragmentHandle<
 	_Data extends GraphQLObject,
 	_ReferenceType extends {},
 	_PaginationArtifact extends QueryArtifact,
-	_Input extends {} = {}
+	_Input extends GraphQLVariables = GraphQLVariables
 >(
 	reference: _Data | { [fragmentKey]: _ReferenceType } | null,
 	document: { artifact: FragmentArtifact; refetchArtifact?: QueryArtifact }

packages/houdini-react/src/runtime/hooks/useMutation.ts

@@ -1,4 +1,9 @@
-import type { MutationArtifact, GraphQLObject, QueryResult } from '$houdini/runtime/lib/types'
+import type {
+	MutationArtifact,
+	GraphQLObject,
+	QueryResult,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 
 import { useDocumentStore } from './useDocumentStore'
 
@@ -12,7 +17,7 @@ export type MutationHandler<_Result, _Input, _Optimistic extends GraphQLObject>
 
 export function useMutation<
 	_Result extends GraphQLObject,
-	_Input extends {},
+	_Input extends GraphQLVariables,
 	_Optimistic extends GraphQLObject
 >({
 	artifact,

packages/houdini-react/src/runtime/hooks/useQuery.ts

@@ -1,12 +1,12 @@
-import type { GraphQLObject, QueryArtifact } from '$houdini/runtime/lib/types'
+import type { GraphQLVariables, GraphQLObject, QueryArtifact } from '$houdini/runtime/lib/types'
 
 import type { UseQueryConfig } from './useQueryHandle'
 import { useQueryHandle } from './useQueryHandle'
 
 export function useQuery<
 	_Artifact extends QueryArtifact,
 	_Data extends GraphQLObject = GraphQLObject,
-	_Input extends {} = []
+	_Input extends GraphQLVariables = GraphQLVariables
 >(
 	document: { artifact: QueryArtifact },
 	variables: any = null,

packages/houdini-react/src/runtime/hooks/useQueryHandle.ts

@@ -1,4 +1,9 @@
-import type { GraphQLObject, CachePolicies, QueryArtifact } from '$houdini/runtime/lib/types'
+import type {
+	GraphQLObject,
+	CachePolicies,
+	QueryArtifact,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 import React from 'react'
 
 import { createCache } from '../lib/cache'
@@ -28,7 +33,7 @@ type QuerySuspenseUnit = {
 export function useQueryHandle<
 	_Artifact extends QueryArtifact,
 	_Data extends GraphQLObject = GraphQLObject,
-	_Input extends {} = []
+	_Input extends GraphQLVariables = GraphQLVariables
 >(
 	{ artifact }: { artifact: QueryArtifact },
 	variables: any = null,

packages/houdini-react/src/runtime/hooks/useSubscription.ts

@@ -1,9 +1,13 @@
-import type { SubscriptionArtifact, GraphQLObject } from '$houdini/runtime/lib/types'
+import type {
+	SubscriptionArtifact,
+	GraphQLObject,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 
 import { useSubscriptionHandle } from './useSubscriptionHandle'
 
 // a hook to subscribe to a subscription artifact
-export function useSubscription<_Result extends GraphQLObject, _Input extends {}>(
+export function useSubscription<_Result extends GraphQLObject, _Input extends GraphQLVariables>(
 	document: { artifact: SubscriptionArtifact },
 	variables: _Input
 ) {

packages/houdini-react/src/runtime/hooks/useSubscriptionHandle.ts

@@ -1,8 +1,12 @@
-import type { SubscriptionArtifact, GraphQLObject } from '$houdini/runtime/lib/types'
+import type {
+	SubscriptionArtifact,
+	GraphQLObject,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 
 import { useDocumentSubscription } from './useDocumentSubscription'
 
-export type SubscriptionHandle<_Result extends GraphQLObject, _Input extends {} | null> = {
+export type SubscriptionHandle<_Result extends GraphQLObject, _Input extends GraphQLVariables> = {
 	data: _Result | null
 	errors: { message: string }[] | null
 	variables: _Input
@@ -12,10 +16,10 @@ export type SubscriptionHandle<_Result extends GraphQLObject, _Input extends {}
 }
 
 // a hook to subscribe to a subscription artifact
-export function useSubscriptionHandle<_Result extends GraphQLObject, _Input extends {}>(
-	{ artifact }: { artifact: SubscriptionArtifact },
-	variables: _Input
-) {
+export function useSubscriptionHandle<
+	_Result extends GraphQLObject,
+	_Input extends GraphQLVariables
+>({ artifact }: { artifact: SubscriptionArtifact }, variables: _Input) {
 	// a subscription is basically just a live document
 	const [storeValue, observer] = useDocumentSubscription({
 		artifact,

packages/houdini-svelte/src/runtime/index.ts

@@ -1,4 +1,4 @@
-import { QueryStore } from './stores'
+import type { QueryStore } from './stores'
 
 export * from './adapter'
 export * from './stores'

packages/houdini-svelte/src/runtime/stores/base.ts

@@ -1,5 +1,10 @@
 import { DocumentStore, type ObserveParams } from '$houdini/runtime/client'
-import type { GraphQLObject, DocumentArtifact, QueryResult } from '$houdini/runtime/lib/types'
+import type {
+	GraphQLObject,
+	DocumentArtifact,
+	QueryResult,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 import { get } from 'svelte/store'
 import type { Readable } from 'svelte/store'
 
@@ -8,7 +13,7 @@ import { getClient, initClient } from '../client'
 
 export class BaseStore<
 	_Data extends GraphQLObject,
-	_Input extends {},
+	_Input extends GraphQLVariables,
 	_Artifact extends DocumentArtifact = DocumentArtifact
 > {
 	// the underlying data

packages/houdini-svelte/src/runtime/stores/fragment.ts

@@ -5,6 +5,7 @@ import type {
 	GraphQLObject,
 	FragmentArtifact,
 	HoudiniFetchContext,
+	GraphQLVariables,
 } from '$houdini/runtime/lib/types'
 import { CompiledFragmentKind, fragmentKey } from '$houdini/runtime/lib/types'
 import { derived } from 'svelte/store'
@@ -19,7 +20,7 @@ import { BaseStore } from './base'
 export class FragmentStore<
 	_Data extends GraphQLObject,
 	_ReferenceType extends {},
-	_Input extends {} = {}
+	_Input extends GraphQLVariables = GraphQLVariables
 > {
 	artifact: FragmentArtifact
 	name: string

packages/houdini-svelte/src/runtime/stores/mutation.ts

@@ -1,4 +1,9 @@
-import type { MutationArtifact, GraphQLObject, QueryResult } from '$houdini/runtime/lib/types'
+import type {
+	MutationArtifact,
+	GraphQLObject,
+	QueryResult,
+	GraphQLVariables,
+} from '$houdini/runtime/lib/types'
 import type { RequestEvent } from '@sveltejs/kit'
 
 import { initClient } from '../client'
@@ -7,7 +12,7 @@ import { fetchParams } from './query'
 
 export class MutationStore<
 	_Data extends GraphQLObject,
-	_Input extends {},
+	_Input extends GraphQLVariables,
 	_Optimistic extends GraphQLObject
 > extends BaseStore<_Data, _Input, MutationArtifact> {
 	kind = 'HoudiniMutation' as const

packages/houdini-svelte/src/runtime/stores/pagination/fragment.ts

@@ -10,6 +10,7 @@ import type {
 	QueryArtifact,
 	PageInfo,
 	CursorHandlers,
+	GraphQLVariables,
 } from '$houdini/runtime/lib/types'
 import { CompiledFragmentKind } from '$houdini/runtime/lib/types'
 import type { Readable, Subscriber } from 'svelte/store'
@@ -76,11 +77,11 @@ class BasePaginatedFragmentStore<_Data extends GraphQLObject, _Input> {
 // both cursor paginated stores add a page info to their subscribe
 export class FragmentStoreCursor<
 	_Data extends GraphQLObject,
-	_Input extends Record<string, any>
+	_Input extends GraphQLVariables
 > extends BasePaginatedFragmentStore<_Data, _Input> {
 	// we want to add the cursor-based fetch to the return value of get
 	get(initialValue: _Data | null) {
-		const base = new FragmentStore<_Data, _Input>({
+		const base = new FragmentStore<_Data, {}, _Input>({
 			artifact: this.artifact,
 			storeName: this.name,
 		})
@@ -97,7 +98,7 @@ export class FragmentStoreCursor<
 			initialValue,
 			() => get(store),
 			// the variables that are needed for this query are the store's values and the ids
-			() => store.variables as _Input
+			() => store.variables as NonNullable<_Input>
 		)
 
 		const subscribe = (
@@ -134,7 +135,7 @@ export class FragmentStoreCursor<
 		observer: DocumentStore<_Data, _Input>,
 		initialValue: _Data | null,
 		getState: () => _Data | null,
-		getVariables: () => _Input
+		getVariables: () => NonNullable<_Input>
 	): CursorHandlers<_Data, _Input> {
 		return cursorHandlers<_Data, _Input>({
 			getState,
@@ -178,10 +179,10 @@ export class FragmentStoreCursor<
 
 export class FragmentStoreOffset<
 	_Data extends GraphQLObject,
-	_Input extends Record<string, any>
+	_Input extends GraphQLVariables
 > extends BasePaginatedFragmentStore<_Data, _Input> {
 	get(initialValue: _Data | null): OffsetFragmentStoreInstance<_Data, _Input> {
-		const base = new FragmentStore<_Data, _Input>({
+		const base = new FragmentStore<_Data, {}, _Input>({
 			artifact: this.artifact,
 			storeName: this.name,
 		})

packages/houdini-svelte/src/runtime/stores/pagination/query.ts

@@ -7,6 +7,7 @@ import type {
 	CursorHandlers,
 	OffsetHandlers,
 	PageInfo,
+	GraphQLVariables,
 } from '$houdini/runtime/lib/types'
 import { get, derived } from 'svelte/store'
 import type { Subscriber } from 'svelte/store'
@@ -22,16 +23,16 @@ import type {
 import type { StoreConfig } from '../query'
 import { QueryStore } from '../query'
 
-export type CursorStoreResult<_Data extends GraphQLObject, _Input extends {}> = QueryResult<
-	_Data,
-	_Input
-> & { pageInfo: PageInfo }
+export type CursorStoreResult<
+	_Data extends GraphQLObject,
+	_Input extends GraphQLVariables
+> = QueryResult<_Data, _Input> & { pageInfo: PageInfo }
 
 // both cursor paginated stores add a page info to their subscribe
-export class QueryStoreCursor<_Data extends GraphQLObject, _Input extends {}> extends QueryStore<
-	_Data,
-	_Input
-> {
+export class QueryStoreCursor<
+	_Data extends GraphQLObject,
+	_Input extends GraphQLVariables
+> extends QueryStore<_Data, _Input> {
 	// all paginated stores need to have a flag to distinguish from other query stores
 	paginated = true
 
@@ -111,10 +112,10 @@ export class QueryStoreCursor<_Data extends GraphQLObject, _Input extends {}> ex
 	}
 }
 
-export class QueryStoreOffset<_Data extends GraphQLObject, _Input extends {}> extends QueryStore<
-	_Data,
-	_Input
-> {
+export class QueryStoreOffset<
+	_Data extends GraphQLObject,
+	_Input extends GraphQLVariables
+> extends QueryStore<_Data, _Input> {
 	// all paginated stores need to have a flag to distinguish from other query stores
 	paginated = true
 

packages/houdini-svelte/src/runtime/stores/query.ts

@@ -3,6 +3,7 @@ import { getCurrentConfig } from '$houdini/runtime/lib/config'
 import * as log from '$houdini/runtime/lib/log'
 import type {
 	CachePolicies,
+	GraphQLVariables,
 	GraphQLObject,
 	MutationArtifact,
 	QueryArtifact,
@@ -25,11 +26,10 @@ import type {
 } from '../types'
 import { BaseStore } from './base'
 
-export class QueryStore<_Data extends GraphQLObject, _Input extends {}> extends BaseStore<
-	_Data,
-	_Input,
-	QueryArtifact
-> {
+export class QueryStore<
+	_Data extends GraphQLObject,
+	_Input extends GraphQLVariables
+> extends BaseStore<_Data, _Input, QueryArtifact> {
 	// whether the store requires variables for input
 	variables: boolean