diff --git a/README.md b/README.md
index 26394f2..106feb3 100644
--- a/README.md
+++ b/README.md
@@ -139,7 +139,7 @@ export function trpc(queryClient?: QueryClient) {
Which can then be used in a component as such:
```svelte
-
+
+
+{#if $foo.isPending}
+ Loading...
+{:else if $foo.isError}
+ {$foo.error}
+{:else if $foo.data}
+ {$foo.data}
+{/if}
+
+
+
+
+
+
+{#each $queries as query}
+ {#if query.isPending}
+ Loading...
+ {:else if query.isError}
+ {query.error.message}
+ {:else if query.data}
+ {query.data}
+ {/if}
+
+{/each}
+
+
+```
+
[npm-url]: https://npmjs.org/package/trpc-svelte-query-adapter
[npm-image]: https://img.shields.io/npm/v/trpc-svelte-query-adapter.svg
[license-url]: LICENSE
diff --git a/package.json b/package.json
index 764fb85..f8913f1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "trpc-svelte-query-adapter",
- "version": "2.2.7",
+ "version": "2.3.0",
"description": "A simple adapter to use `@tanstack/svelte-query` with trpc, similar to `@trpc/react-query`.",
"keywords": [
"trpc",
@@ -30,7 +30,8 @@
"main": "dist/index.js",
"types": "dist/index.d.ts",
"scripts": {
- "build": "tsc"
+ "build": "tsc",
+ "lint": "eslint src/**/* --ext .js --ext .ts"
},
"dependencies": {
"proxy-deep": "^3.1.1"
diff --git a/src/index.ts b/src/index.ts
index 54385c4..02052d6 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -172,7 +172,7 @@ type CreateServerQueriesRecord = { [K in keyof TClient]:
type CreateServerQueries = []>(
queriesCallback: (t: CreateServerQueriesRecord, TError>) => readonly [...TOpts]
-) => Promise<() => CreateQueriesResult>
+) => Promise<(queriesCallback?: (t: CreateQueriesRecord, TError>, old: readonly [...TOpts]) => readonly [...TOpts]) => CreateQueriesResult>
// Procedures
const ProcedureNames = {
@@ -204,7 +204,7 @@ type CreateQueryProcedure = {
[ProcedureNames.query]: (input: TInput, opts?: CreateTRPCQueryOptions & TRPCQueryOpts)
=> CreateQueryResult,
[ProcedureNames.serverQuery]: (input: TInput, opts?: CreateTRPCServerQueryOptions & TRPCQueryOpts)
- => Promise<() => CreateQueryResult>,
+ => Promise<(input?: TInput | ((old: TInput) => TInput)) => CreateQueryResult>,
} & {}
type CreateTRPCInfiniteQueryOptions = Omit, 'queryKey' | 'queryFn'>;
@@ -225,7 +225,7 @@ type CreateInfiniteQueryProcedure = (TInput extends { c
[ProcedureNames.infiniteQuery]: (input: Omit, opts?: CreateTRPCInfiniteQueryOptions & InfiniteQueryOpts & TRPCQueryOpts)
=> CreateInfiniteQueryResult, TError>,
[ProcedureNames.serverInfiniteQuery]: (input: Omit, opts?: CreateTRPCServerInfiniteQueryOptions & InfiniteQueryOpts & TRPCQueryOpts)
- => Promise<() => CreateInfiniteQueryResult, TError>>,
+ => Promise<(input?: TInput | ((old: TInput) => TInput)) => CreateInfiniteQueryResult, TError>>,
}
: {}) & {}
@@ -458,13 +458,28 @@ const procedures: Record createQuery({
- ...opts,
- ...query,
- ...(cacheNotFound ?
- { refetchOnMount: opts?.refetchOnMount ?? false } : {}
- ),
- });
+ return (newInput?: any) => {
+ let newQuery = query;
+
+ if (newInput) {
+ let i = newInput;
+ if (typeof newInput === 'function') i = newInput(input);
+ newQuery = {
+ queryKey: getArrayQueryKey(path, i, 'query'),
+ queryFn: ({ signal }) => targetFn(i, {
+ ...(shouldAbortOnUnmount && { signal }),
+ }),
+ };
+ }
+
+ return createQuery({
+ ...opts,
+ ...newQuery,
+ ...(cacheNotFound ?
+ { refetchOnMount: opts?.refetchOnMount ?? false } : {}
+ ),
+ });
+ };
};
},
[ProcedureNames.infiniteQuery]: ({ path, target, abortOnUnmount }) => {
@@ -502,13 +517,30 @@ const procedures: Record createInfiniteQuery({
- ...opts,
- ...query,
- ...(cacheNotFound ?
- { refetchOnMount: opts?.refetchOnMount ?? false } : {}
- ),
- });
+ return (newInput?: any) => {
+ let newQuery = query;
+
+ if (newInput) {
+ let i = newInput;
+ if (typeof newInput === 'function') i = newInput(input);
+ newQuery = {
+ queryKey: getArrayQueryKey(path, i, 'infinite'),
+ queryFn: ({ pageParam, signal }) => targetFn({
+ ...i,
+ cursor: pageParam ?? opts?.initialCursor,
+ ...(shouldAbortOnUnmount && { signal }),
+ }),
+ };
+ }
+
+ return createInfiniteQuery({
+ ...opts,
+ ...newQuery,
+ ...(cacheNotFound ?
+ { refetchOnMount: opts?.refetchOnMount ?? false } : {}
+ ),
+ });
+ };
};
},
[ProcedureNames.mutate]: ({ path, target }) => {
@@ -556,7 +588,7 @@ const procedures: Record any) => {
- const queryKeys = await Promise.all(
+ const queries = await Promise.all(
input(proxy).map(async (query: any) => {
const cache = queryClient.getQueryCache().find(query.queryKey);
const cacheNotFound = !cache?.state?.data;
@@ -573,7 +605,12 @@ const procedures: Record createQueries({ queries: queryKeys });
+
+ return (newInput?: (...args: any[]) => any) => {
+ let newQueries = queries;
+ if (newInput) newQueries = newInput(proxy, queries);
+ return createQueries({ queries: newQueries });
+ };
};
},
[ProcedureNames.utils]: ({ path, utilsProxy }) => {
@@ -674,6 +711,7 @@ export function svelteQueryWrapper({
}
return this.nest(() => { });
},
- }
- );
+ });
}
+
+