diff --git a/packages/plugins/tanstack-query/package.json b/packages/plugins/tanstack-query/package.json index 13e872df4..b25a085b8 100644 --- a/packages/plugins/tanstack-query/package.json +++ b/packages/plugins/tanstack-query/package.json @@ -83,6 +83,7 @@ "jest": "^29.5.0", "react": "18.2.0", "rimraf": "^3.0.2", + "svelte": "^4.2.1", "swr": "^2.0.3", "ts-jest": "^29.0.5", "typescript": "^4.9.4", diff --git a/packages/plugins/tanstack-query/src/generator.ts b/packages/plugins/tanstack-query/src/generator.ts index eae049be2..3b1432bb2 100644 --- a/packages/plugins/tanstack-query/src/generator.ts +++ b/packages/plugins/tanstack-query/src/generator.ts @@ -418,10 +418,14 @@ function generateIndex(project: Project, outDir: string, models: DataModel[], ta sf.addStatements(`export { Provider } from '@zenstackhq/tanstack-query/runtime/react';`); break; case 'vue': - sf.addStatements(`export { VueQueryContextKey } from '@zenstackhq/tanstack-query/runtime/vue';`); + sf.addStatements( + `export { VueQueryContextKey, provideHooksContext } from '@zenstackhq/tanstack-query/runtime/vue';` + ); break; case 'svelte': - sf.addStatements(`export { SvelteQueryContextKey } from '@zenstackhq/tanstack-query/runtime/svelte';`); + sf.addStatements( + `export { SvelteQueryContextKey, setHooksContext } from '@zenstackhq/tanstack-query/runtime/svelte';` + ); break; } } diff --git a/packages/plugins/tanstack-query/src/runtime/common.ts b/packages/plugins/tanstack-query/src/runtime/common.ts index fb180dc16..d64c1ed25 100644 --- a/packages/plugins/tanstack-query/src/runtime/common.ts +++ b/packages/plugins/tanstack-query/src/runtime/common.ts @@ -24,7 +24,7 @@ export type APIContext = { /** * The endpoint to use for the queries. */ - endpoint: string; + endpoint?: string; /** * A custom fetch function for sending the HTTP requests. diff --git a/packages/plugins/tanstack-query/src/runtime/index.ts b/packages/plugins/tanstack-query/src/runtime/index.ts index e4853b9b7..d263dca77 100644 --- a/packages/plugins/tanstack-query/src/runtime/index.ts +++ b/packages/plugins/tanstack-query/src/runtime/index.ts @@ -1 +1,2 @@ export * from './prisma-types'; +export type { FetchFn } from './common'; diff --git a/packages/plugins/tanstack-query/src/runtime/svelte.ts b/packages/plugins/tanstack-query/src/runtime/svelte.ts index 3b888e87e..0f86292f5 100644 --- a/packages/plugins/tanstack-query/src/runtime/svelte.ts +++ b/packages/plugins/tanstack-query/src/runtime/svelte.ts @@ -10,7 +10,8 @@ import { type QueryClient, type QueryOptions, } from '@tanstack/svelte-query'; -import { FetchFn, QUERY_KEY_PREFIX, fetcher, makeUrl, marshal } from './common'; +import { setContext } from 'svelte'; +import { APIContext, FetchFn, QUERY_KEY_PREFIX, fetcher, makeUrl, marshal } from './common'; export { APIContext as RequestHandlerContext } from './common'; @@ -19,6 +20,13 @@ export { APIContext as RequestHandlerContext } from './common'; */ export const SvelteQueryContextKey = 'zenstack-svelte-query-context'; +/** + * Set context for the generated TanStack Query hooks. + */ +export function setHooksContext(context: APIContext) { + setContext(SvelteQueryContextKey, context); +} + /** * Creates a svelte-query query. * diff --git a/packages/plugins/tanstack-query/src/runtime/vue.ts b/packages/plugins/tanstack-query/src/runtime/vue.ts index 59eb9b0c6..2ea162649 100644 --- a/packages/plugins/tanstack-query/src/runtime/vue.ts +++ b/packages/plugins/tanstack-query/src/runtime/vue.ts @@ -11,16 +11,22 @@ import { type UseMutationOptions, type UseQueryOptions, } from '@tanstack/vue-query'; -import { inject } from 'vue'; -import { DEFAULT_QUERY_ENDPOINT, FetchFn, QUERY_KEY_PREFIX, fetcher, makeUrl, marshal } from './common'; -import { RequestHandlerContext } from './svelte'; +import { inject, provide } from 'vue'; +import { APIContext, DEFAULT_QUERY_ENDPOINT, FetchFn, QUERY_KEY_PREFIX, fetcher, makeUrl, marshal } from './common'; export { APIContext as RequestHandlerContext } from './common'; export const VueQueryContextKey = 'zenstack-vue-query-context'; +/** + * Provide context for the generated TanStack Query hooks. + */ +export function provideHooksContext(context: APIContext) { + provide(VueQueryContextKey, context); +} + export function getContext() { - return inject(VueQueryContextKey, { + return inject(VueQueryContextKey, { endpoint: DEFAULT_QUERY_ENDPOINT, fetch: undefined, }); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ce4536e9e..6f4e96cb5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -124,7 +124,7 @@ importers: version: 0.2.1 ts-jest: specifier: ^29.0.5 - version: 29.0.5(@babel/core@7.22.5)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.5) + version: 29.0.5(@babel/core@7.23.2)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.5) typescript: specifier: ^4.9.5 version: 4.9.5 @@ -248,7 +248,7 @@ importers: version: 4.29.7(react-dom@18.2.0)(react@18.2.0) '@tanstack/svelte-query': specifier: ^4.29.7 - version: 4.29.7(svelte@3.59.2) + version: 4.29.7(svelte@4.2.1) '@tanstack/vue-query': specifier: ^4.37.0 version: 4.37.0(vue@3.3.4) @@ -282,12 +282,15 @@ importers: rimraf: specifier: ^3.0.2 version: 3.0.2 + svelte: + specifier: ^4.2.1 + version: 4.2.1 swr: specifier: ^2.0.3 version: 2.0.3(react@18.2.0) ts-jest: specifier: ^29.0.5 - version: 29.0.5(@babel/core@7.23.2)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.4) + version: 29.0.5(@babel/core@7.22.5)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.4) typescript: specifier: ^4.9.4 version: 4.9.4 @@ -4219,7 +4222,7 @@ packages: debug: 4.3.4 deepmerge: 4.3.1 kleur: 4.1.5 - magic-string: 0.30.0 + magic-string: 0.30.4 svelte: 4.0.5 svelte-hmr: 0.15.2(svelte@4.0.5) vite: 4.4.11(@types/node@18.0.0) @@ -4294,13 +4297,13 @@ packages: use-sync-external-store: 1.2.0(react@18.2.0) dev: true - /@tanstack/svelte-query@4.29.7(svelte@3.59.2): + /@tanstack/svelte-query@4.29.7(svelte@4.2.1): resolution: {integrity: sha512-+GvOcGEiFZYj91luPcIIVakmDqXkS5tyWlBLf/zg9E9hohq7SiGug9C9DUWwvSBk80JefAOCioja5jrumrPp6Q==} peerDependencies: svelte: ^3.54.0 dependencies: '@tanstack/query-core': 4.29.7 - svelte: 3.59.2 + svelte: 4.2.1 dev: true /@tanstack/vue-query@4.37.0(vue@3.3.4): @@ -5371,12 +5374,12 @@ packages: negotiator: 0.6.3 dev: true - /acorn-jsx@5.3.2(acorn@8.9.0): + /acorn-jsx@5.3.2(acorn@8.10.0): resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} peerDependencies: acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 dependencies: - acorn: 8.9.0 + acorn: 8.10.0 dev: true /acorn-walk@8.2.0: @@ -7862,8 +7865,8 @@ packages: resolution: {integrity: sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} dependencies: - acorn: 8.9.0 - acorn-jsx: 5.3.2(acorn@8.9.0) + acorn: 8.10.0 + acorn-jsx: 5.3.2(acorn@8.10.0) eslint-visitor-keys: 3.4.1 dev: true @@ -10326,7 +10329,7 @@ packages: /mlly@1.4.0: resolution: {integrity: sha512-ua8PAThnTwpprIaU47EPeZ/bPUVp2QYBbWMphUQpVdBI3Lgqzm5KZQ45Agm3YJedHXaIHl6pBGabaLSUPPSptg==} dependencies: - acorn: 8.9.0 + acorn: 8.10.0 pathe: 1.1.1 pkg-types: 1.0.3 ufo: 1.3.1 @@ -12969,7 +12972,7 @@ packages: /strip-literal@1.0.1: resolution: {integrity: sha512-QZTsipNpa2Ppr6v1AmJHESqJ3Uz247MUS0OjrnnZjFAvEoWqxuyFuXn2xLgMtRnijJShAa1HL0gtJyUs7u7n3Q==} dependencies: - acorn: 8.9.0 + acorn: 8.10.0 dev: true /strip-literal@1.3.0: @@ -13118,11 +13121,6 @@ packages: svelte: 4.0.5 dev: true - /svelte@3.59.2: - resolution: {integrity: sha512-vzSyuGr3eEoAtT/A6bmajosJZIUWySzY2CzB3w2pgPvnkUjGqlDnsNnA0PMO+mMAhuyMul6C2uuZzY6ELSkzyA==} - engines: {node: '>= 8'} - dev: true - /svelte@4.0.5: resolution: {integrity: sha512-PHKPWP1wiWHBtsE57nCb8xiWB3Ht7/3Kvi3jac0XIxUM2rep8alO7YoAtgWeGD7++tFy46krilOrPW0mG3Dx+A==} engines: {node: '>=16'} @@ -13142,6 +13140,25 @@ packages: periscopic: 3.1.0 dev: true + /svelte@4.2.1: + resolution: {integrity: sha512-LpLqY2Jr7cRxkrTc796/AaaoMLF/1ax7cto8Ot76wrvKQhrPmZ0JgajiWPmg9mTSDqO16SSLiD17r9MsvAPTmw==} + engines: {node: '>=16'} + dependencies: + '@ampproject/remapping': 2.2.1 + '@jridgewell/sourcemap-codec': 1.4.15 + '@jridgewell/trace-mapping': 0.3.18 + acorn: 8.10.0 + aria-query: 5.3.0 + axobject-query: 3.2.1 + code-red: 1.0.3 + css-tree: 2.3.1 + estree-walker: 3.0.3 + is-reference: 3.0.1 + locate-character: 3.0.0 + magic-string: 0.30.4 + periscopic: 3.1.0 + dev: true + /svg-tags@1.0.0: resolution: {integrity: sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==} dev: true @@ -13482,7 +13499,7 @@ packages: yargs-parser: 21.1.1 dev: true - /ts-jest@29.0.5(@babel/core@7.22.5)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.5): + /ts-jest@29.0.5(@babel/core@7.22.5)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.4): resolution: {integrity: sha512-PL3UciSgIpQ7f6XjVOmbi96vmDHUqAyqDr8YxzopDqX3kfgYtX1cuNeBjP+L9sFXi6nzsGGA6R3fP3DDDJyrxA==} engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0} hasBin: true @@ -13513,7 +13530,7 @@ packages: lodash.memoize: 4.1.2 make-error: 1.3.6 semver: 7.5.3 - typescript: 4.9.5 + typescript: 4.9.4 yargs-parser: 21.1.1 dev: true @@ -13552,6 +13569,41 @@ packages: yargs-parser: 21.1.1 dev: true + /ts-jest@29.0.5(@babel/core@7.23.2)(esbuild@0.18.13)(jest@29.5.0)(typescript@4.9.5): + resolution: {integrity: sha512-PL3UciSgIpQ7f6XjVOmbi96vmDHUqAyqDr8YxzopDqX3kfgYtX1cuNeBjP+L9sFXi6nzsGGA6R3fP3DDDJyrxA==} + engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0} + hasBin: true + peerDependencies: + '@babel/core': '>=7.0.0-beta.0 <8' + '@jest/types': ^29.0.0 + babel-jest: ^29.0.0 + esbuild: '*' + jest: ^29.0.0 + typescript: '>=4.3' + peerDependenciesMeta: + '@babel/core': + optional: true + '@jest/types': + optional: true + babel-jest: + optional: true + esbuild: + optional: true + dependencies: + '@babel/core': 7.23.2 + bs-logger: 0.2.6 + esbuild: 0.18.13 + fast-json-stable-stringify: 2.1.0 + jest: 29.5.0(@types/node@18.0.0)(ts-node@10.9.1) + jest-util: 29.5.0 + json5: 2.2.3 + lodash.memoize: 4.1.2 + make-error: 1.3.6 + semver: 7.5.3 + typescript: 4.9.5 + yargs-parser: 21.1.1 + dev: true + /ts-morph@16.0.0: resolution: {integrity: sha512-jGNF0GVpFj0orFw55LTsQxVYEUOCWBAbR5Ls7fTYE5pQsbW18ssTb/6UXx/GYAEjS+DQTp8VoTw0vqYMiaaQuw==} dependencies: