diff --git a/@app/src/routes/+page.svelte b/@app/src/routes/+page.svelte index d889882..f299c52 100644 --- a/@app/src/routes/+page.svelte +++ b/@app/src/routes/+page.svelte @@ -1,17 +1,8 @@ - - - - - - - +
+{JSON.stringify($queries, null, 2)}
+
diff --git a/@app/src/routes/+page.ts b/@app/src/routes/+page.ts new file mode 100644 index 0000000..2e28041 --- /dev/null +++ b/@app/src/routes/+page.ts @@ -0,0 +1,15 @@ +import { trpc } from '$lib/trpc/client'; + +export async function load(event) { + const { queryClient } = await event.parent(); + const api = trpc(event, queryClient); + + return { + queries: await api.createServerQueries((t) => [t.greeting('foo'), t.greeting('bar')], { + combine: (results) => ({ + foo: results.map(({ data }) => data), + pending: results.some(({ isPending }) => isPending) + }) + }) + } +} diff --git a/@lib/package.json b/@lib/package.json index d7ec8da..9bca7f3 100644 --- a/@lib/package.json +++ b/@lib/package.json @@ -1,6 +1,6 @@ { "name": "trpc-svelte-query-adapter", - "version": "2.3.4", + "version": "2.3.5", "description": "A simple adapter to use `@tanstack/svelte-query` with trpc, similar to `@trpc/react-query`.", "keywords": [ "trpc", diff --git a/@lib/src/index.ts b/@lib/src/index.ts index 89eb1ae..ad44b25 100644 --- a/@lib/src/index.ts +++ b/@lib/src/index.ts @@ -28,6 +28,7 @@ import { type CreateQueryResult, type CreateInfiniteQueryResult, type CreateMutationResult, + QueriesResults, } from '@tanstack/svelte-query'; import { onDestroy } from 'svelte'; @@ -51,7 +52,7 @@ type HasSubscribe = { subscribe: (...args: any[]) => any }; type OnlyQueries = Without; // createUtils -const UtilsProcedureNames = { +const UtilsProcedure = { client: 'client', fetch: 'fetch', prefetch: 'prefetch', @@ -76,7 +77,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientfetchquery */ - [UtilsProcedureNames.fetch]( + [UtilsProcedure.fetch]( input: TInput, opts?: FetchQueryOptions, ): Promise; @@ -84,7 +85,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientfetchinfinitequery */ - [UtilsProcedureNames.fetchInfinite]( + [UtilsProcedure.fetchInfinite]( input: TInput, opts?: FetchInfiniteQueryOptions, ): Promise>; @@ -92,7 +93,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientprefetchquery */ - [UtilsProcedureNames.prefetch]( + [UtilsProcedure.prefetch]( input: TInput, opts?: FetchQueryOptions, ): Promise; @@ -100,7 +101,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientprefetchinfinitequery */ - [UtilsProcedureNames.prefetchInfinite]( + [UtilsProcedure.prefetchInfinite]( input: TInput, opts?: FetchInfiniteQueryOptions, ): Promise; @@ -108,7 +109,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/react/reference/QueryClient#queryclientensurequerydata */ - [UtilsProcedureNames.ensureData]( + [UtilsProcedure.ensureData]( input?: TInput, opts?: FetchQueryOptions, ): Promise; @@ -116,7 +117,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientinvalidatequeries */ - [UtilsProcedureNames.invalidate]( + [UtilsProcedure.invalidate]( input?: TInput, filters?: InvalidateQueryFilters, options?: InvalidateOptions, @@ -125,7 +126,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientrefetchqueries */ - [UtilsProcedureNames.refetch]( + [UtilsProcedure.refetch]( input?: TInput, filters?: RefetchQueryFilters, options?: RefetchOptions, @@ -134,7 +135,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientcancelqueries */ - [UtilsProcedureNames.cancel]( + [UtilsProcedure.cancel]( input?: TInput, filters?: QueryFilters, options?: CancelOptions, @@ -143,7 +144,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientresetqueries */ - [UtilsProcedureNames.reset]( + [UtilsProcedure.reset]( input?: TInput, filters?: QueryFilters, options?: ResetOptions, @@ -152,7 +153,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientsetquerydata */ - [UtilsProcedureNames.setData]( + [UtilsProcedure.setData]( input: TInput, updater: Updater, options?: SetDataOptions, @@ -161,7 +162,7 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientsetquerydata */ - [UtilsProcedureNames.setInfiniteData]( + [UtilsProcedure.setInfiniteData]( input: TInput, updater: Updater< InfiniteData | undefined, @@ -173,12 +174,12 @@ type UtilsProcedures< /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientgetquerydata */ - [UtilsProcedureNames.getData](input?: TInput): TOutput | undefined; + [UtilsProcedure.getData](input?: TInput): TOutput | undefined; /** * @link https://tanstack.com/query/v4/docs/reference/QueryClient#queryclientgetquerydata */ - [UtilsProcedureNames.getInfiniteData]( + [UtilsProcedure.getInfiniteData]( input?: TInput, ): InfiniteData | undefined; }; @@ -191,21 +192,23 @@ type AddUtilsPropTypes = { TError > : AddUtilsPropTypes & - Pick; + Pick; }; type CreateUtils = AddUtilsPropTypes< OnlyQueries, TError > & - Pick & { - [UtilsProcedureNames.client]: TClient; + Pick & { + [UtilsProcedure.client]: TClient; }; // createQueries -type CreateQueriesResult = ReturnType< - typeof createQueries +type CreateQueriesResult = ReturnType< + typeof createQueries >; +type CreateQueriesOpts = Omit>[0], 'queries'> + type CreateQueryOptionsForCreateQueries = Omit< CreateQueryOptions, 'context' | 'queryKey' | 'queryFn' @@ -222,11 +225,13 @@ type CreateQueriesRecord = { type CreateQueries = < TOpts extends CreateQueryOptionsForCreateQueries[], ->( + TCombinedResult = QueriesResults, +> ( queriesCallback: ( t: CreateQueriesRecord, TError>, ) => readonly [...TOpts], -) => CreateQueriesResult; + opts?: CreateQueriesOpts +) => CreateQueriesResult; // createServerQueries type CreateQueryOptionsForCreateServerQueries = @@ -245,21 +250,23 @@ type CreateServerQueriesRecord = { type CreateServerQueries = < TOpts extends CreateQueryOptionsForCreateQueries[], + TCombinedResult = QueriesResults, >( queriesCallback: ( t: CreateServerQueriesRecord, TError>, ) => readonly [...TOpts], + opts?: CreateQueriesOpts ) => Promise< ( queriesCallback?: ( t: CreateQueriesRecord, TError>, old: readonly [...TOpts], ) => readonly [...TOpts], - ) => CreateQueriesResult + ) => CreateQueriesResult >; // Procedures -const ProcedureNames = { +const Procedure = { query: 'createQuery', serverQuery: 'createServerQuery', infiniteQuery: 'createInfiniteQuery', @@ -289,12 +296,12 @@ type TRPCQueryOpts = { }; type CreateQueryProcedure = { - [ProcedureNames.query]: ( + [Procedure.query]: ( input: TInput, opts?: CreateTRPCQueryOptions & TRPCQueryOpts, ) => CreateQueryResult; } & { - [ProcedureNames.serverQuery]: ( + [Procedure.serverQuery]: ( input: TInput, opts?: CreateTRPCServerQueryOptions & TRPCQueryOpts, ) => Promise< @@ -325,13 +332,13 @@ type CreateInfiniteQueryProcedure = (TInput extends { cursor?: any; } ? { - [ProcedureNames.infiniteQuery]: ( + [Procedure.infiniteQuery]: ( input: Omit, opts: CreateTRPCInfiniteQueryOptions & InfiniteQueryOpts & TRPCQueryOpts, ) => CreateInfiniteQueryResult> | null>, TError>; - [ProcedureNames.serverInfiniteQuery]: ( + [Procedure.serverInfiniteQuery]: ( input: Omit, opts: CreateTRPCServerInfiniteQueryOptions & InfiniteQueryOpts & @@ -349,7 +356,7 @@ type QueryProcedures = GetQueryKey & CreateInfiniteQueryProcedure; type CreateMutationProcedure = { - [ProcedureNames.mutate]: ( + [Procedure.mutate]: ( opts?: CreateMutationOptions, ) => CreateMutationResult; } & {}; @@ -368,7 +375,7 @@ type GetSubscriptionOutput = TOpts extends unknown & Partial : never; type CreateSubscriptionProcedure = { - [ProcedureNames.subscribe]: ( + [Procedure.subscribe]: ( input: TInput, opts?: CreateSubscriptionOptions, ) => void; @@ -428,7 +435,7 @@ const utilsProcedures: Record< PropertyKey, (opts: { path: string[]; queryClient: QueryClient; target: any }) => any > = { - [UtilsProcedureNames.fetch]: ({ path, queryClient, target }) => { + [UtilsProcedure.fetch]: ({ path, queryClient, target }) => { return (input: any, opts?: any) => { return queryClient.fetchQuery({ ...opts, @@ -437,7 +444,7 @@ const utilsProcedures: Record< }); }; }, - [UtilsProcedureNames.prefetch]: ({ path, queryClient, target }) => { + [UtilsProcedure.prefetch]: ({ path, queryClient, target }) => { return (input: any, opts?: any) => { return queryClient.prefetchQuery({ ...opts, @@ -446,7 +453,7 @@ const utilsProcedures: Record< }); }; }, - [UtilsProcedureNames.fetchInfinite]: ({ path, queryClient, target }) => { + [UtilsProcedure.fetchInfinite]: ({ path, queryClient, target }) => { return (input: any, opts?: any) => { return queryClient.fetchInfiniteQuery({ ...opts, @@ -456,7 +463,7 @@ const utilsProcedures: Record< }); }; }, - [UtilsProcedureNames.prefetchInfinite]: ({ path, queryClient, target }) => { + [UtilsProcedure.prefetchInfinite]: ({ path, queryClient, target }) => { return (input: any, opts?: any) => { return queryClient.prefetchInfiniteQuery({ ...opts, @@ -466,7 +473,7 @@ const utilsProcedures: Record< }); }; }, - [UtilsProcedureNames.ensureData]: ({ path, queryClient, target }) => { + [UtilsProcedure.ensureData]: ({ path, queryClient, target }) => { return (input: any, opts?: any) => { return queryClient.ensureQueryData({ ...opts, @@ -475,7 +482,7 @@ const utilsProcedures: Record< }); }; }, - [UtilsProcedureNames.invalidate]: ({ path, queryClient }) => { + [UtilsProcedure.invalidate]: ({ path, queryClient }) => { return (input?: any, filters?: any, options?: any) => { return queryClient.invalidateQueries( { @@ -486,7 +493,7 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.refetch]: ({ path, queryClient }) => { + [UtilsProcedure.refetch]: ({ path, queryClient }) => { return (input?: any, filters?: any, options?: any) => { return queryClient.refetchQueries( { @@ -497,7 +504,7 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.cancel]: ({ path, queryClient }) => { + [UtilsProcedure.cancel]: ({ path, queryClient }) => { return (input?: any, filters?: any, options?: any) => { return queryClient.cancelQueries( { @@ -508,7 +515,7 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.reset]: ({ queryClient, path }) => { + [UtilsProcedure.reset]: ({ queryClient, path }) => { return (input?: any, filters?: any, options?: any) => { return queryClient.resetQueries( { @@ -519,7 +526,7 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.setData]: ({ queryClient, path }) => { + [UtilsProcedure.setData]: ({ queryClient, path }) => { return (input: any, updater: any, options?: any) => { return queryClient.setQueryData( getArrayQueryKey(path, input, 'query'), @@ -528,7 +535,7 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.setInfiniteData]: ({ queryClient, path }) => { + [UtilsProcedure.setInfiniteData]: ({ queryClient, path }) => { return (input: any, updater: any, options?: any) => { return queryClient.setQueryData( getArrayQueryKey(path, input, 'infinite'), @@ -537,12 +544,12 @@ const utilsProcedures: Record< ); }; }, - [UtilsProcedureNames.getData]: ({ queryClient, path }) => { + [UtilsProcedure.getData]: ({ queryClient, path }) => { return (input?: any) => { return queryClient.getQueryData(getArrayQueryKey(path, input, 'query')); }; }, - [UtilsProcedureNames.getInfiniteData]: ({ queryClient, path }) => { + [UtilsProcedure.getInfiniteData]: ({ queryClient, path }) => { return (input?: any) => { return queryClient.getQueryData( getArrayQueryKey(path, input, 'infinite') @@ -556,7 +563,7 @@ function createUtilsProxy(client: any, queryClient: QueryClient) { {}, { get(_target, key, _receiver) { - if (key === UtilsProcedureNames.client) return client; + if (key === UtilsProcedure.client) return client; if (Object.hasOwn(utilsProcedures, key)) { const target = [...this.path].reduce( @@ -583,10 +590,10 @@ const procedures: Record< abortOnUnmount?: boolean; }) => any > = { - [ProcedureNames.queryKey]: ({ path }) => { + [Procedure.queryKey]: ({ path }) => { return (input: any, opts?: any) => getArrayQueryKey(path, input, opts); }, - [ProcedureNames.query]: ({ path, target, abortOnUnmount }) => { + [Procedure.query]: ({ path, target, abortOnUnmount }) => { const targetFn = target.query; return (input: any, opts?: any) => { @@ -601,7 +608,7 @@ const procedures: Record< }); }; }, - [ProcedureNames.serverQuery]: ({ + [Procedure.serverQuery]: ({ path, target, queryClient, @@ -660,7 +667,7 @@ const procedures: Record< }; }; }, - [ProcedureNames.infiniteQuery]: ({ path, target, abortOnUnmount }) => { + [Procedure.infiniteQuery]: ({ path, target, abortOnUnmount }) => { return (input: any, opts?: any) => { const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? abortOnUnmount; return createInfiniteQuery({ @@ -677,7 +684,7 @@ const procedures: Record< }); }; }, - [ProcedureNames.serverInfiniteQuery]: ({ + [Procedure.serverInfiniteQuery]: ({ path, target, queryClient, @@ -746,7 +753,7 @@ const procedures: Record< }; }; }, - [ProcedureNames.mutate]: ({ path, target }) => { + [Procedure.mutate]: ({ path, target }) => { return (opts?: any) => { return createMutation({ ...opts, @@ -755,7 +762,7 @@ const procedures: Record< }); }; }, - [ProcedureNames.subscribe]: ({ target }) => { + [Procedure.subscribe]: ({ target }) => { return (input: any, opts?: any) => { const enabled = opts?.enabled ?? true; if (!enabled) return; @@ -779,20 +786,22 @@ const procedures: Record< }); }; }, - [ProcedureNames.queries]: ({ path, queriesProxy }) => { + [Procedure.queries]: ({ path, queriesProxy }) => { if (path.length !== 0) return; - return (input: (...args: any[]) => any) => { - const proxy = queriesProxy(); - return createQueries(input(proxy)); + return (input: (...args: any[]) => any, opts?: any) => { + return createQueries({ + ...opts, + queries: input(queriesProxy()) + }); }; }, - [ProcedureNames.serverQueries]: ({ path, queriesProxy, queryClient }) => { + [Procedure.serverQueries]: ({ path, queriesProxy, queryClient }) => { if (path.length !== 0) return; const proxy = queriesProxy(); const defaultOptions = queryClient.getDefaultOptions(); - return async (input: (...args: any[]) => any) => { + return async (input: (...args: any[]) => any, opts?: any) => { const queries = await Promise.all( input(proxy).map(async (query: any) => { const cache = queryClient @@ -821,15 +830,18 @@ const procedures: Record< return (newInput?: (...args: any[]) => any) => { let newQueries = queries; if (newInput) newQueries = newInput(proxy, queries); - return createQueries({ queries: newQueries }); + return createQueries({ + ...opts, + queries: newQueries + }); }; }; }, - [ProcedureNames.utils]: ({ path, utilsProxy }) => { + [Procedure.utils]: ({ path, utilsProxy }) => { if (path.length !== 0) return; return utilsProxy; }, - [ProcedureNames.context]: ({ path, utilsProxy }) => { + [Procedure.context]: ({ path, utilsProxy }) => { if (path.length !== 0) return; return utilsProxy; }, @@ -872,14 +884,14 @@ function getArrayQueryKey( type GetQueryKey = [TInput] extends [undefined | void] ? { - [ProcedureNames.queryKey]: () => QueryKey; + [Procedure.queryKey]: () => QueryKey; } : { /** * Method to extract the query key for a procedure * @param type - defaults to `any` */ - [ProcedureNames.queryKey]: (input: TInput, type?: QueryType) => QueryKey; + [Procedure.queryKey]: (input: TInput, type?: QueryType) => QueryKey; } & {}; export function svelteQueryWrapper({ @@ -906,13 +918,13 @@ export function svelteQueryWrapper({ * * @see https://trpc.io/docs/client/react/useUtils */ - [ProcedureNames.context](): CreateUtils; + [Procedure.context](): CreateUtils; /** * @see https://trpc.io/docs/client/react/useUtils */ - [ProcedureNames.utils](): CreateUtils; - [ProcedureNames.queries]: CreateQueries; - [ProcedureNames.serverQueries]: CreateServerQueries< + [Procedure.utils](): CreateUtils; + [Procedure.queries]: CreateQueries; + [Procedure.serverQueries]: CreateServerQueries< Client, RouterError >;