From 1afc5cb645cfaa5959fc005365d679cd6abdbb6d Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Sun, 8 Oct 2023 23:14:55 +0200 Subject: [PATCH 1/9] fix: support for refs in `tanstack-query-vue` --- examples/react-query/src/App.tsx | 9 +- examples/react-query/src/mocks/index.ts | 13 +- examples/vue-query/.codesandbox/Dockerfile | 1 + examples/vue-query/.codesandbox/build.js | 25 ++ examples/vue-query/.codesandbox/tasks.json | 35 ++ examples/vue-query/index.html | 11 + examples/vue-query/package.json | 7 +- .../vue-query/public/mockServiceWorker.js | 303 ++++++++++++++++++ examples/vue-query/shims-vue.d.ts | 6 + examples/vue-query/src/App.vue | 25 ++ examples/vue-query/src/Pets.vue | 42 +++ .../vue-query/src/gen/hooks/useDeleteOrder.ts | 7 +- .../vue-query/src/gen/hooks/useDeletePet.ts | 8 +- .../vue-query/src/gen/hooks/useDeleteUser.ts | 7 +- .../src/gen/hooks/useFindPetsByStatus.ts | 13 +- .../src/gen/hooks/useFindPetsByTags.ts | 13 +- .../src/gen/hooks/useGetInventory.ts | 4 +- .../src/gen/hooks/useGetOrderById.ts | 21 +- .../vue-query/src/gen/hooks/useGetPetById.ts | 21 +- .../src/gen/hooks/useGetUserByName.ts | 21 +- .../vue-query/src/gen/hooks/useLoginUser.ts | 13 +- .../vue-query/src/gen/hooks/useLogoutUser.ts | 4 +- .../vue-query/src/gen/hooks/useUpdatePet.ts | 2 +- .../src/gen/hooks/useUpdatePetWithForm.ts | 8 +- .../vue-query/src/gen/hooks/useUpdateUser.ts | 5 +- .../vue-query/src/gen/hooks/useUploadFile.ts | 8 +- examples/vue-query/src/main.ts | 25 ++ examples/vue-query/src/mocks/index.ts | 25 ++ examples/vue-query/tsconfig.json | 9 +- examples/vue-query/vite.config.ts | 10 + .../src/builders/QueryBuilder.ts | 148 ++++++--- .../src/generators/OperationGenerator.ts | 9 + packages/swagger/src/utils/getParams.ts | 17 +- pnpm-lock.yaml | 70 ++-- 34 files changed, 814 insertions(+), 131 deletions(-) create mode 100644 examples/vue-query/.codesandbox/Dockerfile create mode 100644 examples/vue-query/.codesandbox/build.js create mode 100644 examples/vue-query/.codesandbox/tasks.json create mode 100644 examples/vue-query/index.html create mode 100644 examples/vue-query/public/mockServiceWorker.js create mode 100644 examples/vue-query/shims-vue.d.ts create mode 100644 examples/vue-query/src/App.vue create mode 100644 examples/vue-query/src/Pets.vue create mode 100644 examples/vue-query/src/main.ts create mode 100644 examples/vue-query/src/mocks/index.ts create mode 100644 examples/vue-query/vite.config.ts diff --git a/examples/react-query/src/App.tsx b/examples/react-query/src/App.tsx index fad54f597..af55ef911 100644 --- a/examples/react-query/src/App.tsx +++ b/examples/react-query/src/App.tsx @@ -1,15 +1,20 @@ +import { useState } from 'react' +import type { FindPetsByStatusQueryParamsStatus } from './gen' import { useFindPetsByStatusHook } from './gen' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' const queryClient = new QueryClient() function Pets(): JSX.Element { - const { data: pets } = useFindPetsByStatusHook({ status: 'available' }) + const [status, setStatus] = useState('available') + const { data: pets } = useFindPetsByStatusHook({ status }) return ( <> -

Pets:

+

Pets: {status}

+ + ) } diff --git a/examples/react-query/src/mocks/index.ts b/examples/react-query/src/mocks/index.ts index a2fd2a057..7309d8e98 100644 --- a/examples/react-query/src/mocks/index.ts +++ b/examples/react-query/src/mocks/index.ts @@ -1,7 +1,18 @@ import { setupWorker, rest } from 'msw' export const worker = setupWorker( - rest.get('/pets', (req, res, ctx) => { + rest.get('/pet/findByStatus', (req, res, ctx) => { + if (req.params['status'] === 'pending') { + return res( + ctx.json([ + { + id: '1234', + name: 'Lily(pending)', + }, + ]), + ) + } + return res( ctx.json([ { diff --git a/examples/vue-query/.codesandbox/Dockerfile b/examples/vue-query/.codesandbox/Dockerfile new file mode 100644 index 000000000..3739923ce --- /dev/null +++ b/examples/vue-query/.codesandbox/Dockerfile @@ -0,0 +1 @@ +FROM node:18-bullseye \ No newline at end of file diff --git a/examples/vue-query/.codesandbox/build.js b/examples/vue-query/.codesandbox/build.js new file mode 100644 index 000000000..84777a93f --- /dev/null +++ b/examples/vue-query/.codesandbox/build.js @@ -0,0 +1,25 @@ +import fs from "node:fs"; + +const pkgJsonPaths = [ + "package.json", +]; +try { + for (const pkgJsonPath of pkgJsonPaths) { + const pkg = JSON.parse(fs.readFileSync(pkgJsonPath, "utf-8")); + const oldVersion = "workspace:*"; + const newVersion = "latest"; + + const content = JSON.stringify(pkg, null, "\t") + "\n"; + const newContent = content + // @ts-ignore + .replaceAll( + `"${oldVersion}"`, + `"${newVersion}"`, + ) + + fs.writeFileSync(pkgJsonPath, newContent); + } +} catch (error) { + console.error(error); + process.exit(1); +} \ No newline at end of file diff --git a/examples/vue-query/.codesandbox/tasks.json b/examples/vue-query/.codesandbox/tasks.json new file mode 100644 index 000000000..a527e3d0f --- /dev/null +++ b/examples/vue-query/.codesandbox/tasks.json @@ -0,0 +1,35 @@ +{ + "$schema": "https://codesandbox.io/schemas/tasks.json", + // These tasks will run in order when initializing your CodeSandbox project. + "setupTasks": [ + { + "name": "Replace workspace:* by latest", + "command": "node ./.codesandbox/build.js" + }, + { + "name": "Install Dependencies", + "command": "corepack enable && pnpm install" + } + ], + // These tasks can be run from CodeSandbox. Running one will open a log in the app. + "tasks": { + "dev": { + "name": "dev", + "command": "pnpm dev", + "runAtStart": true, + "preview": { + "port": 5173 + } + }, + "build": { + "name": "build", + "command": "pnpm build", + "runAtStart": false + }, + "update": { + "name": "update", + "command": "pnpm update", + "runAtStart": false + } + } +} \ No newline at end of file diff --git a/examples/vue-query/index.html b/examples/vue-query/index.html new file mode 100644 index 000000000..db807cd00 --- /dev/null +++ b/examples/vue-query/index.html @@ -0,0 +1,11 @@ + + + + + + + +
+ + + diff --git a/examples/vue-query/package.json b/examples/vue-query/package.json index 6cfbb3c5b..b3a500758 100644 --- a/examples/vue-query/package.json +++ b/examples/vue-query/package.json @@ -12,7 +12,9 @@ "sideEffects": false, "type": "module", "scripts": { - "build": "tsup", + "build": "tsup && vite build", + "clean": "npx rimraf ./dist", + "dev": "vite", "generate": "kubb generate", "start": "tsup --watch", "test": "vitest", @@ -31,8 +33,11 @@ "vue": "^3.3.4" }, "devDependencies": { + "@vitejs/plugin-vue": "^4.4.0", "@kubb/ts-config": "workspace:*", + "vite": "^4.4.11", "tsup": "^7.2.0", + "msw": "^1.3.2", "typescript": "^5.2.2" }, "packageManager": "pnpm@8.3.0", diff --git a/examples/vue-query/public/mockServiceWorker.js b/examples/vue-query/public/mockServiceWorker.js new file mode 100644 index 000000000..8ee70b3e4 --- /dev/null +++ b/examples/vue-query/public/mockServiceWorker.js @@ -0,0 +1,303 @@ +/* eslint-disable */ +/* tslint:disable */ + +/** + * Mock Service Worker (1.2.2). + * @see https://github.com/mswjs/msw + * - Please do NOT modify this file. + * - Please do NOT serve this file on production. + */ + +const INTEGRITY_CHECKSUM = '3d6b9f06410d179a7f7404d4bf4c3c70' +const activeClientIds = new Set() + +self.addEventListener('install', function () { + self.skipWaiting() +}) + +self.addEventListener('activate', function (event) { + event.waitUntil(self.clients.claim()) +}) + +self.addEventListener('message', async function (event) { + const clientId = event.source.id + + if (!clientId || !self.clients) { + return + } + + const client = await self.clients.get(clientId) + + if (!client) { + return + } + + const allClients = await self.clients.matchAll({ + type: 'window', + }) + + switch (event.data) { + case 'KEEPALIVE_REQUEST': { + sendToClient(client, { + type: 'KEEPALIVE_RESPONSE', + }) + break + } + + case 'INTEGRITY_CHECK_REQUEST': { + sendToClient(client, { + type: 'INTEGRITY_CHECK_RESPONSE', + payload: INTEGRITY_CHECKSUM, + }) + break + } + + case 'MOCK_ACTIVATE': { + activeClientIds.add(clientId) + + sendToClient(client, { + type: 'MOCKING_ENABLED', + payload: true, + }) + break + } + + case 'MOCK_DEACTIVATE': { + activeClientIds.delete(clientId) + break + } + + case 'CLIENT_CLOSED': { + activeClientIds.delete(clientId) + + const remainingClients = allClients.filter((client) => { + return client.id !== clientId + }) + + // Unregister itself when there are no more clients + if (remainingClients.length === 0) { + self.registration.unregister() + } + + break + } + } +}) + +self.addEventListener('fetch', function (event) { + const { request } = event + const accept = request.headers.get('accept') || '' + + // Bypass server-sent events. + if (accept.includes('text/event-stream')) { + return + } + + // Bypass navigation requests. + if (request.mode === 'navigate') { + return + } + + // Opening the DevTools triggers the "only-if-cached" request + // that cannot be handled by the worker. Bypass such requests. + if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') { + return + } + + // Bypass all requests when there are no active clients. + // Prevents the self-unregistered worked from handling requests + // after it's been deleted (still remains active until the next reload). + if (activeClientIds.size === 0) { + return + } + + // Generate unique request ID. + const requestId = Math.random().toString(16).slice(2) + + event.respondWith( + handleRequest(event, requestId).catch((error) => { + if (error.name === 'NetworkError') { + console.warn( + '[MSW] Successfully emulated a network error for the "%s %s" request.', + request.method, + request.url, + ) + return + } + + // At this point, any exception indicates an issue with the original request/response. + console.error( + `\ +[MSW] Caught an exception from the "%s %s" request (%s). This is probably not a problem with Mock Service Worker. There is likely an additional logging output above.`, + request.method, + request.url, + `${error.name}: ${error.message}`, + ) + }), + ) +}) + +async function handleRequest(event, requestId) { + const client = await resolveMainClient(event) + const response = await getResponse(event, client, requestId) + + // Send back the response clone for the "response:*" life-cycle events. + // Ensure MSW is active and ready to handle the message, otherwise + // this message will pend indefinitely. + if (client && activeClientIds.has(client.id)) { + ;(async function () { + const clonedResponse = response.clone() + sendToClient(client, { + type: 'RESPONSE', + payload: { + requestId, + type: clonedResponse.type, + ok: clonedResponse.ok, + status: clonedResponse.status, + statusText: clonedResponse.statusText, + body: + clonedResponse.body === null ? null : await clonedResponse.text(), + headers: Object.fromEntries(clonedResponse.headers.entries()), + redirected: clonedResponse.redirected, + }, + }) + })() + } + + return response +} + +// Resolve the main client for the given event. +// Client that issues a request doesn't necessarily equal the client +// that registered the worker. It's with the latter the worker should +// communicate with during the response resolving phase. +async function resolveMainClient(event) { + const client = await self.clients.get(event.clientId) + + if (client?.frameType === 'top-level') { + return client + } + + const allClients = await self.clients.matchAll({ + type: 'window', + }) + + return allClients + .filter((client) => { + // Get only those clients that are currently visible. + return client.visibilityState === 'visible' + }) + .find((client) => { + // Find the client ID that's recorded in the + // set of clients that have registered the worker. + return activeClientIds.has(client.id) + }) +} + +async function getResponse(event, client, requestId) { + const { request } = event + const clonedRequest = request.clone() + + function passthrough() { + // Clone the request because it might've been already used + // (i.e. its body has been read and sent to the client). + const headers = Object.fromEntries(clonedRequest.headers.entries()) + + // Remove MSW-specific request headers so the bypassed requests + // comply with the server's CORS preflight check. + // Operate with the headers as an object because request "Headers" + // are immutable. + delete headers['x-msw-bypass'] + + return fetch(clonedRequest, { headers }) + } + + // Bypass mocking when the client is not active. + if (!client) { + return passthrough() + } + + // Bypass initial page load requests (i.e. static assets). + // The absence of the immediate/parent client in the map of the active clients + // means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet + // and is not ready to handle requests. + if (!activeClientIds.has(client.id)) { + return passthrough() + } + + // Bypass requests with the explicit bypass header. + // Such requests can be issued by "ctx.fetch()". + if (request.headers.get('x-msw-bypass') === 'true') { + return passthrough() + } + + // Notify the client that a request has been intercepted. + const clientMessage = await sendToClient(client, { + type: 'REQUEST', + payload: { + id: requestId, + url: request.url, + method: request.method, + headers: Object.fromEntries(request.headers.entries()), + cache: request.cache, + mode: request.mode, + credentials: request.credentials, + destination: request.destination, + integrity: request.integrity, + redirect: request.redirect, + referrer: request.referrer, + referrerPolicy: request.referrerPolicy, + body: await request.text(), + bodyUsed: request.bodyUsed, + keepalive: request.keepalive, + }, + }) + + switch (clientMessage.type) { + case 'MOCK_RESPONSE': { + return respondWithMock(clientMessage.data) + } + + case 'MOCK_NOT_FOUND': { + return passthrough() + } + + case 'NETWORK_ERROR': { + const { name, message } = clientMessage.data + const networkError = new Error(message) + networkError.name = name + + // Rejecting a "respondWith" promise emulates a network error. + throw networkError + } + } + + return passthrough() +} + +function sendToClient(client, message) { + return new Promise((resolve, reject) => { + const channel = new MessageChannel() + + channel.port1.onmessage = (event) => { + if (event.data && event.data.error) { + return reject(event.data.error) + } + + resolve(event.data) + } + + client.postMessage(message, [channel.port2]) + }) +} + +function sleep(timeMs) { + return new Promise((resolve) => { + setTimeout(resolve, timeMs) + }) +} + +async function respondWithMock(response) { + await sleep(response.delay) + return new Response(response.body, response) +} diff --git a/examples/vue-query/shims-vue.d.ts b/examples/vue-query/shims-vue.d.ts new file mode 100644 index 000000000..c458ab5a3 --- /dev/null +++ b/examples/vue-query/shims-vue.d.ts @@ -0,0 +1,6 @@ +declare module '*.vue' { + import { DefineComponent } from 'vue' + // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types + const component: DefineComponent<{}, {}, any> + export default component +} diff --git a/examples/vue-query/src/App.vue b/examples/vue-query/src/App.vue new file mode 100644 index 000000000..3ef438286 --- /dev/null +++ b/examples/vue-query/src/App.vue @@ -0,0 +1,25 @@ + + + + diff --git a/examples/vue-query/src/Pets.vue b/examples/vue-query/src/Pets.vue new file mode 100644 index 000000000..8fc8bb6c4 --- /dev/null +++ b/examples/vue-query/src/Pets.vue @@ -0,0 +1,42 @@ + + + + diff --git a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts index 0a8ada5c1..9f42d5c8a 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -11,14 +13,15 @@ import type { DeleteOrderMutationResponse, DeleteOrderPathParams, DeleteOrder400 * @link /store/order/:orderId */ -export function useDeleteOrder( - orderId: DeleteOrderPathParams['orderId'], +export function useDeleteOrder( + refOrderId: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const orderId = unref(refOrderId) return useMutation, TError, void, unknown>({ mutationFn: () => { diff --git a/examples/vue-query/src/gen/hooks/useDeletePet.ts b/examples/vue-query/src/gen/hooks/useDeletePet.ts index 28ffca2c9..23046636b 100644 --- a/examples/vue-query/src/gen/hooks/useDeletePet.ts +++ b/examples/vue-query/src/gen/hooks/useDeletePet.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -12,14 +14,16 @@ import type { DeletePetMutationResponse, DeletePetPathParams, DeletePetHeaderPar */ export function useDeletePet( - petId: DeletePetPathParams['petId'], - headers?: DeletePetHeaderParams, + refPetId: MaybeRef, + refHeaders?: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const petId = unref(refPetId) + const headers = unref(refHeaders) return useMutation, TError, void, unknown>({ mutationFn: () => { diff --git a/examples/vue-query/src/gen/hooks/useDeleteUser.ts b/examples/vue-query/src/gen/hooks/useDeleteUser.ts index 7db26d5c9..d198251e2 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteUser.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteUser.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -11,14 +13,15 @@ import type { DeleteUserMutationResponse, DeleteUserPathParams, DeleteUser400 } * @link /user/:username */ -export function useDeleteUser( - username: DeleteUserPathParams['username'], +export function useDeleteUser( + refUsername: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const username = unref(refUsername) return useMutation, TError, void, unknown>({ mutationFn: () => { diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts index 066366ece..79358a5c6 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (refParams?: MaybeRef) => { + const params = unref(refParams) + + return [`/pet/findByStatus`, ...(params ? [params] : [])] as const +} export function findPetsByStatusQueryOptions( - params?: FindPetsByStatusQueryParams, + refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const params = unref(refParams) const queryKey = findPetsByStatusQueryKey(params) return { @@ -32,7 +39,7 @@ export function findPetsByStatusQueryOptions( - params?: FindPetsByStatusQueryParams, + params?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts index 3064e5d49..420b125ff 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (refParams?: MaybeRef) => { + const params = unref(refParams) + + return [`/pet/findByTags`, ...(params ? [params] : [])] as const +} export function findPetsByTagsQueryOptions( - params?: FindPetsByTagsQueryParams, + refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const params = unref(refParams) const queryKey = findPetsByTagsQueryKey(params) return { @@ -32,7 +39,7 @@ export function findPetsByTagsQueryOptions( - params?: FindPetsByTagsQueryParams, + params?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> diff --git a/examples/vue-query/src/gen/hooks/useGetInventory.ts b/examples/vue-query/src/gen/hooks/useGetInventory.ts index 084735d29..a29c78163 100644 --- a/examples/vue-query/src/gen/hooks/useGetInventory.ts +++ b/examples/vue-query/src/gen/hooks/useGetInventory.ts @@ -3,7 +3,9 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => [`/store/inventory`] as const +export const getInventoryQueryKey = () => { + return [`/store/inventory`] as const +} export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/useGetOrderById.ts b/examples/vue-query/src/gen/hooks/useGetOrderById.ts index 3846e4a12..9244620b9 100644 --- a/examples/vue-query/src/gen/hooks/useGetOrderById.ts +++ b/examples/vue-query/src/gen/hooks/useGetOrderById.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [`/store/order/${orderId}`] as const +export const getOrderByIdQueryKey = (refOrderId: MaybeRef) => { + const orderId = unref(refOrderId) -export function getOrderByIdQueryOptions( - orderId: GetOrderByIdPathParams['orderId'], + return [`/store/order/${orderId}`] as const +} + +export function getOrderByIdQueryOptions( + refOrderId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const orderId = unref(refOrderId) const queryKey = getOrderByIdQueryKey(orderId) return { @@ -30,18 +37,18 @@ export function getOrderByIdQueryOptions( - orderId: GetOrderByIdPathParams['orderId'], +export function useGetOrderById( + refOrderId: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? getOrderByIdQueryKey(orderId) + const queryKey = queryOptions?.queryKey ?? getOrderByIdQueryKey(refOrderId) const query = useQuery({ - ...getOrderByIdQueryOptions(orderId, clientOptions), + ...getOrderByIdQueryOptions(refOrderId, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/examples/vue-query/src/gen/hooks/useGetPetById.ts b/examples/vue-query/src/gen/hooks/useGetPetById.ts index e1f51a83e..b3520606f 100644 --- a/examples/vue-query/src/gen/hooks/useGetPetById.ts +++ b/examples/vue-query/src/gen/hooks/useGetPetById.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (refPetId: MaybeRef) => { + const petId = unref(refPetId) -export function getPetByIdQueryOptions( - petId: GetPetByIdPathParams['petId'], + return [`/pet/${petId}`] as const +} + +export function getPetByIdQueryOptions( + refPetId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const petId = unref(refPetId) const queryKey = getPetByIdQueryKey(petId) return { @@ -30,18 +37,18 @@ export function getPetByIdQueryOptions( - petId: GetPetByIdPathParams['petId'], +export function useGetPetById( + refPetId: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? getPetByIdQueryKey(petId) + const queryKey = queryOptions?.queryKey ?? getPetByIdQueryKey(refPetId) const query = useQuery({ - ...getPetByIdQueryOptions(petId, clientOptions), + ...getPetByIdQueryOptions(refPetId, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/examples/vue-query/src/gen/hooks/useGetUserByName.ts b/examples/vue-query/src/gen/hooks/useGetUserByName.ts index d745a01e6..84cdd97e7 100644 --- a/examples/vue-query/src/gen/hooks/useGetUserByName.ts +++ b/examples/vue-query/src/gen/hooks/useGetUserByName.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (refUsername: MaybeRef) => { + const username = unref(refUsername) -export function getUserByNameQueryOptions( - username: GetUserByNamePathParams['username'], + return [`/user/${username}`] as const +} + +export function getUserByNameQueryOptions( + refUsername: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const username = unref(refUsername) const queryKey = getUserByNameQueryKey(username) return { @@ -29,18 +36,18 @@ export function getUserByNameQueryOptions( - username: GetUserByNamePathParams['username'], +export function useGetUserByName( + refUsername: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? getUserByNameQueryKey(username) + const queryKey = queryOptions?.queryKey ?? getUserByNameQueryKey(refUsername) const query = useQuery({ - ...getUserByNameQueryOptions(username, clientOptions), + ...getUserByNameQueryOptions(refUsername, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/examples/vue-query/src/gen/hooks/useLoginUser.ts b/examples/vue-query/src/gen/hooks/useLoginUser.ts index 652fbeecb..2b9196b3d 100644 --- a/examples/vue-query/src/gen/hooks/useLoginUser.ts +++ b/examples/vue-query/src/gen/hooks/useLoginUser.ts @@ -1,14 +1,21 @@ +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { QueryKey, UseQueryReturnType, UseQueryOptions } from '@tanstack/vue-query' import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (refParams?: MaybeRef) => { + const params = unref(refParams) + + return [`/user/login`, ...(params ? [params] : [])] as const +} export function loginUserQueryOptions( - params?: LoginUserQueryParams, + refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { + const params = unref(refParams) const queryKey = loginUserQueryKey(params) return { @@ -31,7 +38,7 @@ export function loginUserQueryOptions( - params?: LoginUserQueryParams, + params?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> diff --git a/examples/vue-query/src/gen/hooks/useLogoutUser.ts b/examples/vue-query/src/gen/hooks/useLogoutUser.ts index 69a8d7fc8..bda38609f 100644 --- a/examples/vue-query/src/gen/hooks/useLogoutUser.ts +++ b/examples/vue-query/src/gen/hooks/useLogoutUser.ts @@ -3,7 +3,9 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => { + return [`/user/logout`] as const +} export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/useUpdatePet.ts b/examples/vue-query/src/gen/hooks/useUpdatePet.ts index 0f3abea82..46cdef6aa 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePet.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePet.ts @@ -11,7 +11,7 @@ import type { UpdatePetMutationRequest, UpdatePetMutationResponse, UpdatePet400 * @link /pet */ -export function useUpdatePet( +export function useUpdatePet( options: { mutation?: VueMutationObserverOptions, TError, TVariables, unknown> client?: Partial>[0]> diff --git a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts index 447b61c93..2ce8f6f3b 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -16,14 +18,16 @@ import type { */ export function useUpdatePetWithForm( - petId: UpdatePetWithFormPathParams['petId'], - params?: UpdatePetWithFormQueryParams, + refPetId: MaybeRef, + refParams?: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const petId = unref(refPetId) + const params = unref(refParams) return useMutation, TError, void, unknown>({ mutationFn: () => { diff --git a/examples/vue-query/src/gen/hooks/useUpdateUser.ts b/examples/vue-query/src/gen/hooks/useUpdateUser.ts index 9e6cdd7d8..f0f3d6ce7 100644 --- a/examples/vue-query/src/gen/hooks/useUpdateUser.ts +++ b/examples/vue-query/src/gen/hooks/useUpdateUser.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -12,13 +14,14 @@ import type { UpdateUserMutationRequest, UpdateUserMutationResponse, UpdateUserP */ export function useUpdateUser( - username: UpdateUserPathParams['username'], + refUsername: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, TVariables, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const username = unref(refUsername) return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { diff --git a/examples/vue-query/src/gen/hooks/useUploadFile.ts b/examples/vue-query/src/gen/hooks/useUploadFile.ts index 1f2701695..6730f64f2 100644 --- a/examples/vue-query/src/gen/hooks/useUploadFile.ts +++ b/examples/vue-query/src/gen/hooks/useUploadFile.ts @@ -1,4 +1,6 @@ import type { VueMutationObserverOptions } from '@tanstack/vue-query/build/lib/useMutation' +import { unref } from 'vue' +import type { MaybeRef } from 'vue' import type { UseMutationReturnType } from '@tanstack/vue-query' import { useMutation } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' @@ -11,14 +13,16 @@ import type { UploadFileMutationRequest, UploadFileMutationResponse, UploadFileP */ export function useUploadFile( - petId: UploadFilePathParams['petId'], - params?: UploadFileQueryParams, + refPetId: MaybeRef, + refParams?: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, TVariables, unknown> client?: Partial>[0]> } = {}, ): UseMutationReturnType, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + const petId = unref(refPetId) + const params = unref(refParams) return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { diff --git a/examples/vue-query/src/main.ts b/examples/vue-query/src/main.ts new file mode 100644 index 000000000..a52c7ed6c --- /dev/null +++ b/examples/vue-query/src/main.ts @@ -0,0 +1,25 @@ +import { createApp } from 'vue' +import App from './App.vue' +import { VueQueryPlugin } from '@tanstack/vue-query' + +import { worker } from './mocks/index.ts' + +const render = () => { + const app = createApp(App) + app.use(VueQueryPlugin) + app.mount('#root') +} + +worker + .start({ + serviceWorker: { + /** + * Use a custom Service Worker script URL to resolve + * the mock worker served by CodeSandbox. + * @note You DO NOT need this in your application. + * @see https://mswjs.io/docs/api/setup-worker/start#serviceworker + */ + url: '/mockServiceWorker.js', + }, + }) + .then(() => render()) diff --git a/examples/vue-query/src/mocks/index.ts b/examples/vue-query/src/mocks/index.ts new file mode 100644 index 000000000..6c7eeb6cd --- /dev/null +++ b/examples/vue-query/src/mocks/index.ts @@ -0,0 +1,25 @@ +import { setupWorker, rest } from 'msw' + +export const worker = setupWorker( + rest.get('/pet/findByStatus', (req, res, ctx) => { + if (req.url.searchParams.get('status') === 'pending') { + return res( + ctx.json([ + { + id: '1234', + name: 'Lily(pending)', + }, + ]), + ) + } + + return res( + ctx.json([ + { + id: '1234', + name: 'Lily', + }, + ]), + ) + }), +) diff --git a/examples/vue-query/tsconfig.json b/examples/vue-query/tsconfig.json index 600a39d56..485239c69 100644 --- a/examples/vue-query/tsconfig.json +++ b/examples/vue-query/tsconfig.json @@ -5,7 +5,8 @@ "moduleResolution": "node", "sourceMap": true, "strictNullChecks": true, - "jsx": "react-jsx", + "jsx": "preserve", + "jsxImportSource": "vue", "declaration": true, "outDir": "es", "experimentalDecorators": true, @@ -61,11 +62,13 @@ ], "@kubb/ts-codegen": [ "../../packages/ts-codegen/src/index.ts" - ] + ], } }, "include": [ - "./src/**/*" + "./src/**/*", + "vite.config.ts", + "shims-vue.d.ts" ], "exclude": [ "**/node_modules", diff --git a/examples/vue-query/vite.config.ts b/examples/vue-query/vite.config.ts new file mode 100644 index 000000000..2cd4cfb5e --- /dev/null +++ b/examples/vue-query/vite.config.ts @@ -0,0 +1,10 @@ +import vue from '@vitejs/plugin-vue' +import { defineConfig } from 'vite' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue()], + optimizeDeps: { + include: ['axios'], + }, +}) diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index 5037bcb19..e8b344f91 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -7,7 +7,7 @@ import { OasBuilder, getComments, getDataParams } from '@kubb/swagger' import { URLPath, combineCodes } from '@kubb/core' import type { Operation, OperationSchemas } from '@kubb/swagger' import { getParams } from '@kubb/swagger' -import { camelCase } from 'change-case' +import { camelCase, pascalCase } from 'change-case' import type { Framework, FrameworkImports } from '../types.ts' import { createFunctionParams } from '@kubb/core' import type { Options as PluginOptions } from '../types' @@ -34,23 +34,40 @@ type QueryResult = { code: string; name: string } export class QueryBuilder extends OasBuilder { private get queryKey(): QueryResult { - const { operation, schemas } = this.config + const { operation, schemas, framework } = this.config const codes: string[] = [] const name = camelCase(`${operation.getOperationId()}QueryKey`) - const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + const paramsData = [ + ...getDataParams(schemas.pathParams, { + typed: true, + override: (item) => (framework === 'vue' ? { ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` } : item), + }), { - name: 'params', - type: schemas.queryParams?.name, + name: framework === 'vue' ? 'refParams' : 'params', + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, - ]) + ] + const params = createFunctionParams(paramsData) + + const unrefs = + framework === 'vue' && + paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') const result = [new URLPath(operation.path).template, schemas.queryParams?.name ? `...(params ? [params] : [])` : undefined].filter(Boolean) - codes.push(`export const ${name} = (${params}) => [${result.join(',')}] as const;`) + codes.push(`export const ${name} = (${params}) => { + ${unrefs} + + return [${result.join(',')}] as const; + }`) return { code: combineCodes(codes), name } } @@ -67,17 +84,20 @@ export class QueryBuilder extends OasBuilder { const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] const clientGenerics = ['TData', 'TError'] const queryGenerics = [dataReturnType === 'data' ? 'TData' : 'ResponseConfig', 'TError'] - const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + const paramsData = [ + ...getDataParams(schemas.pathParams, { + typed: true, + override: (item) => (framework === 'vue' ? { ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` } : item), + }), { - name: 'params', - type: schemas.queryParams?.name, + name: framework === 'vue' ? 'refParams' : 'params', + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', - type: schemas.headerParams?.name, + name: framework === 'vue' ? 'refHeaders' : 'headers', + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -86,7 +106,17 @@ export class QueryBuilder extends OasBuilder { type: 'Partial[0]>', default: '{}', }, - ]) + ] + const params = createFunctionParams(paramsData) + + const unrefs = + framework === 'vue' && + paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') let queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` if (framework === 'solid') { @@ -95,8 +125,9 @@ export class QueryBuilder extends OasBuilder { codes.push(` export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports.query.UseQueryOptions}<${queryGenerics.join(', ')}> { + ${unrefs} const queryKey = ${queryKey}; - + return { queryKey, queryFn: () => { @@ -122,23 +153,28 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. const queryKeyName = this.queryKey.name const queryOptionsName = this.queryOptions.name const name = frameworkImports.getName(operation) - const pathParams = getParams(schemas.pathParams) + const pathParams = getParams(schemas.pathParams, { + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }) const comments = getComments(operation) const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] const clientGenerics = ['TData', 'TError'] const queryGenerics = [dataReturnType === 'data' ? 'TData' : 'ResponseConfig', 'TError'] const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + ...getDataParams(schemas.pathParams, { + typed: true, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, + }), { name: 'params', - type: schemas.queryParams?.name, + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { name: 'headers', - type: schemas.headerParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -154,7 +190,10 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` const queryParams = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: false }), + ...getDataParams(schemas.pathParams, { + typed: false, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }), { name: 'params', enabled: !!schemas.queryParams?.name, @@ -206,17 +245,20 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] const clientGenerics = ['TData', 'TError'] const queryGenerics = [dataReturnType === 'data' ? 'TData' : 'ResponseConfig', 'TError'] - const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + const paramsData = [ + ...getDataParams(schemas.pathParams, { + typed: true, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, + }), { - name: 'params', - type: schemas.queryParams?.name, + name: framework === 'vue' ? 'refParams' : 'params', + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', - type: schemas.headerParams?.name, + name: framework === 'vue' ? 'refHeaders' : 'headers', + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -225,7 +267,17 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q type: 'Partial[0]>', default: '{}', }, - ]) + ] + const params = createFunctionParams(paramsData) + + const unrefs = + framework === 'vue' && + paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') let queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` if (framework === 'solid') { @@ -234,6 +286,7 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q codes.push(` export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports.query.UseInfiniteQueryOptions}<${queryGenerics.join(', ')}> { + ${unrefs} const queryKey = ${queryKey}; return { @@ -276,16 +329,19 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. const clientGenerics = ['TData', 'TError'] const queryGenerics = [dataReturnType === 'data' ? 'TData' : 'ResponseConfig', 'TError'] const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + ...getDataParams(schemas.pathParams, { + typed: true, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, + }), { name: 'params', - type: schemas.queryParams?.name, + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { name: 'headers', - type: schemas.headerParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -362,17 +418,20 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q schemas.request?.name ? `TVariables` : 'void', framework === 'vue' ? 'unknown' : undefined, ].filter(Boolean) - const params = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: true }), + const paramsData = [ + ...getDataParams(schemas.pathParams, { + typed: true, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, + }), { - name: 'params', - type: schemas.queryParams?.name, + name: framework === 'vue' ? 'refParams' : 'params', + type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', - type: schemas.headerParams?.name, + name: framework === 'vue' ? 'refHeaders' : 'headers', + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -384,13 +443,24 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q }`, default: '{}', }, - ]) + ] + const params = createFunctionParams(paramsData) + + const unrefs = + framework === 'vue' && + paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') codes.push(createJSDocBlockText({ comments })) codes.push(` export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.mutate.UseMutationResult}<${mutationGenerics.join(', ')}> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {}; - + ${unrefs} + return ${frameworkImports.mutate.useMutation}<${mutationGenerics.join(', ')}>({ mutationFn: (${schemas.request?.name ? 'data' : ''}) => { return client<${clientGenerics.filter((generic) => generic !== 'unknown').join(', ')}>({ diff --git a/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts b/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts index 981164c1d..1f014ef0d 100644 --- a/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts +++ b/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts @@ -240,6 +240,15 @@ export class OperationGenerator extends Generator { path: '@tanstack/vue-query/build/lib/useMutation', isTypeOnly: true, }, + { + name: ['unref'], + path: 'vue', + }, + { + name: ['MaybeRef'], + path: 'vue', + isTypeOnly: true, + }, { name: values.filter((item) => /[A-Z]/.test(item.charAt(0))), path: '@tanstack/vue-query', diff --git a/packages/swagger/src/utils/getParams.ts b/packages/swagger/src/utils/getParams.ts index 6e75e9519..8df07fe7d 100644 --- a/packages/swagger/src/utils/getParams.ts +++ b/packages/swagger/src/utils/getParams.ts @@ -3,21 +3,28 @@ import { createFunctionParams } from '@kubb/core' import type { OperationSchema } from '../types.ts' import { isParameterObject } from './isParameterObject' +type FunctionParamsAst = Parameters[0][number] + export function getDataParams( operationSchema: OperationSchema | undefined, - { typed }: { typed: boolean } = { typed: false }, -): Parameters[0] { + { typed = false, override }: { typed?: boolean; override?: (data: FunctionParamsAst) => FunctionParamsAst } = {}, +): FunctionParamsAst[] { if (!operationSchema || !operationSchema.schema.properties || !operationSchema.name) { return [] } return Object.entries(operationSchema.schema.properties).map(([name, schema]) => { const isParam = isParameterObject(schema) - return { name, required: isParam ? schema.required : undefined, type: typed ? `${operationSchema.name}["${name}"]` : undefined } + const data: FunctionParamsAst = { name, required: isParam ? schema.required : undefined, type: typed ? `${operationSchema.name}["${name}"]` : undefined } + + return override ? override(data) : data }) } -export function getParams(operationSchema: OperationSchema | undefined, { typed }: { typed: boolean } = { typed: false }): string { - const data = getDataParams(operationSchema, { typed }) +export function getParams( + operationSchema: OperationSchema | undefined, + { typed = false, override }: { typed?: boolean; override?: (data: FunctionParamsAst) => FunctionParamsAst } = {}, +): string { + const data = getDataParams(operationSchema, { typed, override }) if (!data?.length) { return '' diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 81377af77..63fa6dd76 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -636,12 +636,21 @@ importers: '@kubb/ts-config': specifier: workspace:* version: link:../../packages/config/ts-config + '@vitejs/plugin-vue': + specifier: ^4.4.0 + version: 4.4.0(vite@4.4.11)(vue@3.3.4) + msw: + specifier: ^1.3.2 + version: 1.3.2(typescript@5.2.2) tsup: specifier: ^7.2.0 version: 7.2.0(@swc/core@1.3.82)(ts-node@10.9.1)(typescript@5.2.2) typescript: specifier: ^5.2.2 version: 5.2.2 + vite: + specifier: ^4.4.11 + version: 4.4.11(@types/node@20.8.3) examples/zod: dependencies: @@ -1629,7 +1638,7 @@ packages: resolution: {integrity: sha512-KtLMbmicyuK2Ak/FTCJVbDnkN1SlT8/kceFTiuDiiRUUSMnHMidxSCdG4ndkTOHHpoomWe/4xkvHkEOncwjYIw==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 '@jridgewell/gen-mapping': 0.3.3 '@jridgewell/trace-mapping': 0.3.18 jsesc: 2.5.2 @@ -1685,7 +1694,7 @@ packages: engines: {node: '>=6.9.0'} dependencies: '@babel/template': 7.22.5 - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-function-name@7.23.0: @@ -1700,7 +1709,7 @@ packages: resolution: {integrity: sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-module-imports@7.22.15: @@ -1714,7 +1723,7 @@ packages: resolution: {integrity: sha512-8Dl6+HD/cKifutF5qGd/8ZJi84QeAKh+CEe1sBzz8UayBBGg1dAIJrdHOcOM5b2MpzWL2yuotJTtGjETq0qjXg==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-module-transforms@7.22.5: @@ -1728,7 +1737,7 @@ packages: '@babel/helper-validator-identifier': 7.22.5 '@babel/template': 7.22.5 '@babel/traverse': 7.22.8 - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 transitivePeerDependencies: - supports-color dev: true @@ -1756,21 +1765,21 @@ packages: resolution: {integrity: sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-split-export-declaration@7.22.5: resolution: {integrity: sha512-thqK5QFghPKWLhAV321lxF95yCg2K3Ob5yw+M3VHWfdia0IkPXUtoLH8x/6Fh486QUvzhb8YOWHChTVen2/PoQ==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-split-export-declaration@7.22.6: resolution: {integrity: sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==} engines: {node: '>=6.9.0'} dependencies: - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 dev: true /@babel/helper-string-parser@7.22.5: @@ -1780,7 +1789,6 @@ packages: /@babel/helper-validator-identifier@7.22.20: resolution: {integrity: sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==} engines: {node: '>=6.9.0'} - dev: true /@babel/helper-validator-identifier@7.22.5: resolution: {integrity: sha512-aJXu+6lErq8ltp+JhkJUfk1MTGyuA4v7f3pA+BJ5HLfNC6nAQ0Cpi9uOquUj8Hehg0aUiHzWQbOVJGao6ztBAQ==} @@ -1802,7 +1810,7 @@ packages: dependencies: '@babel/template': 7.22.5 '@babel/traverse': 7.22.8 - '@babel/types': 7.22.5 + '@babel/types': 7.23.0 transitivePeerDependencies: - supports-color dev: true @@ -1856,7 +1864,6 @@ packages: hasBin: true dependencies: '@babel/types': 7.23.0 - dev: true /@babel/plugin-transform-react-jsx-self@7.22.5(@babel/core@7.23.0): resolution: {integrity: sha512-nTh2ogNUtxbiSbxaT4Ds6aXnXEipHweN9YRgOX/oNXdf0cCrGn/+2LozFa3lnPV5D90MkjhgckCPBrsoSc1a7g==} @@ -1899,8 +1906,8 @@ packages: engines: {node: '>=6.9.0'} dependencies: '@babel/code-frame': 7.22.5 - '@babel/parser': 7.22.7 - '@babel/types': 7.22.5 + '@babel/parser': 7.23.0 + '@babel/types': 7.23.0 dev: true /@babel/traverse@7.22.5: @@ -1972,7 +1979,6 @@ packages: '@babel/helper-string-parser': 7.22.5 '@babel/helper-validator-identifier': 7.22.20 to-fast-properties: 2.0.0 - dev: true /@bcoe/v8-coverage@0.2.3: resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==} @@ -3082,6 +3088,17 @@ packages: - supports-color dev: true + /@vitejs/plugin-vue@4.4.0(vite@4.4.11)(vue@3.3.4): + resolution: {integrity: sha512-xdguqb+VUwiRpSg+nsc2HtbAUSGak25DXYvpQQi4RVU1Xq1uworyoH/md9Rfd8zMmPR/pSghr309QNcftUVseg==} + engines: {node: ^14.18.0 || >=16.0.0} + peerDependencies: + vite: ^4.0.0 + vue: ^3.2.25 + dependencies: + vite: 4.4.11(@types/node@20.8.3) + vue: 3.3.4 + dev: true + /@vitest/coverage-v8@0.34.6(vitest@0.34.6): resolution: {integrity: sha512-fivy/OK2d/EsJFoEoxHFEnNGTg+MmdZBAVK9Ka4qhXR2K3J0DS08vcGVwzDtXSuUMabLv4KtPcpSKkcMXFDViw==} peerDependencies: @@ -3157,36 +3174,32 @@ packages: '@vue/shared': 3.3.4 estree-walker: 2.0.2 source-map-js: 1.0.2 - dev: false /@vue/compiler-dom@3.3.4: resolution: {integrity: sha512-wyM+OjOVpuUukIq6p5+nwHYtj9cFroz9cwkfmP9O1nzH68BenTTv0u7/ndggT8cIQlnBeOo6sUT/gvHcIkLA5w==} dependencies: '@vue/compiler-core': 3.3.4 '@vue/shared': 3.3.4 - dev: false /@vue/compiler-sfc@3.3.4: resolution: {integrity: sha512-6y/d8uw+5TkCuzBkgLS0v3lSM3hJDntFEiUORM11pQ/hKvkhSKZrXW6i69UyXlJQisJxuUEJKAWEqWbWsLeNKQ==} dependencies: - '@babel/parser': 7.22.7 + '@babel/parser': 7.23.0 '@vue/compiler-core': 3.3.4 '@vue/compiler-dom': 3.3.4 '@vue/compiler-ssr': 3.3.4 '@vue/reactivity-transform': 3.3.4 '@vue/shared': 3.3.4 estree-walker: 2.0.2 - magic-string: 0.30.0 + magic-string: 0.30.1 postcss: 8.4.27 source-map-js: 1.0.2 - dev: false /@vue/compiler-ssr@3.3.4: resolution: {integrity: sha512-m0v6oKpup2nMSehwA6Uuu+j+wEwcy7QmwMkVNVfrV9P2qE5KshC6RwOCq8fjGS/Eak/uNb8AaWekfiXxbBB6gQ==} dependencies: '@vue/compiler-dom': 3.3.4 '@vue/shared': 3.3.4 - dev: false /@vue/devtools-api@6.5.0: resolution: {integrity: sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==} @@ -3195,25 +3208,22 @@ packages: /@vue/reactivity-transform@3.3.4: resolution: {integrity: sha512-MXgwjako4nu5WFLAjpBnCj/ieqcjE2aJBINUNQzkZQfzIZA4xn+0fV1tIYBJvvva3N3OvKGofRLvQIwEQPpaXw==} dependencies: - '@babel/parser': 7.22.7 + '@babel/parser': 7.23.0 '@vue/compiler-core': 3.3.4 '@vue/shared': 3.3.4 estree-walker: 2.0.2 magic-string: 0.30.1 - dev: false /@vue/reactivity@3.3.4: resolution: {integrity: sha512-kLTDLwd0B1jG08NBF3R5rqULtv/f8x3rOFByTDz4J53ttIQEDmALqKqXY0J+XQeN0aV2FBxY8nJDf88yvOPAqQ==} dependencies: '@vue/shared': 3.3.4 - dev: false /@vue/runtime-core@3.3.4: resolution: {integrity: sha512-R+bqxMN6pWO7zGI4OMlmvePOdP2c93GsHFM/siJI7O2nxFRzj55pLwkpCedEY+bTMgp5miZ8CxfIZo3S+gFqvA==} dependencies: '@vue/reactivity': 3.3.4 '@vue/shared': 3.3.4 - dev: false /@vue/runtime-dom@3.3.4: resolution: {integrity: sha512-Aj5bTJ3u5sFsUckRghsNjVTtxZQ1OyMWCr5dZRAPijF/0Vy4xEoRCwLyHXcj4D0UFbJ4lbx3gPTgg06K/GnPnQ==} @@ -3221,7 +3231,6 @@ packages: '@vue/runtime-core': 3.3.4 '@vue/shared': 3.3.4 csstype: 3.1.2 - dev: false /@vue/server-renderer@3.3.4(vue@3.3.4): resolution: {integrity: sha512-Q6jDDzR23ViIb67v+vM1Dqntu+HUexQcsWKhhQa4ARVzxOY2HbC7QRW/ggkDBd5BU+uM1sV6XOAP0b216o34JQ==} @@ -3231,11 +3240,9 @@ packages: '@vue/compiler-ssr': 3.3.4 '@vue/shared': 3.3.4 vue: 3.3.4 - dev: false /@vue/shared@3.3.4: resolution: {integrity: sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ==} - dev: false /@vueuse/core@10.4.1(vue@3.3.4): resolution: {integrity: sha512-DkHIfMIoSIBjMgRRvdIvxsyboRZQmImofLyOHADqiVbQVilP8VVHDhBX2ZqoItOgu7dWa8oXiNnScOdPLhdEXg==} @@ -4823,7 +4830,6 @@ packages: /estree-walker@2.0.2: resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} - dev: false /esutils@2.0.3: resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==} @@ -5860,13 +5866,6 @@ packages: es5-ext: 0.10.62 dev: false - /magic-string@0.30.0: - resolution: {integrity: sha512-LA+31JYDJLs82r2ScLrlz1GjSgu66ZV518eyWT+S8VhyQn/JL0u9MeBOvQMGYiPk1DBiSN9DDMOcXvigJZaViQ==} - engines: {node: '>=12'} - dependencies: - '@jridgewell/sourcemap-codec': 1.4.15 - dev: false - /magic-string@0.30.1: resolution: {integrity: sha512-mbVKXPmS0z0G4XqFDCTllmDQ6coZzn94aMlb0o/A4HEHJCKcanlDZwYJgwnkmgD3jyWhUgj9VsPrfd972yPffA==} engines: {node: '>=12'} @@ -8047,7 +8046,6 @@ packages: '@vue/runtime-dom': 3.3.4 '@vue/server-renderer': 3.3.4(vue@3.3.4) '@vue/shared': 3.3.4 - dev: false /wcwidth@1.0.1: resolution: {integrity: sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==} From 71293453933bc952d177a778ad6831d48f552bbc Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Sun, 8 Oct 2023 23:31:11 +0200 Subject: [PATCH 2/9] chore: fix issues for other tanstack frameworks --- examples/vue-query/package.json | 8 +- .../vue-query/src/gen/hooks/useDeleteOrder.ts | 3 +- .../vue-query/src/gen/hooks/useDeletePet.ts | 1 - .../vue-query/src/gen/hooks/useDeleteUser.ts | 3 +- .../src/gen/hooks/useFindPetsByStatus.ts | 1 - .../src/gen/hooks/useFindPetsByTags.ts | 1 - .../src/gen/hooks/useGetOrderById.ts | 5 +- .../vue-query/src/gen/hooks/useGetPetById.ts | 5 +- .../src/gen/hooks/useGetUserByName.ts | 5 +- .../vue-query/src/gen/hooks/useLoginUser.ts | 1 - .../vue-query/src/gen/hooks/useUpdatePet.ts | 2 +- .../src/gen/hooks/useUpdatePetWithForm.ts | 1 - .../vue-query/src/gen/hooks/useUpdateUser.ts | 1 - .../vue-query/src/gen/hooks/useUploadFile.ts | 1 - .../src/builders/QueryBuilder.ts | 93 +++++++++++-------- 15 files changed, 65 insertions(+), 66 deletions(-) diff --git a/examples/vue-query/package.json b/examples/vue-query/package.json index b3a500758..719820645 100644 --- a/examples/vue-query/package.json +++ b/examples/vue-query/package.json @@ -33,12 +33,12 @@ "vue": "^3.3.4" }, "devDependencies": { - "@vitejs/plugin-vue": "^4.4.0", "@kubb/ts-config": "workspace:*", - "vite": "^4.4.11", - "tsup": "^7.2.0", + "@vitejs/plugin-vue": "^4.4.0", "msw": "^1.3.2", - "typescript": "^5.2.2" + "tsup": "^7.2.0", + "typescript": "^5.2.2", + "vite": "^4.4.11" }, "packageManager": "pnpm@8.3.0", "engines": { diff --git a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts index 9f42d5c8a..666af5b0f 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts @@ -13,7 +13,7 @@ import type { DeleteOrderMutationResponse, DeleteOrderPathParams, DeleteOrder400 * @link /store/order/:orderId */ -export function useDeleteOrder( +export function useDeleteOrder( refOrderId: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> @@ -22,7 +22,6 @@ export function useDeleteOrder, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} const orderId = unref(refOrderId) - return useMutation, TError, void, unknown>({ mutationFn: () => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useDeletePet.ts b/examples/vue-query/src/gen/hooks/useDeletePet.ts index 23046636b..96d577486 100644 --- a/examples/vue-query/src/gen/hooks/useDeletePet.ts +++ b/examples/vue-query/src/gen/hooks/useDeletePet.ts @@ -24,7 +24,6 @@ export function useDeletePet, TError, void, unknown>({ mutationFn: () => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useDeleteUser.ts b/examples/vue-query/src/gen/hooks/useDeleteUser.ts index d198251e2..78c1ecf5f 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteUser.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteUser.ts @@ -13,7 +13,7 @@ import type { DeleteUserMutationResponse, DeleteUserPathParams, DeleteUser400 } * @link /user/:username */ -export function useDeleteUser( +export function useDeleteUser( refUsername: MaybeRef, options: { mutation?: VueMutationObserverOptions, TError, void, unknown> @@ -22,7 +22,6 @@ export function useDeleteUser, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} const username = unref(refUsername) - return useMutation, TError, void, unknown>({ mutationFn: () => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts index 79358a5c6..22b1476bf 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts @@ -7,7 +7,6 @@ import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPe export const findPetsByStatusQueryKey = (refParams?: MaybeRef) => { const params = unref(refParams) - return [`/pet/findByStatus`, ...(params ? [params] : [])] as const } diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts index 420b125ff..dafbebb69 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts @@ -7,7 +7,6 @@ import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsBy export const findPetsByTagsQueryKey = (refParams?: MaybeRef) => { const params = unref(refParams) - return [`/pet/findByTags`, ...(params ? [params] : [])] as const } diff --git a/examples/vue-query/src/gen/hooks/useGetOrderById.ts b/examples/vue-query/src/gen/hooks/useGetOrderById.ts index 9244620b9..4a15999f3 100644 --- a/examples/vue-query/src/gen/hooks/useGetOrderById.ts +++ b/examples/vue-query/src/gen/hooks/useGetOrderById.ts @@ -7,11 +7,10 @@ import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 export const getOrderByIdQueryKey = (refOrderId: MaybeRef) => { const orderId = unref(refOrderId) - return [`/store/order/${orderId}`] as const } -export function getOrderByIdQueryOptions( +export function getOrderByIdQueryOptions( refOrderId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { @@ -37,7 +36,7 @@ export function getOrderByIdQueryOptions( +export function useGetOrderById( refOrderId: MaybeRef, options: { query?: UseQueryOptions diff --git a/examples/vue-query/src/gen/hooks/useGetPetById.ts b/examples/vue-query/src/gen/hooks/useGetPetById.ts index b3520606f..3dbbfce4a 100644 --- a/examples/vue-query/src/gen/hooks/useGetPetById.ts +++ b/examples/vue-query/src/gen/hooks/useGetPetById.ts @@ -7,11 +7,10 @@ import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } fro export const getPetByIdQueryKey = (refPetId: MaybeRef) => { const petId = unref(refPetId) - return [`/pet/${petId}`] as const } -export function getPetByIdQueryOptions( +export function getPetByIdQueryOptions( refPetId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { @@ -37,7 +36,7 @@ export function getPetByIdQueryOptions( +export function useGetPetById( refPetId: MaybeRef, options: { query?: UseQueryOptions diff --git a/examples/vue-query/src/gen/hooks/useGetUserByName.ts b/examples/vue-query/src/gen/hooks/useGetUserByName.ts index 84cdd97e7..44513a5bd 100644 --- a/examples/vue-query/src/gen/hooks/useGetUserByName.ts +++ b/examples/vue-query/src/gen/hooks/useGetUserByName.ts @@ -7,11 +7,10 @@ import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName export const getUserByNameQueryKey = (refUsername: MaybeRef) => { const username = unref(refUsername) - return [`/user/${username}`] as const } -export function getUserByNameQueryOptions( +export function getUserByNameQueryOptions( refUsername: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { @@ -36,7 +35,7 @@ export function getUserByNameQueryOptions( +export function useGetUserByName( refUsername: MaybeRef, options: { query?: UseQueryOptions diff --git a/examples/vue-query/src/gen/hooks/useLoginUser.ts b/examples/vue-query/src/gen/hooks/useLoginUser.ts index 2b9196b3d..a37a7e7c1 100644 --- a/examples/vue-query/src/gen/hooks/useLoginUser.ts +++ b/examples/vue-query/src/gen/hooks/useLoginUser.ts @@ -7,7 +7,6 @@ import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from export const loginUserQueryKey = (refParams?: MaybeRef) => { const params = unref(refParams) - return [`/user/login`, ...(params ? [params] : [])] as const } diff --git a/examples/vue-query/src/gen/hooks/useUpdatePet.ts b/examples/vue-query/src/gen/hooks/useUpdatePet.ts index 46cdef6aa..0f3abea82 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePet.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePet.ts @@ -11,7 +11,7 @@ import type { UpdatePetMutationRequest, UpdatePetMutationResponse, UpdatePet400 * @link /pet */ -export function useUpdatePet( +export function useUpdatePet( options: { mutation?: VueMutationObserverOptions, TError, TVariables, unknown> client?: Partial>[0]> diff --git a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts index 2ce8f6f3b..8d1d674b2 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts @@ -28,7 +28,6 @@ export function useUpdatePetWithForm, TError, void, unknown>({ mutationFn: () => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUpdateUser.ts b/examples/vue-query/src/gen/hooks/useUpdateUser.ts index f0f3d6ce7..f896faa53 100644 --- a/examples/vue-query/src/gen/hooks/useUpdateUser.ts +++ b/examples/vue-query/src/gen/hooks/useUpdateUser.ts @@ -22,7 +22,6 @@ export function useUpdateUser, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} const username = unref(refUsername) - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUploadFile.ts b/examples/vue-query/src/gen/hooks/useUploadFile.ts index 6730f64f2..c1eabcc96 100644 --- a/examples/vue-query/src/gen/hooks/useUploadFile.ts +++ b/examples/vue-query/src/gen/hooks/useUploadFile.ts @@ -23,7 +23,6 @@ export function useUploadFile, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index e8b344f91..fbff8d937 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -42,7 +42,7 @@ export class QueryBuilder extends OasBuilder { const paramsData = [ ...getDataParams(schemas.pathParams, { typed: true, - override: (item) => (framework === 'vue' ? { ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` } : item), + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, }), { name: framework === 'vue' ? 'refParams' : 'params', @@ -53,21 +53,25 @@ export class QueryBuilder extends OasBuilder { ] const params = createFunctionParams(paramsData) - const unrefs = - framework === 'vue' && - paramsData - .filter((item) => item.type?.startsWith('MaybeRef<')) - .map((item) => { - return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` - }) - .join('\n') const result = [new URLPath(operation.path).template, schemas.queryParams?.name ? `...(params ? [params] : [])` : undefined].filter(Boolean) - codes.push(`export const ${name} = (${params}) => { + if (framework === 'vue') { + const unrefs = + framework === 'vue' + ? paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') + : '' + codes.push(`export const ${name} = (${params}) => { ${unrefs} - return [${result.join(',')}] as const; }`) + } else { + codes.push(`export const ${name} = (${params}) => [${result.join(',')}] as const;`) + } return { code: combineCodes(codes), name } } @@ -87,7 +91,7 @@ export class QueryBuilder extends OasBuilder { const paramsData = [ ...getDataParams(schemas.pathParams, { typed: true, - override: (item) => (framework === 'vue' ? { ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` } : item), + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, }), { name: framework === 'vue' ? 'refParams' : 'params', @@ -97,7 +101,7 @@ export class QueryBuilder extends OasBuilder { }, { name: framework === 'vue' ? 'refHeaders' : 'headers', - type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -110,13 +114,14 @@ export class QueryBuilder extends OasBuilder { const params = createFunctionParams(paramsData) const unrefs = - framework === 'vue' && - paramsData - .filter((item) => item.type?.startsWith('MaybeRef<')) - .map((item) => { - return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` - }) - .join('\n') + framework === 'vue' + ? paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') + : '' let queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` if (framework === 'solid') { @@ -174,7 +179,7 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. }, { name: 'headers', - type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -258,7 +263,7 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q }, { name: framework === 'vue' ? 'refHeaders' : 'headers', - type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -271,13 +276,14 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q const params = createFunctionParams(paramsData) const unrefs = - framework === 'vue' && - paramsData - .filter((item) => item.type?.startsWith('MaybeRef<')) - .map((item) => { - return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` - }) - .join('\n') + framework === 'vue' + ? paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') + : '' let queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` if (framework === 'solid') { @@ -322,7 +328,9 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. const queryKeyName = this.queryKey.name const queryOptionsName = this.queryOptionsInfinite.name // changed const name = `${frameworkImports.getName(operation)}Infinite` - const pathParams = getParams(schemas.pathParams) + const pathParams = getParams(schemas.pathParams, { + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }) const comments = getComments(operation) const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] @@ -341,7 +349,7 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. }, { name: 'headers', - type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -357,7 +365,10 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` const queryParams = createFunctionParams([ - ...getDataParams(schemas.pathParams, { typed: false }), + ...getDataParams(schemas.pathParams, { + typed: false, + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }), { name: 'params', enabled: !!schemas.queryParams?.name, @@ -431,7 +442,7 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q }, { name: framework === 'vue' ? 'refHeaders' : 'headers', - type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.queryParams?.name, + type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -447,20 +458,20 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q const params = createFunctionParams(paramsData) const unrefs = - framework === 'vue' && - paramsData - .filter((item) => item.type?.startsWith('MaybeRef<')) - .map((item) => { - return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` - }) - .join('\n') + framework === 'vue' + ? paramsData + .filter((item) => item.type?.startsWith('MaybeRef<')) + .map((item) => { + return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` + }) + .join('\n') + : '' codes.push(createJSDocBlockText({ comments })) codes.push(` export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.mutate.UseMutationResult}<${mutationGenerics.join(', ')}> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {}; ${unrefs} - return ${frameworkImports.mutate.useMutation}<${mutationGenerics.join(', ')}>({ mutationFn: (${schemas.request?.name ? 'data' : ''}) => { return client<${clientGenerics.filter((generic) => generic !== 'unknown').join(', ')}>({ From 30efd94a30606521a8c39358d1b87487377a65b9 Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Sun, 8 Oct 2023 23:43:33 +0200 Subject: [PATCH 3/9] chore: correct refNaming for `vue` --- .../src/gen/hooks/useFindPetsByStatus.ts | 6 ++--- .../src/gen/hooks/useFindPetsByTags.ts | 6 ++--- .../vue-query/src/gen/hooks/useLoginUser.ts | 6 ++--- .../src/builders/QueryBuilder.ts | 24 +++++++++++-------- 4 files changed, 23 insertions(+), 19 deletions(-) diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts index 22b1476bf..7b4213827 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts @@ -38,17 +38,17 @@ export function findPetsByStatusQueryOptions( - params?: MaybeRef, + refParams?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? findPetsByStatusQueryKey(params) + const queryKey = queryOptions?.queryKey ?? findPetsByStatusQueryKey(refParams) const query = useQuery({ - ...findPetsByStatusQueryOptions(params, clientOptions), + ...findPetsByStatusQueryOptions(refParams, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts index dafbebb69..614f5c27b 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts @@ -38,17 +38,17 @@ export function findPetsByTagsQueryOptions( - params?: MaybeRef, + refParams?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params) + const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(refParams) const query = useQuery({ - ...findPetsByTagsQueryOptions(params, clientOptions), + ...findPetsByTagsQueryOptions(refParams, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/examples/vue-query/src/gen/hooks/useLoginUser.ts b/examples/vue-query/src/gen/hooks/useLoginUser.ts index a37a7e7c1..45590c6d2 100644 --- a/examples/vue-query/src/gen/hooks/useLoginUser.ts +++ b/examples/vue-query/src/gen/hooks/useLoginUser.ts @@ -37,17 +37,17 @@ export function loginUserQueryOptions( - params?: MaybeRef, + refParams?: MaybeRef, options: { query?: UseQueryOptions client?: Partial>[0]> } = {}, ): UseQueryReturnType & { queryKey: QueryKey } { const { query: queryOptions, client: clientOptions = {} } = options ?? {} - const queryKey = queryOptions?.queryKey ?? loginUserQueryKey(params) + const queryKey = queryOptions?.queryKey ?? loginUserQueryKey(refParams) const query = useQuery({ - ...loginUserQueryOptions(params, clientOptions), + ...loginUserQueryOptions(refParams, clientOptions), ...queryOptions, }) as UseQueryReturnType & { queryKey: QueryKey } diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index fbff8d937..a6254a0f6 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -172,13 +172,13 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, }), { - name: 'params', + name: framework === 'vue' ? 'refParams' : 'params', type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', + name: framework === 'vue' ? 'refHeaders' : 'headers', type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, @@ -193,19 +193,21 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. }, ]) - const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` + const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${ + schemas.queryParams?.name ? (framework === 'vue' ? 'refParams' : 'params') : '' + })` const queryParams = createFunctionParams([ ...getDataParams(schemas.pathParams, { typed: false, override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, }), { - name: 'params', + name: framework === 'vue' ? 'refParams' : 'params', enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', + name: framework === 'vue' ? 'refHeaders' : 'headers', enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, @@ -342,13 +344,13 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, }), { - name: 'params', + name: framework === 'vue' ? 'refParams' : 'params', type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', + name: framework === 'vue' ? 'refHeaders' : 'headers', type: framework === 'vue' && schemas.headerParams?.name ? `MaybeRef<${schemas.headerParams?.name}>` : schemas.headerParams?.name, enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, @@ -363,19 +365,21 @@ export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports. }, ]) - const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` + const queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${ + schemas.queryParams?.name ? (framework === 'vue' ? 'refParams' : 'params') : '' + })` const queryParams = createFunctionParams([ ...getDataParams(schemas.pathParams, { typed: false, override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, }), { - name: 'params', + name: framework === 'vue' ? 'refParams' : 'params', enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, }, { - name: 'headers', + name: framework === 'vue' ? 'refHeaders' : 'headers', enabled: !!schemas.headerParams?.name, required: !!schemas.headerParams?.schema.required?.length, }, From 27894813ed9afa67cadbf42d01f9b35ab32a519d Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Sun, 8 Oct 2023 23:46:05 +0200 Subject: [PATCH 4/9] chore: fix codesandbox --- examples/solid-query/package.json | 1 - examples/svelte-query/package.json | 1 - examples/vue-query/package.json | 1 - pnpm-lock.yaml | 9 --------- 4 files changed, 12 deletions(-) diff --git a/examples/solid-query/package.json b/examples/solid-query/package.json index 892f90762..0342b9a4a 100644 --- a/examples/solid-query/package.json +++ b/examples/solid-query/package.json @@ -32,7 +32,6 @@ "tsup": "^7.2.0" }, "devDependencies": { - "@kubb/ts-config": "workspace:*", "typescript": "^5.2.2" }, "packageManager": "pnpm@8.3.0", diff --git a/examples/svelte-query/package.json b/examples/svelte-query/package.json index 551ae674b..cb621e314 100644 --- a/examples/svelte-query/package.json +++ b/examples/svelte-query/package.json @@ -32,7 +32,6 @@ "tsup": "^7.2.0" }, "devDependencies": { - "@kubb/ts-config": "workspace:*", "typescript": "^5.2.2" }, "packageManager": "pnpm@8.3.0", diff --git a/examples/vue-query/package.json b/examples/vue-query/package.json index 719820645..e646e7098 100644 --- a/examples/vue-query/package.json +++ b/examples/vue-query/package.json @@ -33,7 +33,6 @@ "vue": "^3.3.4" }, "devDependencies": { - "@kubb/ts-config": "workspace:*", "@vitejs/plugin-vue": "^4.4.0", "msw": "^1.3.2", "tsup": "^7.2.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 63fa6dd76..d77487844 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -489,9 +489,6 @@ importers: specifier: ^7.2.0 version: 7.2.0(@swc/core@1.3.82)(ts-node@10.9.1)(typescript@5.2.2) devDependencies: - '@kubb/ts-config': - specifier: workspace:* - version: link:../../packages/config/ts-config typescript: specifier: ^5.2.2 version: 5.2.2 @@ -532,9 +529,6 @@ importers: specifier: ^7.2.0 version: 7.2.0(@swc/core@1.3.82)(ts-node@10.9.1)(typescript@5.2.2) devDependencies: - '@kubb/ts-config': - specifier: workspace:* - version: link:../../packages/config/ts-config typescript: specifier: ^5.2.2 version: 5.2.2 @@ -633,9 +627,6 @@ importers: specifier: ^3.3.4 version: 3.3.4 devDependencies: - '@kubb/ts-config': - specifier: workspace:* - version: link:../../packages/config/ts-config '@vitejs/plugin-vue': specifier: ^4.4.0 version: 4.4.0(vite@4.4.11)(vue@3.3.4) From d2430871401ab23fc3b3af1823be3538819fdba1 Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Mon, 9 Oct 2023 08:28:29 +0200 Subject: [PATCH 5/9] fix: make `vue` work with refs --- examples/vue-query/src/gen/hooks/useAddPet.ts | 1 - .../vue-query/src/gen/hooks/useCreateUser.ts | 1 - .../gen/hooks/useCreateUsersWithListInput.ts | 1 - .../vue-query/src/gen/hooks/useDeleteOrder.ts | 2 +- .../vue-query/src/gen/hooks/useDeletePet.ts | 4 +- .../vue-query/src/gen/hooks/useDeleteUser.ts | 2 +- .../src/gen/hooks/useFindPetsByStatus.ts | 9 ++-- .../src/gen/hooks/useFindPetsByTags.ts | 9 ++-- .../src/gen/hooks/useGetInventory.ts | 4 +- .../src/gen/hooks/useGetOrderById.ts | 9 ++-- .../vue-query/src/gen/hooks/useGetPetById.ts | 9 ++-- .../src/gen/hooks/useGetUserByName.ts | 9 ++-- .../vue-query/src/gen/hooks/useLoginUser.ts | 9 ++-- .../vue-query/src/gen/hooks/useLogoutUser.ts | 4 +- .../vue-query/src/gen/hooks/usePlaceOrder.ts | 1 - .../vue-query/src/gen/hooks/useUpdatePet.ts | 1 - .../src/gen/hooks/useUpdatePetWithForm.ts | 4 +- .../vue-query/src/gen/hooks/useUpdateUser.ts | 2 +- .../vue-query/src/gen/hooks/useUploadFile.ts | 4 +- packages/core/src/utils/URLPath.ts | 11 +++-- .../src/builders/QueryBuilder.ts | 48 +++++++++---------- 21 files changed, 59 insertions(+), 85 deletions(-) diff --git a/examples/vue-query/src/gen/hooks/useAddPet.ts b/examples/vue-query/src/gen/hooks/useAddPet.ts index e6a03ef1a..3977ef1ac 100644 --- a/examples/vue-query/src/gen/hooks/useAddPet.ts +++ b/examples/vue-query/src/gen/hooks/useAddPet.ts @@ -18,7 +18,6 @@ export function useAddPet, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useCreateUser.ts b/examples/vue-query/src/gen/hooks/useCreateUser.ts index 0ed9ef86b..221ffd9fa 100644 --- a/examples/vue-query/src/gen/hooks/useCreateUser.ts +++ b/examples/vue-query/src/gen/hooks/useCreateUser.ts @@ -18,7 +18,6 @@ export function useCreateUser, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts b/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts index a3af8fff4..9c90b9709 100644 --- a/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts +++ b/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts @@ -22,7 +22,6 @@ export function useCreateUsersWithListInput< } = {}, ): UseMutationReturnType, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts index 666af5b0f..eaad750a5 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts @@ -21,9 +21,9 @@ export function useDeleteOrder, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const orderId = unref(refOrderId) return useMutation, TError, void, unknown>({ mutationFn: () => { + const orderId = unref(refOrderId) return client({ method: 'delete', url: `/store/order/${orderId}`, diff --git a/examples/vue-query/src/gen/hooks/useDeletePet.ts b/examples/vue-query/src/gen/hooks/useDeletePet.ts index 96d577486..81478e8ae 100644 --- a/examples/vue-query/src/gen/hooks/useDeletePet.ts +++ b/examples/vue-query/src/gen/hooks/useDeletePet.ts @@ -22,10 +22,10 @@ export function useDeletePet, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const petId = unref(refPetId) - const headers = unref(refHeaders) return useMutation, TError, void, unknown>({ mutationFn: () => { + const petId = unref(refPetId) + const headers = unref(refHeaders) return client({ method: 'delete', url: `/pet/${petId}`, diff --git a/examples/vue-query/src/gen/hooks/useDeleteUser.ts b/examples/vue-query/src/gen/hooks/useDeleteUser.ts index 78c1ecf5f..a7590b347 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteUser.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteUser.ts @@ -21,9 +21,9 @@ export function useDeleteUser, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const username = unref(refUsername) return useMutation, TError, void, unknown>({ mutationFn: () => { + const username = unref(refUsername) return client({ method: 'delete', url: `/user/${username}`, diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts index 7b4213827..4cdac15b6 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (refParams?: MaybeRef) => { - const params = unref(refParams) - return [`/pet/findByStatus`, ...(params ? [params] : [])] as const -} +export const findPetsByStatusQueryKey = (params?: MaybeRef) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const params = unref(refParams) - const queryKey = findPetsByStatusQueryKey(params) + const queryKey = findPetsByStatusQueryKey(refParams) return { queryKey, queryFn: () => { + const params = unref(refParams) return client({ method: 'get', url: `/pet/findByStatus`, diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts index 614f5c27b..b8dba7f00 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (refParams?: MaybeRef) => { - const params = unref(refParams) - return [`/pet/findByTags`, ...(params ? [params] : [])] as const -} +export const findPetsByTagsQueryKey = (params?: MaybeRef) => [`/pet/findByTags`, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const params = unref(refParams) - const queryKey = findPetsByTagsQueryKey(params) + const queryKey = findPetsByTagsQueryKey(refParams) return { queryKey, queryFn: () => { + const params = unref(refParams) return client({ method: 'get', url: `/pet/findByTags`, diff --git a/examples/vue-query/src/gen/hooks/useGetInventory.ts b/examples/vue-query/src/gen/hooks/useGetInventory.ts index a29c78163..084735d29 100644 --- a/examples/vue-query/src/gen/hooks/useGetInventory.ts +++ b/examples/vue-query/src/gen/hooks/useGetInventory.ts @@ -3,9 +3,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => { - return [`/store/inventory`] as const -} +export const getInventoryQueryKey = () => [`/store/inventory`] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/useGetOrderById.ts b/examples/vue-query/src/gen/hooks/useGetOrderById.ts index 4a15999f3..e27b9db6a 100644 --- a/examples/vue-query/src/gen/hooks/useGetOrderById.ts +++ b/examples/vue-query/src/gen/hooks/useGetOrderById.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (refOrderId: MaybeRef) => { - const orderId = unref(refOrderId) - return [`/store/order/${orderId}`] as const -} +export const getOrderByIdQueryKey = (orderId: MaybeRef) => [`/store/order/${unref(orderId)}`] as const export function getOrderByIdQueryOptions( refOrderId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const orderId = unref(refOrderId) - const queryKey = getOrderByIdQueryKey(orderId) + const queryKey = getOrderByIdQueryKey(refOrderId) return { queryKey, queryFn: () => { + const orderId = unref(refOrderId) return client({ method: 'get', url: `/store/order/${orderId}`, diff --git a/examples/vue-query/src/gen/hooks/useGetPetById.ts b/examples/vue-query/src/gen/hooks/useGetPetById.ts index 3dbbfce4a..da89ed6f9 100644 --- a/examples/vue-query/src/gen/hooks/useGetPetById.ts +++ b/examples/vue-query/src/gen/hooks/useGetPetById.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (refPetId: MaybeRef) => { - const petId = unref(refPetId) - return [`/pet/${petId}`] as const -} +export const getPetByIdQueryKey = (petId: MaybeRef) => [`/pet/${unref(petId)}`] as const export function getPetByIdQueryOptions( refPetId: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const petId = unref(refPetId) - const queryKey = getPetByIdQueryKey(petId) + const queryKey = getPetByIdQueryKey(refPetId) return { queryKey, queryFn: () => { + const petId = unref(refPetId) return client({ method: 'get', url: `/pet/${petId}`, diff --git a/examples/vue-query/src/gen/hooks/useGetUserByName.ts b/examples/vue-query/src/gen/hooks/useGetUserByName.ts index 44513a5bd..754ad555c 100644 --- a/examples/vue-query/src/gen/hooks/useGetUserByName.ts +++ b/examples/vue-query/src/gen/hooks/useGetUserByName.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (refUsername: MaybeRef) => { - const username = unref(refUsername) - return [`/user/${username}`] as const -} +export const getUserByNameQueryKey = (username: MaybeRef) => [`/user/${unref(username)}`] as const export function getUserByNameQueryOptions( refUsername: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const username = unref(refUsername) - const queryKey = getUserByNameQueryKey(username) + const queryKey = getUserByNameQueryKey(refUsername) return { queryKey, queryFn: () => { + const username = unref(refUsername) return client({ method: 'get', url: `/user/${username}`, diff --git a/examples/vue-query/src/gen/hooks/useLoginUser.ts b/examples/vue-query/src/gen/hooks/useLoginUser.ts index 45590c6d2..5a3c35b1f 100644 --- a/examples/vue-query/src/gen/hooks/useLoginUser.ts +++ b/examples/vue-query/src/gen/hooks/useLoginUser.ts @@ -5,21 +5,18 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (refParams?: MaybeRef) => { - const params = unref(refParams) - return [`/user/login`, ...(params ? [params] : [])] as const -} +export const loginUserQueryKey = (params?: MaybeRef) => [`/user/login`, ...(params ? [params] : [])] as const export function loginUserQueryOptions( refParams?: MaybeRef, options: Partial[0]> = {}, ): UseQueryOptions { - const params = unref(refParams) - const queryKey = loginUserQueryKey(params) + const queryKey = loginUserQueryKey(refParams) return { queryKey, queryFn: () => { + const params = unref(refParams) return client({ method: 'get', url: `/user/login`, diff --git a/examples/vue-query/src/gen/hooks/useLogoutUser.ts b/examples/vue-query/src/gen/hooks/useLogoutUser.ts index bda38609f..69a8d7fc8 100644 --- a/examples/vue-query/src/gen/hooks/useLogoutUser.ts +++ b/examples/vue-query/src/gen/hooks/useLogoutUser.ts @@ -3,9 +3,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => { - return [`/user/logout`] as const -} +export const logoutUserQueryKey = () => [`/user/logout`] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/usePlaceOrder.ts b/examples/vue-query/src/gen/hooks/usePlaceOrder.ts index edeb485fc..957933512 100644 --- a/examples/vue-query/src/gen/hooks/usePlaceOrder.ts +++ b/examples/vue-query/src/gen/hooks/usePlaceOrder.ts @@ -18,7 +18,6 @@ export function usePlaceOrder, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUpdatePet.ts b/examples/vue-query/src/gen/hooks/useUpdatePet.ts index 0f3abea82..82a5836e3 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePet.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePet.ts @@ -18,7 +18,6 @@ export function useUpdatePet, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts index 8d1d674b2..8958266f5 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts @@ -26,10 +26,10 @@ export function useUpdatePetWithForm, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const petId = unref(refPetId) - const params = unref(refParams) return useMutation, TError, void, unknown>({ mutationFn: () => { + const petId = unref(refPetId) + const params = unref(refParams) return client({ method: 'post', url: `/pet/${petId}`, diff --git a/examples/vue-query/src/gen/hooks/useUpdateUser.ts b/examples/vue-query/src/gen/hooks/useUpdateUser.ts index f896faa53..45fb207a7 100644 --- a/examples/vue-query/src/gen/hooks/useUpdateUser.ts +++ b/examples/vue-query/src/gen/hooks/useUpdateUser.ts @@ -21,9 +21,9 @@ export function useUpdateUser, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const username = unref(refUsername) return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { + const username = unref(refUsername) return client({ method: 'put', url: `/user/${username}`, diff --git a/examples/vue-query/src/gen/hooks/useUploadFile.ts b/examples/vue-query/src/gen/hooks/useUploadFile.ts index c1eabcc96..3546847db 100644 --- a/examples/vue-query/src/gen/hooks/useUploadFile.ts +++ b/examples/vue-query/src/gen/hooks/useUploadFile.ts @@ -21,10 +21,10 @@ export function useUploadFile, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} - const petId = unref(refPetId) - const params = unref(refParams) return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { + const petId = unref(refPetId) + const params = unref(refParams) return client({ method: 'post', url: `/pet/${petId}/uploadImage`, diff --git a/packages/core/src/utils/URLPath.ts b/packages/core/src/utils/URLPath.ts index 20e39d0ea..a050493dd 100644 --- a/packages/core/src/utils/URLPath.ts +++ b/packages/core/src/utils/URLPath.ts @@ -34,8 +34,8 @@ export class URLPath { * @example /account/monetary-accountID => `/account/${monetaryAccountId}` * @example /account/userID => `/account/${userId}` */ - toTemplateString(): string { - return URLPath.toTemplateString(this.path) + toTemplateString(replacer?: (pathParam: string) => string): string { + return URLPath.toTemplateString(this.path, replacer) } /** * Convert Swagger path to template literals/ template strings(camelcase) @@ -43,14 +43,17 @@ export class URLPath { * @example /account/monetary-accountID => `/account/${monetaryAccountId}` * @example /account/userID => `/account/${userId}` */ - static toTemplateString(path: string): string { + static toTemplateString(path: string, replacer?: (pathParam: string) => string): string { const regex = /{(\w|-)*}/g const found = path.match(regex) let newPath = path.replaceAll('{', '${') if (found) { newPath = found.reduce((prev, curr) => { - const replacement = `\${${camelCase(curr, { delimiter: '', transform: camelCaseTransformMerge })}}` + const pathParam = replacer + ? replacer(camelCase(curr, { delimiter: '', transform: camelCaseTransformMerge })) + : camelCase(curr, { delimiter: '', transform: camelCaseTransformMerge }) + const replacement = `\${${pathParam}}` return prev.replace(curr, replacement) }, path) diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index a6254a0f6..1fa31f2ea 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -42,10 +42,10 @@ export class QueryBuilder extends OasBuilder { const paramsData = [ ...getDataParams(schemas.pathParams, { typed: true, - override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}`, type: `MaybeRef<${item.type}>` }) : undefined, + override: framework === 'vue' ? (item) => ({ ...item, type: `MaybeRef<${item.type}>` }) : undefined, }), { - name: framework === 'vue' ? 'refParams' : 'params', + name: 'params', type: framework === 'vue' && schemas.queryParams?.name ? `MaybeRef<${schemas.queryParams?.name}>` : schemas.queryParams?.name, enabled: !!schemas.queryParams?.name, required: !!schemas.queryParams?.schema.required?.length, @@ -53,25 +53,12 @@ export class QueryBuilder extends OasBuilder { ] const params = createFunctionParams(paramsData) - const result = [new URLPath(operation.path).template, schemas.queryParams?.name ? `...(params ? [params] : [])` : undefined].filter(Boolean) + const result = [ + new URLPath(operation.path).toTemplateString((pathParam) => (framework === 'vue' ? `unref(${pathParam})` : pathParam)), + schemas.queryParams?.name ? `...(params ? [params] : [])` : undefined, + ].filter(Boolean) - if (framework === 'vue') { - const unrefs = - framework === 'vue' - ? paramsData - .filter((item) => item.type?.startsWith('MaybeRef<')) - .map((item) => { - return `const ${camelCase(item.name.replace('ref', ''))} = unref(${item.name})` - }) - .join('\n') - : '' - codes.push(`export const ${name} = (${params}) => { - ${unrefs} - return [${result.join(',')}] as const; - }`) - } else { - codes.push(`export const ${name} = (${params}) => [${result.join(',')}] as const;`) - } + codes.push(`export const ${name} = (${params}) => [${result.join(',')}] as const;`) return { code: combineCodes(codes), name } } @@ -83,7 +70,9 @@ export class QueryBuilder extends OasBuilder { const name = camelCase(`${operation.getOperationId()}QueryOptions`) const queryKeyName = this.queryKey.name - const pathParams = getParams(schemas.pathParams) + const pathParams = getParams(schemas.pathParams, { + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }) const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] const clientGenerics = ['TData', 'TError'] @@ -122,20 +111,24 @@ export class QueryBuilder extends OasBuilder { }) .join('\n') : '' + let queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'params' : ''})` if (framework === 'solid') { queryKey = `() => ${queryKey}` } + if (framework === 'vue') { + queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'refParams' : ''})` + } codes.push(` export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports.query.UseQueryOptions}<${queryGenerics.join(', ')}> { - ${unrefs} const queryKey = ${queryKey}; return { queryKey, queryFn: () => { + ${unrefs} return client<${clientGenerics.join(', ')}>({ method: "get", url: ${new URLPath(operation.path).template}, @@ -247,7 +240,9 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q const queryKeyName = this.queryKey.name - const pathParams = getParams(schemas.pathParams) + const pathParams = getParams(schemas.pathParams, { + override: framework === 'vue' ? (item) => ({ ...item, name: `ref${pascalCase(item.name)}` }) : undefined, + }) const generics = [`TData = ${schemas.response.name}`, `TError = ${errors.map((error) => error.name).join(' | ') || 'unknown'}`] const clientGenerics = ['TData', 'TError'] @@ -291,15 +286,18 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q if (framework === 'solid') { queryKey = `() => ${queryKey}` } + if (framework === 'vue') { + queryKey = `${queryKeyName}(${schemas.pathParams?.name ? `${pathParams}, ` : ''}${schemas.queryParams?.name ? 'refParams' : ''})` + } codes.push(` export function ${name} <${generics.join(', ')}>(${params}): ${frameworkImports.query.UseInfiniteQueryOptions}<${queryGenerics.join(', ')}> { - ${unrefs} const queryKey = ${queryKey}; return { queryKey, queryFn: ({ pageParam }) => { + ${unrefs} return client<${clientGenerics.join(', ')}>({ method: "get", url: ${new URLPath(operation.path).template}, @@ -475,9 +473,9 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q codes.push(` export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.mutate.UseMutationResult}<${mutationGenerics.join(', ')}> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {}; - ${unrefs} return ${frameworkImports.mutate.useMutation}<${mutationGenerics.join(', ')}>({ mutationFn: (${schemas.request?.name ? 'data' : ''}) => { + ${unrefs} return client<${clientGenerics.filter((generic) => generic !== 'unknown').join(', ')}>({ method: "${method}", url: ${new URLPath(operation.path).template}, From 186e05d5c310766c8579fd840ce3dc6bb6f14bb5 Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Mon, 9 Oct 2023 10:02:29 +0200 Subject: [PATCH 6/9] fix: queryKey with `{url, params}` object --- .../petController/useFindPetsByStatus.ts | 2 +- .../hooks/petController/useFindPetsByTags.ts | 2 +- .../hooks/petController/useGetPetById.ts | 2 +- .../hooks/userController/useGetUserByName.ts | 2 +- .../hooks/userController/useLoginUser.ts | 2 +- .../hooks/userController/useLogoutUser.ts | 2 +- .../src/gen/hooks/useFindPetsByStatusHook.ts | 2 +- .../src/gen/hooks/useFindPetsByTagsHook.ts | 2 +- .../src/gen/hooks/useGetInventoryHook.ts | 2 +- .../src/gen/hooks/useGetOrderByIdHook.ts | 2 +- .../src/gen/hooks/useGetPetByIdHook.ts | 2 +- .../src/gen/hooks/useGetUserByNameHook.ts | 2 +- .../src/gen/hooks/useLoginUserHook.ts | 2 +- .../src/gen/hooks/useLogoutUserHook.ts | 2 +- examples/simple-single/src/gen/hooks.ts | 16 ++--- .../src/gen/hooks/findPetsByStatusQuery.ts | 2 +- .../src/gen/hooks/findPetsByTagsQuery.ts | 2 +- .../src/gen/hooks/getInventoryQuery.ts | 2 +- .../src/gen/hooks/getOrderByIdQuery.ts | 2 +- .../src/gen/hooks/getPetByIdQuery.ts | 2 +- .../src/gen/hooks/getUserByNameQuery.ts | 2 +- .../src/gen/hooks/loginUserQuery.ts | 2 +- .../src/gen/hooks/logoutUserQuery.ts | 2 +- .../src/gen/hooks/findPetsByStatusQuery.ts | 2 +- .../src/gen/hooks/findPetsByTagsQuery.ts | 2 +- .../src/gen/hooks/getInventoryQuery.ts | 2 +- .../src/gen/hooks/getOrderByIdQuery.ts | 2 +- .../src/gen/hooks/getPetByIdQuery.ts | 2 +- .../src/gen/hooks/getUserByNameQuery.ts | 2 +- .../src/gen/hooks/loginUserQuery.ts | 2 +- .../src/gen/hooks/logoutUserQuery.ts | 2 +- examples/vue-query/src/gen/hooks/useAddPet.ts | 1 + .../vue-query/src/gen/hooks/useCreateUser.ts | 1 + .../gen/hooks/useCreateUsersWithListInput.ts | 1 + .../vue-query/src/gen/hooks/useDeleteOrder.ts | 1 + .../vue-query/src/gen/hooks/useDeletePet.ts | 1 + .../vue-query/src/gen/hooks/useDeleteUser.ts | 1 + .../src/gen/hooks/useFindPetsByStatus.ts | 2 +- .../src/gen/hooks/useFindPetsByTags.ts | 2 +- .../src/gen/hooks/useGetInventory.ts | 2 +- .../src/gen/hooks/useGetOrderById.ts | 3 +- .../vue-query/src/gen/hooks/useGetPetById.ts | 2 +- .../src/gen/hooks/useGetUserByName.ts | 3 +- .../vue-query/src/gen/hooks/useLoginUser.ts | 2 +- .../vue-query/src/gen/hooks/useLogoutUser.ts | 2 +- .../vue-query/src/gen/hooks/usePlaceOrder.ts | 1 + .../vue-query/src/gen/hooks/useUpdatePet.ts | 1 + .../src/gen/hooks/useUpdatePetWithForm.ts | 1 + .../vue-query/src/gen/hooks/useUpdateUser.ts | 1 + .../vue-query/src/gen/hooks/useUploadFile.ts | 1 + packages/core/src/utils/URLPath.test.ts | 25 ++++++++ packages/core/src/utils/URLPath.ts | 64 +++++++++++++++++++ .../src/builders/QueryBuilder.ts | 7 +- 53 files changed, 154 insertions(+), 47 deletions(-) diff --git a/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByStatus.ts b/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByStatus.ts index 63ecaa100..3abd845e6 100644 --- a/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByStatus.ts +++ b/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByStatus.ts @@ -4,7 +4,7 @@ import client from '../../../../client' import type { ResponseConfig } from '../../../../client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../../../models/ts/petController/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( params?: FindPetsByStatusQueryParams, diff --git a/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByTags.ts b/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByTags.ts index ff2d156d8..497aa6194 100644 --- a/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByTags.ts +++ b/examples/advanced/src/gen/clients/hooks/petController/useFindPetsByTags.ts @@ -9,7 +9,7 @@ import type { FindPetsByTags400, } from '../../../models/ts/petController/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( headers: FindPetsByTagsHeaderParams, diff --git a/examples/advanced/src/gen/clients/hooks/petController/useGetPetById.ts b/examples/advanced/src/gen/clients/hooks/petController/useGetPetById.ts index 52b467f77..fcd2ae7dd 100644 --- a/examples/advanced/src/gen/clients/hooks/petController/useGetPetById.ts +++ b/examples/advanced/src/gen/clients/hooks/petController/useGetPetById.ts @@ -4,7 +4,7 @@ import client from '../../../../client' import type { ResponseConfig } from '../../../../client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400, GetPetById404 } from '../../../models/ts/petController/GetPetById' -export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [{ url: `/pet/${petId}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( petId: GetPetByIdPathParams['petId'], diff --git a/examples/advanced/src/gen/clients/hooks/userController/useGetUserByName.ts b/examples/advanced/src/gen/clients/hooks/userController/useGetUserByName.ts index 1bf1b63c4..8312fbd41 100644 --- a/examples/advanced/src/gen/clients/hooks/userController/useGetUserByName.ts +++ b/examples/advanced/src/gen/clients/hooks/userController/useGetUserByName.ts @@ -4,7 +4,7 @@ import client from '../../../../client' import type { ResponseConfig } from '../../../../client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400, GetUserByName404 } from '../../../models/ts/userController/GetUserByName' -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [{ url: `/user/${username}`, params: { username: username } }] as const export function getUserByNameQueryOptions( username: GetUserByNamePathParams['username'], diff --git a/examples/advanced/src/gen/clients/hooks/userController/useLoginUser.ts b/examples/advanced/src/gen/clients/hooks/userController/useLoginUser.ts index 5650b3462..c3f9591cb 100644 --- a/examples/advanced/src/gen/clients/hooks/userController/useLoginUser.ts +++ b/examples/advanced/src/gen/clients/hooks/userController/useLoginUser.ts @@ -4,7 +4,7 @@ import client from '../../../../client' import type { ResponseConfig } from '../../../../client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../../../models/ts/userController/LoginUser' -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: LoginUserQueryParams) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( params?: LoginUserQueryParams, diff --git a/examples/advanced/src/gen/clients/hooks/userController/useLogoutUser.ts b/examples/advanced/src/gen/clients/hooks/userController/useLogoutUser.ts index 725e00035..5b5e7048d 100644 --- a/examples/advanced/src/gen/clients/hooks/userController/useLogoutUser.ts +++ b/examples/advanced/src/gen/clients/hooks/userController/useLogoutUser.ts @@ -4,7 +4,7 @@ import client from '../../../../client' import type { ResponseConfig } from '../../../../client' import type { LogoutUserQueryResponse } from '../../../models/ts/userController/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/react-query/src/gen/hooks/useFindPetsByStatusHook.ts b/examples/react-query/src/gen/hooks/useFindPetsByStatusHook.ts index 7855dba9b..20db92816 100644 --- a/examples/react-query/src/gen/hooks/useFindPetsByStatusHook.ts +++ b/examples/react-query/src/gen/hooks/useFindPetsByStatusHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( params?: FindPetsByStatusQueryParams, diff --git a/examples/react-query/src/gen/hooks/useFindPetsByTagsHook.ts b/examples/react-query/src/gen/hooks/useFindPetsByTagsHook.ts index 75c6542fe..0934e1541 100644 --- a/examples/react-query/src/gen/hooks/useFindPetsByTagsHook.ts +++ b/examples/react-query/src/gen/hooks/useFindPetsByTagsHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( params?: FindPetsByTagsQueryParams, diff --git a/examples/react-query/src/gen/hooks/useGetInventoryHook.ts b/examples/react-query/src/gen/hooks/useGetInventoryHook.ts index 634509966..60892ba56 100644 --- a/examples/react-query/src/gen/hooks/useGetInventoryHook.ts +++ b/examples/react-query/src/gen/hooks/useGetInventoryHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => [`/store/inventory`] as const +export const getInventoryQueryKey = () => [{ url: `/store/inventory` }] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/react-query/src/gen/hooks/useGetOrderByIdHook.ts b/examples/react-query/src/gen/hooks/useGetOrderByIdHook.ts index 075a57bdd..32696c3fc 100644 --- a/examples/react-query/src/gen/hooks/useGetOrderByIdHook.ts +++ b/examples/react-query/src/gen/hooks/useGetOrderByIdHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [`/store/order/${orderId}`] as const +export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [{ url: `/store/order/${orderId}`, params: { orderId: orderId } }] as const export function getOrderByIdQueryOptions( orderId: GetOrderByIdPathParams['orderId'], diff --git a/examples/react-query/src/gen/hooks/useGetPetByIdHook.ts b/examples/react-query/src/gen/hooks/useGetPetByIdHook.ts index ab2bb0b07..54eff3f11 100644 --- a/examples/react-query/src/gen/hooks/useGetPetByIdHook.ts +++ b/examples/react-query/src/gen/hooks/useGetPetByIdHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [{ url: `/pet/${petId}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( petId: GetPetByIdPathParams['petId'], diff --git a/examples/react-query/src/gen/hooks/useGetUserByNameHook.ts b/examples/react-query/src/gen/hooks/useGetUserByNameHook.ts index 9be18cd06..aa4d6988a 100644 --- a/examples/react-query/src/gen/hooks/useGetUserByNameHook.ts +++ b/examples/react-query/src/gen/hooks/useGetUserByNameHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [{ url: `/user/${username}`, params: { username: username } }] as const export function getUserByNameQueryOptions( username: GetUserByNamePathParams['username'], diff --git a/examples/react-query/src/gen/hooks/useLoginUserHook.ts b/examples/react-query/src/gen/hooks/useLoginUserHook.ts index 6d3a88af1..4800f83d4 100644 --- a/examples/react-query/src/gen/hooks/useLoginUserHook.ts +++ b/examples/react-query/src/gen/hooks/useLoginUserHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: LoginUserQueryParams) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( params?: LoginUserQueryParams, diff --git a/examples/react-query/src/gen/hooks/useLogoutUserHook.ts b/examples/react-query/src/gen/hooks/useLogoutUserHook.ts index 1c8cf9e2f..c14616c48 100644 --- a/examples/react-query/src/gen/hooks/useLogoutUserHook.ts +++ b/examples/react-query/src/gen/hooks/useLogoutUserHook.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/react-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/simple-single/src/gen/hooks.ts b/examples/simple-single/src/gen/hooks.ts index 4fa63a271..dfd977e40 100644 --- a/examples/simple-single/src/gen/hooks.ts +++ b/examples/simple-single/src/gen/hooks.ts @@ -125,7 +125,7 @@ export function useAddPet [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( params?: FindPetsByStatusQueryParams, @@ -173,7 +173,7 @@ export function useFindPetsByStatus [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( params?: FindPetsByTagsQueryParams, @@ -221,7 +221,7 @@ export function useFindPetsByTags [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [{ url: `/pet/${petId}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( petId: GetPetByIdPathParams['petId'], @@ -358,7 +358,7 @@ export function useUploadFile [`/store/inventory`] as const +export const getInventoryQueryKey = () => [{ url: `/store/inventory` }] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, @@ -459,7 +459,7 @@ export function usePlaceOrderPatch [`/store/order/${orderId}`] as const +export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [{ url: `/store/order/${orderId}`, params: { orderId: orderId } }] as const export function getOrderByIdQueryOptions( orderId: GetOrderByIdPathParams['orderId'], @@ -594,7 +594,7 @@ export function useCreateUsersWithListInput< }) } -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: LoginUserQueryParams) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( params?: LoginUserQueryParams, @@ -641,7 +641,7 @@ export function useLoginUser [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, @@ -685,7 +685,7 @@ export function useLogoutUser return query } -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [{ url: `/user/${username}`, params: { username: username } }] as const export function getUserByNameQueryOptions( username: GetUserByNamePathParams['username'], diff --git a/examples/solid-query/src/gen/hooks/findPetsByStatusQuery.ts b/examples/solid-query/src/gen/hooks/findPetsByStatusQuery.ts index 5c98c62d3..f39a5b4f6 100644 --- a/examples/solid-query/src/gen/hooks/findPetsByStatusQuery.ts +++ b/examples/solid-query/src/gen/hooks/findPetsByStatusQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( params?: FindPetsByStatusQueryParams, diff --git a/examples/solid-query/src/gen/hooks/findPetsByTagsQuery.ts b/examples/solid-query/src/gen/hooks/findPetsByTagsQuery.ts index 22b814046..f75a6eba9 100644 --- a/examples/solid-query/src/gen/hooks/findPetsByTagsQuery.ts +++ b/examples/solid-query/src/gen/hooks/findPetsByTagsQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( params?: FindPetsByTagsQueryParams, diff --git a/examples/solid-query/src/gen/hooks/getInventoryQuery.ts b/examples/solid-query/src/gen/hooks/getInventoryQuery.ts index 326c6d77a..7e4a49f41 100644 --- a/examples/solid-query/src/gen/hooks/getInventoryQuery.ts +++ b/examples/solid-query/src/gen/hooks/getInventoryQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => [`/store/inventory`] as const +export const getInventoryQueryKey = () => [{ url: `/store/inventory` }] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/solid-query/src/gen/hooks/getOrderByIdQuery.ts b/examples/solid-query/src/gen/hooks/getOrderByIdQuery.ts index 155963b4a..220992a2f 100644 --- a/examples/solid-query/src/gen/hooks/getOrderByIdQuery.ts +++ b/examples/solid-query/src/gen/hooks/getOrderByIdQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [`/store/order/${orderId}`] as const +export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [{ url: `/store/order/${orderId}`, params: { orderId: orderId } }] as const export function getOrderByIdQueryOptions( orderId: GetOrderByIdPathParams['orderId'], diff --git a/examples/solid-query/src/gen/hooks/getPetByIdQuery.ts b/examples/solid-query/src/gen/hooks/getPetByIdQuery.ts index c454e00f8..24ed5cb17 100644 --- a/examples/solid-query/src/gen/hooks/getPetByIdQuery.ts +++ b/examples/solid-query/src/gen/hooks/getPetByIdQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [{ url: `/pet/${petId}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( petId: GetPetByIdPathParams['petId'], diff --git a/examples/solid-query/src/gen/hooks/getUserByNameQuery.ts b/examples/solid-query/src/gen/hooks/getUserByNameQuery.ts index e813a41a4..6eff245cf 100644 --- a/examples/solid-query/src/gen/hooks/getUserByNameQuery.ts +++ b/examples/solid-query/src/gen/hooks/getUserByNameQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [{ url: `/user/${username}`, params: { username: username } }] as const export function getUserByNameQueryOptions( username: GetUserByNamePathParams['username'], diff --git a/examples/solid-query/src/gen/hooks/loginUserQuery.ts b/examples/solid-query/src/gen/hooks/loginUserQuery.ts index 09904ef5d..d791cabd9 100644 --- a/examples/solid-query/src/gen/hooks/loginUserQuery.ts +++ b/examples/solid-query/src/gen/hooks/loginUserQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: LoginUserQueryParams) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( params?: LoginUserQueryParams, diff --git a/examples/solid-query/src/gen/hooks/logoutUserQuery.ts b/examples/solid-query/src/gen/hooks/logoutUserQuery.ts index a3fc2d98a..0cd4e7ad2 100644 --- a/examples/solid-query/src/gen/hooks/logoutUserQuery.ts +++ b/examples/solid-query/src/gen/hooks/logoutUserQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/solid-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/svelte-query/src/gen/hooks/findPetsByStatusQuery.ts b/examples/svelte-query/src/gen/hooks/findPetsByStatusQuery.ts index ad9161f69..0ccbe1d76 100644 --- a/examples/svelte-query/src/gen/hooks/findPetsByStatusQuery.ts +++ b/examples/svelte-query/src/gen/hooks/findPetsByStatusQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: FindPetsByStatusQueryParams) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( params?: FindPetsByStatusQueryParams, diff --git a/examples/svelte-query/src/gen/hooks/findPetsByTagsQuery.ts b/examples/svelte-query/src/gen/hooks/findPetsByTagsQuery.ts index ef2cd353f..12aab4891 100644 --- a/examples/svelte-query/src/gen/hooks/findPetsByTagsQuery.ts +++ b/examples/svelte-query/src/gen/hooks/findPetsByTagsQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( params?: FindPetsByTagsQueryParams, diff --git a/examples/svelte-query/src/gen/hooks/getInventoryQuery.ts b/examples/svelte-query/src/gen/hooks/getInventoryQuery.ts index 67052799f..d18ce7911 100644 --- a/examples/svelte-query/src/gen/hooks/getInventoryQuery.ts +++ b/examples/svelte-query/src/gen/hooks/getInventoryQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => [`/store/inventory`] as const +export const getInventoryQueryKey = () => [{ url: `/store/inventory` }] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/svelte-query/src/gen/hooks/getOrderByIdQuery.ts b/examples/svelte-query/src/gen/hooks/getOrderByIdQuery.ts index e0b69cb10..550a03d2b 100644 --- a/examples/svelte-query/src/gen/hooks/getOrderByIdQuery.ts +++ b/examples/svelte-query/src/gen/hooks/getOrderByIdQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [`/store/order/${orderId}`] as const +export const getOrderByIdQueryKey = (orderId: GetOrderByIdPathParams['orderId']) => [{ url: `/store/order/${orderId}`, params: { orderId: orderId } }] as const export function getOrderByIdQueryOptions( orderId: GetOrderByIdPathParams['orderId'], diff --git a/examples/svelte-query/src/gen/hooks/getPetByIdQuery.ts b/examples/svelte-query/src/gen/hooks/getPetByIdQuery.ts index b9eb52ed7..7c1f109f5 100644 --- a/examples/svelte-query/src/gen/hooks/getPetByIdQuery.ts +++ b/examples/svelte-query/src/gen/hooks/getPetByIdQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [`/pet/${petId}`] as const +export const getPetByIdQueryKey = (petId: GetPetByIdPathParams['petId']) => [{ url: `/pet/${petId}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( petId: GetPetByIdPathParams['petId'], diff --git a/examples/svelte-query/src/gen/hooks/getUserByNameQuery.ts b/examples/svelte-query/src/gen/hooks/getUserByNameQuery.ts index 0ceca0fd1..670b8e294 100644 --- a/examples/svelte-query/src/gen/hooks/getUserByNameQuery.ts +++ b/examples/svelte-query/src/gen/hooks/getUserByNameQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [`/user/${username}`] as const +export const getUserByNameQueryKey = (username: GetUserByNamePathParams['username']) => [{ url: `/user/${username}`, params: { username: username } }] as const export function getUserByNameQueryOptions( username: GetUserByNamePathParams['username'], diff --git a/examples/svelte-query/src/gen/hooks/loginUserQuery.ts b/examples/svelte-query/src/gen/hooks/loginUserQuery.ts index 4a6a88eee..04b6b0a04 100644 --- a/examples/svelte-query/src/gen/hooks/loginUserQuery.ts +++ b/examples/svelte-query/src/gen/hooks/loginUserQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (params?: LoginUserQueryParams) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: LoginUserQueryParams) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( params?: LoginUserQueryParams, diff --git a/examples/svelte-query/src/gen/hooks/logoutUserQuery.ts b/examples/svelte-query/src/gen/hooks/logoutUserQuery.ts index fa2c26271..ce2f07bc9 100644 --- a/examples/svelte-query/src/gen/hooks/logoutUserQuery.ts +++ b/examples/svelte-query/src/gen/hooks/logoutUserQuery.ts @@ -3,7 +3,7 @@ import { createQuery } from '@tanstack/svelte-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/useAddPet.ts b/examples/vue-query/src/gen/hooks/useAddPet.ts index 3977ef1ac..e6a03ef1a 100644 --- a/examples/vue-query/src/gen/hooks/useAddPet.ts +++ b/examples/vue-query/src/gen/hooks/useAddPet.ts @@ -18,6 +18,7 @@ export function useAddPet, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useCreateUser.ts b/examples/vue-query/src/gen/hooks/useCreateUser.ts index 221ffd9fa..0ed9ef86b 100644 --- a/examples/vue-query/src/gen/hooks/useCreateUser.ts +++ b/examples/vue-query/src/gen/hooks/useCreateUser.ts @@ -18,6 +18,7 @@ export function useCreateUser, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts b/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts index 9c90b9709..a3af8fff4 100644 --- a/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts +++ b/examples/vue-query/src/gen/hooks/useCreateUsersWithListInput.ts @@ -22,6 +22,7 @@ export function useCreateUsersWithListInput< } = {}, ): UseMutationReturnType, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts index eaad750a5..0c5af2ca4 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteOrder.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteOrder.ts @@ -21,6 +21,7 @@ export function useDeleteOrder, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, void, unknown>({ mutationFn: () => { const orderId = unref(refOrderId) diff --git a/examples/vue-query/src/gen/hooks/useDeletePet.ts b/examples/vue-query/src/gen/hooks/useDeletePet.ts index 81478e8ae..f8c9159a8 100644 --- a/examples/vue-query/src/gen/hooks/useDeletePet.ts +++ b/examples/vue-query/src/gen/hooks/useDeletePet.ts @@ -22,6 +22,7 @@ export function useDeletePet, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, void, unknown>({ mutationFn: () => { const petId = unref(refPetId) diff --git a/examples/vue-query/src/gen/hooks/useDeleteUser.ts b/examples/vue-query/src/gen/hooks/useDeleteUser.ts index a7590b347..1539672cf 100644 --- a/examples/vue-query/src/gen/hooks/useDeleteUser.ts +++ b/examples/vue-query/src/gen/hooks/useDeleteUser.ts @@ -21,6 +21,7 @@ export function useDeleteUser, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, void, unknown>({ mutationFn: () => { const username = unref(refUsername) diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts index 4cdac15b6..46ae99569 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByStatus.ts @@ -5,7 +5,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByStatusQueryResponse, FindPetsByStatusQueryParams, FindPetsByStatus400 } from '../models/FindPetsByStatus' -export const findPetsByStatusQueryKey = (params?: MaybeRef) => [`/pet/findByStatus`, ...(params ? [params] : [])] as const +export const findPetsByStatusQueryKey = (params?: MaybeRef) => [{ url: `/pet/findByStatus` }, ...(params ? [params] : [])] as const export function findPetsByStatusQueryOptions( refParams?: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts index b8dba7f00..2559149ae 100644 --- a/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts +++ b/examples/vue-query/src/gen/hooks/useFindPetsByTags.ts @@ -5,7 +5,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { FindPetsByTagsQueryResponse, FindPetsByTagsQueryParams, FindPetsByTags400 } from '../models/FindPetsByTags' -export const findPetsByTagsQueryKey = (params?: MaybeRef) => [`/pet/findByTags`, ...(params ? [params] : [])] as const +export const findPetsByTagsQueryKey = (params?: MaybeRef) => [{ url: `/pet/findByTags` }, ...(params ? [params] : [])] as const export function findPetsByTagsQueryOptions( refParams?: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useGetInventory.ts b/examples/vue-query/src/gen/hooks/useGetInventory.ts index 084735d29..085ecca12 100644 --- a/examples/vue-query/src/gen/hooks/useGetInventory.ts +++ b/examples/vue-query/src/gen/hooks/useGetInventory.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetInventoryQueryResponse } from '../models/GetInventory' -export const getInventoryQueryKey = () => [`/store/inventory`] as const +export const getInventoryQueryKey = () => [{ url: `/store/inventory` }] as const export function getInventoryQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/useGetOrderById.ts b/examples/vue-query/src/gen/hooks/useGetOrderById.ts index e27b9db6a..86d351e9d 100644 --- a/examples/vue-query/src/gen/hooks/useGetOrderById.ts +++ b/examples/vue-query/src/gen/hooks/useGetOrderById.ts @@ -5,7 +5,8 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetOrderByIdQueryResponse, GetOrderByIdPathParams, GetOrderById400 } from '../models/GetOrderById' -export const getOrderByIdQueryKey = (orderId: MaybeRef) => [`/store/order/${unref(orderId)}`] as const +export const getOrderByIdQueryKey = (orderId: MaybeRef) => + [{ url: `/store/order/${unref(orderId)}`, params: { orderId: orderId } }] as const export function getOrderByIdQueryOptions( refOrderId: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useGetPetById.ts b/examples/vue-query/src/gen/hooks/useGetPetById.ts index da89ed6f9..1822a82cf 100644 --- a/examples/vue-query/src/gen/hooks/useGetPetById.ts +++ b/examples/vue-query/src/gen/hooks/useGetPetById.ts @@ -5,7 +5,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetPetByIdQueryResponse, GetPetByIdPathParams, GetPetById400 } from '../models/GetPetById' -export const getPetByIdQueryKey = (petId: MaybeRef) => [`/pet/${unref(petId)}`] as const +export const getPetByIdQueryKey = (petId: MaybeRef) => [{ url: `/pet/${unref(petId)}`, params: { petId: petId } }] as const export function getPetByIdQueryOptions( refPetId: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useGetUserByName.ts b/examples/vue-query/src/gen/hooks/useGetUserByName.ts index 754ad555c..68a041364 100644 --- a/examples/vue-query/src/gen/hooks/useGetUserByName.ts +++ b/examples/vue-query/src/gen/hooks/useGetUserByName.ts @@ -5,7 +5,8 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { GetUserByNameQueryResponse, GetUserByNamePathParams, GetUserByName400 } from '../models/GetUserByName' -export const getUserByNameQueryKey = (username: MaybeRef) => [`/user/${unref(username)}`] as const +export const getUserByNameQueryKey = (username: MaybeRef) => + [{ url: `/user/${unref(username)}`, params: { username: username } }] as const export function getUserByNameQueryOptions( refUsername: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useLoginUser.ts b/examples/vue-query/src/gen/hooks/useLoginUser.ts index 5a3c35b1f..8dfad0a48 100644 --- a/examples/vue-query/src/gen/hooks/useLoginUser.ts +++ b/examples/vue-query/src/gen/hooks/useLoginUser.ts @@ -5,7 +5,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LoginUserQueryResponse, LoginUserQueryParams, LoginUser400 } from '../models/LoginUser' -export const loginUserQueryKey = (params?: MaybeRef) => [`/user/login`, ...(params ? [params] : [])] as const +export const loginUserQueryKey = (params?: MaybeRef) => [{ url: `/user/login` }, ...(params ? [params] : [])] as const export function loginUserQueryOptions( refParams?: MaybeRef, diff --git a/examples/vue-query/src/gen/hooks/useLogoutUser.ts b/examples/vue-query/src/gen/hooks/useLogoutUser.ts index 69a8d7fc8..a735ee6c1 100644 --- a/examples/vue-query/src/gen/hooks/useLogoutUser.ts +++ b/examples/vue-query/src/gen/hooks/useLogoutUser.ts @@ -3,7 +3,7 @@ import { useQuery } from '@tanstack/vue-query' import client from '@kubb/swagger-client/client' import type { LogoutUserQueryResponse } from '../models/LogoutUser' -export const logoutUserQueryKey = () => [`/user/logout`] as const +export const logoutUserQueryKey = () => [{ url: `/user/logout` }] as const export function logoutUserQueryOptions( options: Partial[0]> = {}, diff --git a/examples/vue-query/src/gen/hooks/usePlaceOrder.ts b/examples/vue-query/src/gen/hooks/usePlaceOrder.ts index 957933512..edeb485fc 100644 --- a/examples/vue-query/src/gen/hooks/usePlaceOrder.ts +++ b/examples/vue-query/src/gen/hooks/usePlaceOrder.ts @@ -18,6 +18,7 @@ export function usePlaceOrder, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUpdatePet.ts b/examples/vue-query/src/gen/hooks/useUpdatePet.ts index 82a5836e3..0f3abea82 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePet.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePet.ts @@ -18,6 +18,7 @@ export function useUpdatePet, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { return client({ diff --git a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts index 8958266f5..83089b4ff 100644 --- a/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts +++ b/examples/vue-query/src/gen/hooks/useUpdatePetWithForm.ts @@ -26,6 +26,7 @@ export function useUpdatePetWithForm, TError, void, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, void, unknown>({ mutationFn: () => { const petId = unref(refPetId) diff --git a/examples/vue-query/src/gen/hooks/useUpdateUser.ts b/examples/vue-query/src/gen/hooks/useUpdateUser.ts index 45fb207a7..508c7c8aa 100644 --- a/examples/vue-query/src/gen/hooks/useUpdateUser.ts +++ b/examples/vue-query/src/gen/hooks/useUpdateUser.ts @@ -21,6 +21,7 @@ export function useUpdateUser, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { const username = unref(refUsername) diff --git a/examples/vue-query/src/gen/hooks/useUploadFile.ts b/examples/vue-query/src/gen/hooks/useUploadFile.ts index 3546847db..20b0e5dfb 100644 --- a/examples/vue-query/src/gen/hooks/useUploadFile.ts +++ b/examples/vue-query/src/gen/hooks/useUploadFile.ts @@ -21,6 +21,7 @@ export function useUploadFile, TError, TVariables, unknown> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {} + return useMutation, TError, TVariables, unknown>({ mutationFn: (data) => { const petId = unref(refPetId) diff --git a/packages/core/src/utils/URLPath.test.ts b/packages/core/src/utils/URLPath.test.ts index a82316a4d..0e1dd923a 100644 --- a/packages/core/src/utils/URLPath.test.ts +++ b/packages/core/src/utils/URLPath.test.ts @@ -2,12 +2,37 @@ import { URLPath } from './URLPath.ts' describe('URLPath', () => { const path = new URLPath('/user/{userID}/monetary-account/{monetary-accountID}/whitelist-sdd/{itemId}') + const simplePath = new URLPath('/user/{userID}') test('if templateStrings returns correct format', () => { expect(path.template).toBe('`/user/${userId}/monetary-account/${monetaryAccountId}/whitelist-sdd/${itemId}`') expect('/pet/findByStatus').toBe('/pet/findByStatus') }) + test('if templateStrings returns correct format with replacer', () => { + expect(simplePath.toTemplateString((item) => `unref(${item})`)).toBe('`/user/${unref(userId)}`') + expect(simplePath.template).toBe('`/user/${userId}`') + expect(URLPath.toTemplateString(simplePath.path)).toBe('`/user/${userId}`') + }) + test('if URL path returns the correct format', () => { expect(path.URL).toBe('/user/:userID/monetary-account/:monetary-accountID/whitelist-sdd/:itemId') }) + + test('if params is getting returned', () => { + expect(simplePath.params).toStrictEqual({ userId: 'userId' }) + expect(simplePath.getParams()).toStrictEqual({ userId: 'userId' }) + expect(URLPath.getParams(simplePath.path)).toStrictEqual({ userId: 'userId' }) + }) + test('if object is getting returned', () => { + expect(simplePath.object).toStrictEqual({ url: '/user/:userID', params: { userId: 'userId' } }) + expect(simplePath.toObject()).toStrictEqual({ url: '/user/:userID', params: { userId: 'userId' } }) + expect(simplePath.toObject({ type: 'template' })).toStrictEqual({ url: '`/user/${userId}`', params: { userId: 'userId' } }) + // const userId = 2 + expect(simplePath.toObject({ type: 'template', stringify: true })).toStrictEqual('{url:`/user/${userId}`,params:{userId:userId}}') + + expect(URLPath.toObject(simplePath.path)).toStrictEqual({ url: '/user/:userID', params: { userId: 'userId' } }) + + expect(URLPath.toObject('/test')).toStrictEqual({ url: '/test', params: undefined }) + expect(URLPath.toObject('/test', { type: 'template', stringify: true })).toStrictEqual('{url:`/test`}') + }) }) diff --git a/packages/core/src/utils/URLPath.ts b/packages/core/src/utils/URLPath.ts index a050493dd..57dbd2a07 100644 --- a/packages/core/src/utils/URLPath.ts +++ b/packages/core/src/utils/URLPath.ts @@ -1,5 +1,16 @@ import { camelCase, camelCaseTransformMerge } from 'change-case' +type URLObject = { + url: string + params?: Record +} + +type ObjectOptions = { + type?: 'path' | 'template' + replacer?: (pathParam: string) => string + stringify?: boolean +} + export class URLPath { path: string @@ -28,6 +39,17 @@ export class URLPath { return this.toTemplateString() } + get object(): URLObject | string { + return this.toObject() + } + get params(): Record | undefined { + return this.getParams() + } + + toObject(options: ObjectOptions = {}): URLObject | string { + return URLPath.toObject(this.path, options) + } + /** * Convert Swagger path to template literals/ template strings(camelcase) * @example /pet/{petId} => `/pet/${petId}` @@ -62,6 +84,32 @@ export class URLPath { return `\`${newPath}\`` } + getParams(replacer?: (pathParam: string) => string): Record | undefined { + return URLPath.getParams(this.path, replacer) + } + + static getParams(path: string, replacer?: (pathParam: string) => string): Record | undefined { + const regex = /{(\w|-)*}/g + const found = path.match(regex) + + if (!found) { + return undefined + } + + const params: Record = {} + found.forEach((item) => { + item = item.replaceAll('{', '').replaceAll('}', '') + + const pathParam = replacer + ? replacer(camelCase(item, { delimiter: '', transform: camelCaseTransformMerge })) + : camelCase(item, { delimiter: '', transform: camelCaseTransformMerge }) + + params[pathParam] = pathParam + }, path) + + return params + } + /** * Convert Swagger path to URLPath(syntax of Express) * @example /pet/{petId} => /pet/:petId @@ -74,6 +122,22 @@ export class URLPath { return path.replaceAll('{', ':').replaceAll('}', '') } + static toObject(path: string, { type = 'path', replacer, stringify }: ObjectOptions = {}): URLObject | string { + const object = { + url: type === 'path' ? URLPath.toURLPath(path) : URLPath.toTemplateString(path, replacer), + params: URLPath.getParams(path), + } + + if (stringify) { + if (type !== 'template') { + throw new Error('Type should be `template` when using stringiyf') + } + return JSON.stringify(object).replaceAll("'", '').replaceAll(`"`, '') + } + + return object + } + static isURL(path: string): boolean { try { const url = new URL(path) diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index 1fa31f2ea..aae302067 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -54,7 +54,11 @@ export class QueryBuilder extends OasBuilder { const params = createFunctionParams(paramsData) const result = [ - new URLPath(operation.path).toTemplateString((pathParam) => (framework === 'vue' ? `unref(${pathParam})` : pathParam)), + new URLPath(operation.path).toObject({ + type: 'template', + stringify: true, + replacer: framework === 'vue' ? (pathParam) => `unref(${pathParam})` : undefined, + }), schemas.queryParams?.name ? `...(params ? [params] : [])` : undefined, ].filter(Boolean) @@ -473,6 +477,7 @@ export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.q codes.push(` export function ${name} <${generics.join(',')}>(${params}): ${frameworkImports.mutate.UseMutationResult}<${mutationGenerics.join(', ')}> { const { mutation: mutationOptions, client: clientOptions = {} } = options ?? {}; + return ${frameworkImports.mutate.useMutation}<${mutationGenerics.join(', ')}>({ mutationFn: (${schemas.request?.name ? 'data' : ''}) => { ${unrefs} From 26188edbedb7b14431d51f66929d80d7508009eb Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Mon, 9 Oct 2023 13:16:16 +0200 Subject: [PATCH 7/9] fix: add react-query-devtools --- examples/react-query/package.json | 1 + examples/react-query/src/App.tsx | 2 ++ examples/react-query/src/mocks/index.ts | 2 +- pnpm-lock.yaml | 37 +++++++++++++++++++++++++ 4 files changed, 41 insertions(+), 1 deletion(-) diff --git a/examples/react-query/package.json b/examples/react-query/package.json index 528c2c43f..77c778292 100644 --- a/examples/react-query/package.json +++ b/examples/react-query/package.json @@ -28,6 +28,7 @@ "@kubb/swagger-tanstack-query": "workspace:*", "@kubb/swagger-ts": "workspace:*", "@tanstack/react-query": "^4.36.1", + "@tanstack/react-query-devtools": "^4.36.1", "axios": "^1.5.1", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/examples/react-query/src/App.tsx b/examples/react-query/src/App.tsx index af55ef911..b1c30913e 100644 --- a/examples/react-query/src/App.tsx +++ b/examples/react-query/src/App.tsx @@ -2,6 +2,7 @@ import { useState } from 'react' import type { FindPetsByStatusQueryParamsStatus } from './gen' import { useFindPetsByStatusHook } from './gen' import { QueryClient, QueryClientProvider } from '@tanstack/react-query' +import { ReactQueryDevtools } from '@tanstack/react-query-devtools' const queryClient = new QueryClient() @@ -23,6 +24,7 @@ export function App(): JSX.Element { return ( + ) } diff --git a/examples/react-query/src/mocks/index.ts b/examples/react-query/src/mocks/index.ts index 7309d8e98..6c7eeb6cd 100644 --- a/examples/react-query/src/mocks/index.ts +++ b/examples/react-query/src/mocks/index.ts @@ -2,7 +2,7 @@ import { setupWorker, rest } from 'msw' export const worker = setupWorker( rest.get('/pet/findByStatus', (req, res, ctx) => { - if (req.params['status'] === 'pending') { + if (req.url.searchParams.get('status') === 'pending') { return res( ctx.json([ { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d77487844..fe35470d9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -388,6 +388,9 @@ importers: '@tanstack/react-query': specifier: ^4.36.1 version: 4.36.1(react-dom@18.2.0)(react@18.2.0) + '@tanstack/react-query-devtools': + specifier: ^4.36.1 + version: 4.36.1(@tanstack/react-query@4.36.1)(react-dom@18.2.0)(react@18.2.0) axios: specifier: ^1.5.1 version: 1.5.1 @@ -2614,6 +2617,21 @@ packages: resolution: {integrity: sha512-DJSilV5+ytBP1FbFcEJovv4rnnm/CokuVvrBEtW/Va9DvuJ3HksbXUJEpI0aV1KtuL4ZoO9AVE6PyNLzF7tLeA==} dev: false + /@tanstack/react-query-devtools@4.36.1(@tanstack/react-query@4.36.1)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-WYku83CKP3OevnYSG8Y/QO9g0rT75v1om5IvcWUwiUZJ4LanYGLVCZ8TdFG5jfsq4Ej/lu2wwDAULEUnRIMBSw==} + peerDependencies: + '@tanstack/react-query': ^4.36.1 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + dependencies: + '@tanstack/match-sorter-utils': 8.8.4 + '@tanstack/react-query': 4.36.1(react-dom@18.2.0)(react@18.2.0) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + superjson: 1.13.3 + use-sync-external-store: 1.2.0(react@18.2.0) + dev: false + /@tanstack/react-query@4.36.1(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-y7ySVHFyyQblPl3J3eQBWpXZkliroki3ARnBKsdJchlgt7yJLRDUcf4B8soufgiYt3pEQIkBWBx1N9/ZPIeUWw==} peerDependencies: @@ -3971,6 +3989,13 @@ packages: engines: {node: '>= 0.6'} dev: false + /copy-anything@3.0.5: + resolution: {integrity: sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==} + engines: {node: '>=12.13'} + dependencies: + is-what: 4.1.15 + dev: false + /cosmiconfig@8.3.6(typescript@5.2.2): resolution: {integrity: sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==} engines: {node: '>=14'} @@ -5580,6 +5605,11 @@ packages: get-intrinsic: 1.2.1 dev: false + /is-what@4.1.15: + resolution: {integrity: sha512-uKua1wfy3Yt+YqsD6mTUEa2zSi3G1oPlqTflgaPJ7z63vUGN5pxFpnQfeSLMFnJDEsdvOtkp1rUWkYjB4YfhgA==} + engines: {node: '>=12.13'} + dev: false + /isarray@2.0.5: resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==} dev: false @@ -7224,6 +7254,13 @@ packages: pirates: 4.0.6 ts-interface-checker: 0.1.13 + /superjson@1.13.3: + resolution: {integrity: sha512-mJiVjfd2vokfDxsQPOwJ/PtanO87LhpYY88ubI5dUB1Ab58Txbyje3+jpm+/83R/fevaq/107NNhtYBLuoTrFg==} + engines: {node: '>=10'} + dependencies: + copy-anything: 3.0.5 + dev: false + /supports-color@2.0.0: resolution: {integrity: sha512-KKNVtd6pCYgPIKU4cp2733HWYCpplQhddZLBUryaAHou723x+FRzQ5Df824Fj+IyyuiQTRoub4SnIFfIcrp70g==} engines: {node: '>=0.8.0'} From b9c2f4f4a7eb47971f47bc19df69b467b50e6209 Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Mon, 9 Oct 2023 13:46:50 +0200 Subject: [PATCH 8/9] chore: cleanup --- docs/.vitepress/config.ts | 3 +- docs/.vitepress/theme/index.ts | 6 +- e2e/package.json | 2 +- e2e/src/client.ts | 2 +- examples/advanced/package.json | 2 +- examples/vue-query/package.json | 2 +- examples/vue-query/src/Pets.vue | 3 +- package.json | 1 - packages/cli/src/generate.ts | 13 ++- packages/cli/src/index.ts | 6 +- packages/cli/src/init.ts | 2 +- packages/cli/src/utils/OraWritable.ts | 6 +- packages/cli/src/utils/getSummary.ts | 8 +- packages/cli/src/utils/renderErrors.ts | 4 +- packages/cli/src/utils/spinner.ts | 1 + packages/config/eslint-config/src/flat.ts | 2 +- packages/config/eslint-config/src/index.ts | 2 +- packages/core/src/build.test.ts | 2 +- packages/core/src/build.ts | 9 +- .../src/managers/fileManager/FileManager.ts | 6 +- .../core/src/managers/fileManager/utils.ts | 5 +- .../pluginManager/ParallelPluginError.test.ts | 2 +- .../pluginManager/PluginError.test.ts | 2 +- .../pluginManager/PluginManager.test.ts | 2 +- .../managers/pluginManager/PluginManager.ts | 13 ++- packages/core/src/types.ts | 2 +- packages/core/src/utils/EventEmitter.ts | 1 + packages/core/src/utils/importModule.test.ts | 3 +- packages/core/src/utils/importModule.ts | 2 +- packages/core/src/utils/logger.ts | 3 +- packages/core/src/utils/randomColour.ts | 3 +- packages/core/src/utils/read.ts | 2 +- packages/core/src/utils/write.ts | 3 +- packages/react-template/package.json | 2 +- packages/react-template/src/ReactTemplate.tsx | 93 ++++--------------- .../react-template/src/components/App.tsx | 1 + .../react-template/src/components/Export.tsx | 1 + .../src/components/Function.tsx | 7 +- .../react-template/src/components/Import.tsx | 1 + .../react-template/src/components/Text.tsx | 1 + packages/react-template/src/instances.ts | 2 +- packages/react-template/src/reconciler.ts | 7 +- packages/react-template/src/render.ts | 37 ++------ packages/react-template/src/renderer.ts | 9 +- .../react-template/src/squashExportNodes.ts | 6 +- .../react-template/src/squashImportNodes.ts | 5 +- .../react-template/src/squashTextNodes.ts | 5 +- packages/swagger-client/client.ts | 2 +- .../src/builders/ClientBuilder.tsx | 10 +- .../src/components/ClientFunction.tsx | 6 +- .../src/generators/OperationGenerator.ts | 4 +- packages/swagger-client/src/plugin.ts | 6 +- packages/swagger-client/src/types.ts | 3 +- .../src/builders/FakerBuilder.ts | 3 +- .../src/generators/FakerGenerator.ts | 2 +- packages/swagger-faker/src/plugin.ts | 9 +- .../swagger-msw/src/builders/MSWBuilder.ts | 5 +- packages/swagger-msw/src/plugin.ts | 9 +- .../swagger-swr/src/builders/QueryBuilder.ts | 9 +- .../src/generators/OperationGenerator.ts | 5 +- packages/swagger-swr/src/plugin.ts | 7 +- .../src/builders/QueryBuilder.ts | 15 ++- .../src/generators/OperationGenerator.ts | 8 +- packages/swagger-tanstack-query/src/plugin.ts | 4 +- .../swagger-ts/src/builders/TypeBuilder.ts | 3 +- .../src/generators/TypeGenerator.ts | 2 +- packages/swagger-ts/src/plugin.ts | 7 +- .../swagger-zod/src/builders/ZodBuilder.ts | 3 +- .../src/generators/ZodGenerator.ts | 2 +- packages/swagger-zod/src/plugin.ts | 7 +- packages/swagger-zodios/src/plugin.ts | 2 +- .../src/generators/OperationGenerator.ts | 6 +- packages/swagger/src/parsers/oasParser.ts | 5 +- packages/swagger/src/plugin.ts | 4 +- packages/swagger/src/types.ts | 4 +- packages/swagger/src/utils/getParams.ts | 3 +- packages/ts-codegen/src/codegen.ts | 2 +- pnpm-lock.yaml | 32 ++----- prettier.config.cjs | 4 +- 79 files changed, 203 insertions(+), 292 deletions(-) diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index 55306c172..0326decfb 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -1,7 +1,8 @@ -import { defineConfig } from 'vitepress' import { createWriteStream } from 'node:fs' import { resolve } from 'node:path' + import { SitemapStream } from 'sitemap' +import { defineConfig } from 'vitepress' import { version } from '../../packages/core/package.json' diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index aabda9453..1b7b04574 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -1,8 +1,8 @@ // https://vitepress.dev/guide/custom-theme -import { h } from 'vue' -import DefaultTheme from 'vitepress/theme' -import { EnhanceAppContext } from 'vitepress/dist/client' import { inject } from '@vercel/analytics' +import { EnhanceAppContext } from 'vitepress/dist/client' +import DefaultTheme from 'vitepress/theme' +import { h } from 'vue' import HomePage from './HomePage.vue' diff --git a/e2e/package.json b/e2e/package.json index 1a8e093f1..b5f2efc22 100644 --- a/e2e/package.json +++ b/e2e/package.json @@ -34,7 +34,7 @@ "@tanstack/react-query": "^4.36.1", "@tanstack/solid-query": "^4.36.1", "@tanstack/svelte-query": "^4.36.1", - "@tanstack/vue-query": "^4.36.1", + "@tanstack/vue-query": "^4.36.2", "@zodios/core": "^10.9.6", "axios": "^1.5.1", "msw": "^1.3.2", diff --git a/e2e/src/client.ts b/e2e/src/client.ts index bd6ec9d1f..626d7d793 100644 --- a/e2e/src/client.ts +++ b/e2e/src/client.ts @@ -1,6 +1,6 @@ import axios from 'axios' -import type { AxiosError, AxiosHeaders, AxiosResponse, AxiosRequestConfig } from 'axios' +import type { AxiosError, AxiosHeaders, AxiosRequestConfig, AxiosResponse } from 'axios' declare const AXIOS_BASE: string declare const AXIOS_HEADERS: string diff --git a/examples/advanced/package.json b/examples/advanced/package.json index 5d0400ded..714c23802 100644 --- a/examples/advanced/package.json +++ b/examples/advanced/package.json @@ -38,7 +38,7 @@ "@tanstack/react-query": "^4.36.1", "@tanstack/solid-query": "^4.36.1", "@tanstack/svelte-query": "^4.36.1", - "@tanstack/vue-query": "^4.36.1", + "@tanstack/vue-query": "^4.36.2", "@zodios/core": "^10.9.6", "axios": "^1.5.1", "msw": "^1.3.2", diff --git a/examples/vue-query/package.json b/examples/vue-query/package.json index e646e7098..2620441fc 100644 --- a/examples/vue-query/package.json +++ b/examples/vue-query/package.json @@ -28,7 +28,7 @@ "@kubb/swagger-tanstack-query": "workspace:*", "@kubb/swagger-ts": "workspace:*", "@kubb/swagger-zod": "workspace:*", - "@tanstack/vue-query": "^4.36.1", + "@tanstack/vue-query": "^4.36.2", "axios": "^1.5.1", "vue": "^3.3.4" }, diff --git a/examples/vue-query/src/Pets.vue b/examples/vue-query/src/Pets.vue index 8fc8bb6c4..74c8b037c 100644 --- a/examples/vue-query/src/Pets.vue +++ b/examples/vue-query/src/Pets.vue @@ -18,8 +18,7 @@ export default defineComponent({ } }) - const petsQuery = useFindPetsByStatus(params ) - + const petsQuery = useFindPetsByStatus(params) const pets = computed(() => unref(petsQuery?.data)); return { diff --git a/package.json b/package.json index a1081001f..d223bcec8 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,6 @@ "bun-types": "^1.0.4", "prettier": "^3.0.3", "prettier-eslint": "^15.0.1", - "prettier-plugin-curly": "^0.1.3", "ts-node": "^10.9.1", "turbo": "^1.10.15", "typescript": "~5.2.2", diff --git a/packages/cli/src/generate.ts b/packages/cli/src/generate.ts index 4d81196d8..7c317cbc2 100644 --- a/packages/cli/src/generate.ts +++ b/packages/cli/src/generate.ts @@ -1,17 +1,16 @@ -import { build, ParallelPluginError, PluginError, SummaryError, timeout, LogLevel } from '@kubb/core' - -import type { ExecaReturnValue } from 'execa' -import type { Writable } from 'node:stream' +import { build, LogLevel, ParallelPluginError, PluginError, SummaryError, timeout } from '@kubb/core' import { execa } from 'execa' import pc from 'picocolors' import { parseArgsStringToArgv } from 'string-argv' -import type { CLIOptions, KubbConfig } from '@kubb/core' +import { getSummary } from './utils/getSummary.ts' import { OraWritable } from './utils/OraWritable.ts' import { spinner } from './utils/spinner.ts' -import { getSummary } from './utils/getSummary.ts' -import type { Logger } from '@kubb/core' + +import type { CLIOptions, KubbConfig, Logger } from '@kubb/core' +import type { ExecaReturnValue } from 'execa' +import type { Writable } from 'node:stream' type GenerateProps = { input?: string diff --git a/packages/cli/src/index.ts b/packages/cli/src/index.ts index e64bb0f32..d14e0aa2d 100644 --- a/packages/cli/src/index.ts +++ b/packages/cli/src/index.ts @@ -1,16 +1,16 @@ import pathParser from 'node:path' +import { createLogger, LogLevel, SummaryError, Warning } from '@kubb/core' + import cac from 'cac' import pc from 'picocolors' import { version } from '../package.json' -import init from './init.ts' import generate from './generate.ts' +import init from './init.ts' import { getConfig, getCosmiConfig, renderErrors, spinner, startWatcher } from './utils/index.ts' -import { LogLevel, SummaryError, createLogger } from '@kubb/core' import type { CLIOptions } from '@kubb/core' -import { Warning } from '@kubb/core' const moduleName = 'kubb' const logger = createLogger(spinner) diff --git a/packages/cli/src/init.ts b/packages/cli/src/init.ts index aa950ba7d..176b8ea1f 100644 --- a/packages/cli/src/init.ts +++ b/packages/cli/src/init.ts @@ -1,6 +1,6 @@ import pathParser from 'node:path' -import { LogLevel, isPromiseFulfilledResult, write } from '@kubb/core' +import { isPromiseFulfilledResult, LogLevel, write } from '@kubb/core' import { $ } from 'execa' import pc from 'picocolors' diff --git a/packages/cli/src/utils/OraWritable.ts b/packages/cli/src/utils/OraWritable.ts index 6b0e6707e..c95949eda 100644 --- a/packages/cli/src/utils/OraWritable.ts +++ b/packages/cli/src/utils/OraWritable.ts @@ -3,11 +3,13 @@ /* eslint-disable @typescript-eslint/no-unsafe-call */ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ -import type { WritableOptions } from 'node:stream' import { Writable } from 'node:stream' -import type { Ora } from 'ora' + import pc from 'picocolors' +import type { WritableOptions } from 'node:stream' +import type { Ora } from 'ora' + export class OraWritable extends Writable { public command: string public spinner: Ora diff --git a/packages/cli/src/utils/getSummary.ts b/packages/cli/src/utils/getSummary.ts index 53cd8d161..7b0a47b74 100644 --- a/packages/cli/src/utils/getSummary.ts +++ b/packages/cli/src/utils/getSummary.ts @@ -1,9 +1,13 @@ import pathParser from 'node:path' -import type { BuildOutput, KubbConfig } from '@kubb/core' -import { randomPicoColour, LogLevel } from '@kubb/core' + +import { LogLevel, randomPicoColour } from '@kubb/core' + import pc from 'picocolors' + import { parseHrtimeToSeconds } from './parseHrtimeToSeconds.ts' +import type { BuildOutput, KubbConfig } from '@kubb/core' + type SummaryProps = { pluginManager: BuildOutput['pluginManager'] status: 'success' | 'failed' diff --git a/packages/cli/src/utils/renderErrors.ts b/packages/cli/src/utils/renderErrors.ts index da021ac96..6f66cddae 100644 --- a/packages/cli/src/utils/renderErrors.ts +++ b/packages/cli/src/utils/renderErrors.ts @@ -2,8 +2,8 @@ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ -import { LogLevel } from '@kubb/core' -import { ParallelPluginError } from '@kubb/core' +import { LogLevel, ParallelPluginError } from '@kubb/core' + import PrettyError from 'pretty-error' export const prettyError = new PrettyError() diff --git a/packages/cli/src/utils/spinner.ts b/packages/cli/src/utils/spinner.ts index 7815e6af5..bac528bb1 100644 --- a/packages/cli/src/utils/spinner.ts +++ b/packages/cli/src/utils/spinner.ts @@ -1,4 +1,5 @@ import ora from 'ora' + export const spinner = ora({ spinner: 'clock', }) diff --git a/packages/config/eslint-config/src/flat.ts b/packages/config/eslint-config/src/flat.ts index 8e34c5d7e..ad23a5d9e 100644 --- a/packages/config/eslint-config/src/flat.ts +++ b/packages/config/eslint-config/src/flat.ts @@ -38,10 +38,10 @@ import vitestGlobalsPlugin from 'eslint-plugin-vitest-globals' */ import globals from 'globals' +import { ignores } from './ignores' import { rules } from './rules' import type { Linter } from 'eslint' -import { ignores } from './ignores' /** * Recommended plugins CJS diff --git a/packages/config/eslint-config/src/index.ts b/packages/config/eslint-config/src/index.ts index fdd0468b3..807b77133 100644 --- a/packages/config/eslint-config/src/index.ts +++ b/packages/config/eslint-config/src/index.ts @@ -1,9 +1,9 @@ import globals from 'globals' +import { ignores } from './ignores' import { rules } from './rules' import type { Linter } from 'eslint' -import { ignores } from './ignores' const config: Linter.Config = { root: true, diff --git a/packages/core/src/build.test.ts b/packages/core/src/build.test.ts index 24dcd5480..f0388dff2 100644 --- a/packages/core/src/build.test.ts +++ b/packages/core/src/build.test.ts @@ -1,8 +1,8 @@ import { build } from './build' -import type { KubbConfig } from './types' import { createPlugin } from './plugin' import type { File } from './managers/fileManager/types' +import type { KubbConfig } from './types' describe('build', () => { const pluginMocks = { diff --git a/packages/core/src/build.ts b/packages/core/src/build.ts index 60c86207e..dc9ea821d 100644 --- a/packages/core/src/build.ts +++ b/packages/core/src/build.ts @@ -1,13 +1,14 @@ +import pc from 'picocolors' + import { createFileSource } from './managers/fileManager/index.ts' import { PluginManager } from './managers/pluginManager/index.ts' -import { clean, createLogger, URLPath, randomPicoColour, read } from './utils/index.ts' +import { LogLevel } from './types.ts' +import { clean, createLogger, randomPicoColour, read, URLPath } from './utils/index.ts' import { isPromise } from './utils/isPromise.ts' -import pc from 'picocolors' import type { File, ResolvedFile } from './managers/fileManager/index.ts' -import { LogLevel } from './types.ts' import type { BuildOutput, KubbPlugin, PluginContext, TransformResult } from './types.ts' -import type { QueueJob, Logger } from './utils/index.ts' +import type { Logger, QueueJob } from './utils/index.ts' type BuildOptions = { config: PluginContext['config'] diff --git a/packages/core/src/managers/fileManager/FileManager.ts b/packages/core/src/managers/fileManager/FileManager.ts index 5d9aa24ef..17d598996 100644 --- a/packages/core/src/managers/fileManager/FileManager.ts +++ b/packages/core/src/managers/fileManager/FileManager.ts @@ -1,12 +1,12 @@ import crypto from 'node:crypto' import { read, write } from '../../utils/index.ts' -import type { Extension } from './utils.ts' import { extensions } from './utils.ts' -import type { Queue, QueueJob } from '../../utils/index.ts' -import type { File, ResolvedFile, CacheItem, UUID } from './types.ts' import type { Path } from '../../types.ts' +import type { Queue, QueueJob } from '../../utils/index.ts' +import type { CacheItem, File, ResolvedFile, UUID } from './types.ts' +import type { Extension } from './utils.ts' export class FileManager { private cache: Map = new Map() diff --git a/packages/core/src/managers/fileManager/utils.ts b/packages/core/src/managers/fileManager/utils.ts index 70494b982..80918243d 100644 --- a/packages/core/src/managers/fileManager/utils.ts +++ b/packages/core/src/managers/fileManager/utils.ts @@ -2,12 +2,13 @@ import pathParser from 'node:path' import { createExportDeclaration, createImportDeclaration, print } from '@kubb/ts-codegen' +import isEqual from 'lodash.isequal' + import { TreeNode } from '../../utils/index.ts' import type { Path } from '../../types.ts' import type { PathMode, TreeNodeOptions } from '../../utils/index.ts' -import type { Import, Export, File } from './types.ts' -import isEqual from 'lodash.isequal' +import type { Export, File, Import } from './types.ts' type TreeNodeData = { type: PathMode; path: Path; name: string } diff --git a/packages/core/src/managers/pluginManager/ParallelPluginError.test.ts b/packages/core/src/managers/pluginManager/ParallelPluginError.test.ts index 440c2f532..07154b01b 100644 --- a/packages/core/src/managers/pluginManager/ParallelPluginError.test.ts +++ b/packages/core/src/managers/pluginManager/ParallelPluginError.test.ts @@ -1,8 +1,8 @@ +import { createLogger } from '../../utils/logger.ts' import { ParallelPluginError } from './ParallelPluginError.ts' import { PluginManager } from './PluginManager.ts' import type { KubbConfig } from '../../types.ts' -import { createLogger } from '../../utils/logger.ts' describe('ParallelPluginError', () => { const config: KubbConfig = { diff --git a/packages/core/src/managers/pluginManager/PluginError.test.ts b/packages/core/src/managers/pluginManager/PluginError.test.ts index dd5c8d2df..6babf6b14 100644 --- a/packages/core/src/managers/pluginManager/PluginError.test.ts +++ b/packages/core/src/managers/pluginManager/PluginError.test.ts @@ -1,8 +1,8 @@ +import { createLogger } from '../../utils/logger.ts' import { PluginError } from './PluginError.ts' import { PluginManager } from './PluginManager.ts' import type { KubbConfig } from '../../types.ts' -import { createLogger } from '../../utils/logger.ts' describe('PluginError', () => { const config: KubbConfig = { diff --git a/packages/core/src/managers/pluginManager/PluginManager.test.ts b/packages/core/src/managers/pluginManager/PluginManager.test.ts index 418ef0f7e..ab5231edd 100644 --- a/packages/core/src/managers/pluginManager/PluginManager.test.ts +++ b/packages/core/src/managers/pluginManager/PluginManager.test.ts @@ -1,9 +1,9 @@ /* eslint-disable @typescript-eslint/unbound-method */ import { createPlugin } from '../../plugin.ts' +import { createLogger } from '../../utils/logger.ts' import { hooks, PluginManager } from './PluginManager.ts' import type { KubbConfig, TransformResult } from '../../types.ts' -import { createLogger } from '../../utils/logger.ts' describe('PluginManager', () => { const pluginAMocks = { diff --git a/packages/core/src/managers/pluginManager/PluginManager.ts b/packages/core/src/managers/pluginManager/PluginManager.ts index 4f2aed529..b5f98465f 100644 --- a/packages/core/src/managers/pluginManager/PluginManager.ts +++ b/packages/core/src/managers/pluginManager/PluginManager.ts @@ -1,31 +1,30 @@ /* eslint-disable @typescript-eslint/ban-types, @typescript-eslint/no-unsafe-argument */ import { definePlugin } from '../../plugin.ts' +import { EventEmitter } from '../../utils/EventEmitter.ts' import { isPromise, isPromiseRejectedResult } from '../../utils/isPromise.ts' import { Queue } from '../../utils/Queue.ts' import { FileManager } from '../fileManager/FileManager.ts' import { ParallelPluginError } from './ParallelPluginError.ts' import { PluginError } from './PluginError.ts' - -import { EventEmitter } from '../../utils/EventEmitter.ts' +import { pluginParser } from './pluginParser.ts' import type { CorePluginOptions } from '../../plugin.ts' import type { KubbConfig, KubbPlugin, - PossiblePromise, + OptionalPath, PluginContext, PluginLifecycle, PluginLifecycleHooks, + PossiblePromise, ResolveNameParams, ResolvePathParams, - OptionalPath, } from '../../types.ts' -import type { QueueJob } from '../../utils/Queue.ts' -import type { Argument0, Executer, ParseResult, SafeParseResult, Strategy } from './types.ts' import type { Logger } from '../../utils/logger.ts' +import type { QueueJob } from '../../utils/Queue.ts' import type { ResolvedFile } from '../fileManager/types.ts' -import { pluginParser } from './pluginParser.ts' +import type { Argument0, Executer, ParseResult, SafeParseResult, Strategy } from './types.ts' // inspired by: https://github.com/rollup/rollup/blob/master/src/utils/PluginDriver.ts# diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts index 393ae774e..b0a9acd44 100644 --- a/packages/core/src/types.ts +++ b/packages/core/src/types.ts @@ -1,7 +1,7 @@ -import type { Logger } from './utils/logger.ts' import type { File, FileManager } from './managers/fileManager/index.ts' import type { PluginManager } from './managers/index.ts' import type { Cache } from './utils/cache.ts' +import type { Logger } from './utils/logger.ts' /** * @deprecated diff --git a/packages/core/src/utils/EventEmitter.ts b/packages/core/src/utils/EventEmitter.ts index 06df1fdd7..5f2759845 100644 --- a/packages/core/src/utils/EventEmitter.ts +++ b/packages/core/src/utils/EventEmitter.ts @@ -1,5 +1,6 @@ /* eslint-disable @typescript-eslint/no-unsafe-argument */ import { EventEmitter as NodeEventEmitter } from 'node:events' + export class EventEmitter> { private emitter = new NodeEventEmitter() diff --git a/packages/core/src/utils/importModule.test.ts b/packages/core/src/utils/importModule.test.ts index 290c50e83..bcbcb61ee 100644 --- a/packages/core/src/utils/importModule.test.ts +++ b/packages/core/src/utils/importModule.test.ts @@ -1,6 +1,7 @@ -import { importModule, normalizeDirectory } from './importModule.ts' import path from 'node:path' +import { importModule, normalizeDirectory } from './importModule.ts' + describe('importModule', () => { test('normalizeDirectory', () => { expect(normalizeDirectory('/user/nzakas/foo')).toBe('/user/nzakas/foo/') diff --git a/packages/core/src/utils/importModule.ts b/packages/core/src/utils/importModule.ts index 947e65a49..4792fa4d6 100644 --- a/packages/core/src/utils/importModule.ts +++ b/packages/core/src/utils/importModule.ts @@ -1,7 +1,7 @@ /* eslint-disable @typescript-eslint/no-unsafe-return */ import mod from 'node:module' -import { pathToFileURL } from 'node:url' import os from 'node:os' +import { pathToFileURL } from 'node:url' const SLASHES = new Set(['/', '\\']) diff --git a/packages/core/src/utils/logger.ts b/packages/core/src/utils/logger.ts index 13dba8b95..bfd4a81bc 100644 --- a/packages/core/src/utils/logger.ts +++ b/packages/core/src/utils/logger.ts @@ -1,6 +1,7 @@ -import type { Ora } from 'ora' import pc from 'picocolors' +import type { Ora } from 'ora' + export type LogType = 'error' | 'info' | 'warning' export type Logger = { diff --git a/packages/core/src/utils/randomColour.ts b/packages/core/src/utils/randomColour.ts index c1c7a99b4..b8f5e7c03 100644 --- a/packages/core/src/utils/randomColour.ts +++ b/packages/core/src/utils/randomColour.ts @@ -1,5 +1,6 @@ -import seedrandom from 'seedrandom' import pc from 'picocolors' +import seedrandom from 'seedrandom' + import type { Formatter } from 'picocolors/types' export const defaultColours = ['black', 'blue', 'darkBlue', 'cyan', 'gray', 'green', 'darkGreen', 'magenta', 'red', 'darkRed', 'yellow', 'darkYellow'] as const diff --git a/packages/core/src/utils/read.ts b/packages/core/src/utils/read.ts index eb34d9973..b7dde7144 100644 --- a/packages/core/src/utils/read.ts +++ b/packages/core/src/utils/read.ts @@ -1,6 +1,6 @@ import pathParser from 'node:path' -import fs from 'fs-extra' +import fs from 'fs-extra' import { switcher } from 'js-runtime' function slash(path: string, platform: 'windows' | 'mac' | 'linux' = 'linux') { diff --git a/packages/core/src/utils/write.ts b/packages/core/src/utils/write.ts index 3209884c4..f931c4ebe 100644 --- a/packages/core/src/utils/write.ts +++ b/packages/core/src/utils/write.ts @@ -1,5 +1,6 @@ -import fs from 'fs-extra' import pathParser from 'node:path' + +import fs from 'fs-extra' import { switcher } from 'js-runtime' async function saveCreateDirectory(path: string): Promise { diff --git a/packages/react-template/package.json b/packages/react-template/package.json index 7b9fd7647..ef38085f9 100644 --- a/packages/react-template/package.json +++ b/packages/react-template/package.json @@ -62,9 +62,9 @@ }, "devDependencies": { "@kubb/eslint-config": "workspace:*", + "@kubb/ts-codegen": "workspace:*", "@kubb/ts-config": "workspace:*", "@kubb/tsup-config": "workspace:*", - "@kubb/ts-codegen": "workspace:*", "@types/react": ">=18.2.25", "@types/react-reconciler": "^0.28.5", "eslint": "^8.51.0", diff --git a/packages/react-template/src/ReactTemplate.tsx b/packages/react-template/src/ReactTemplate.tsx index af27331aa..9c647cc6d 100644 --- a/packages/react-template/src/ReactTemplate.tsx +++ b/packages/react-template/src/ReactTemplate.tsx @@ -1,26 +1,26 @@ /* eslint-disable @typescript-eslint/unbound-method */ -import process from 'node:process' import React from 'react' -import type { ReactNode } from 'react' -import type { Export, Import } from '@kubb/core' +import process from 'node:process' + import { throttle } from '@kubb/core' + import autoBind from 'auto-bind' -import type { FiberRoot } from 'react-reconciler' + +import { App } from './components/App.tsx' +import * as dom from './dom.ts' +import { instances } from './instances.ts' import { reconciler } from './reconciler.ts' import { renderer } from './renderer.ts' -import * as dom from './dom.js' -import { instances } from './instances.ts' -import { App } from './components/App.tsx' + +import type { Export, Import } from '@kubb/core' +import type { ReactNode } from 'react' +import type { FiberRoot } from 'react-reconciler' const noop = () => {} export type ReactTemplateOptions = { - stdout: NodeJS.WriteStream - stdin: NodeJS.ReadStream - stderr: NodeJS.WriteStream + id: string debug: boolean - exitOnCtrlC: boolean - waitUntilExit?: () => Promise } export class ReactTemplate { @@ -32,12 +32,6 @@ export class ReactTemplate { private lastExports: Export[] = [] private readonly container: FiberRoot private readonly rootNode: dom.DOMElement - // This variable is used only in debug mode to store full static output - // so that it's rerendered every time, not just new static parts, like in non-debug mode - private fullStaticOutput: string - private exitPromise?: Promise - private restoreConsole?: () => void - private readonly unsubscribeResize?: () => void constructor(options: ReactTemplateOptions) { autoBind(this) @@ -55,10 +49,6 @@ export class ReactTemplate { // Store last output to only rerender when needed this.lastOutput = '' - // This variable is used only in debug mode to store full static output - // so that it's rerendered every time, not just new static parts, like in non-debug mode - this.fullStaticOutput = '' - // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment this.container = reconciler.createContainer( this.rootNode, @@ -78,10 +68,10 @@ export class ReactTemplate { if (process.env['DEV'] === 'true') { reconciler.injectIntoDevTools({ bundleType: 0, - // Reporting React DOM's version, not Ink's + // Reporting React DOM's version, not Kubb's // See https://github.com/facebook/react/issues/16666#issuecomment-532639905 version: '16.13.1', - rendererPackageName: 'ink', + rendererPackageName: '@kubb/react-template', }) } } @@ -96,7 +86,7 @@ export class ReactTemplate { return this.lastExports } - resized = () => { + resized = (): void => { this.onRender() } @@ -111,11 +101,6 @@ export class ReactTemplate { const { output, imports, exports } = renderer(this.rootNode) - if (this.options.debug) { - this.options.stdout.write(this.fullStaticOutput + output) - return - } - this.lastOutput = output this.lastImports = imports this.lastExports = exports @@ -127,33 +112,6 @@ export class ReactTemplate { reconciler.updateContainer(tree, this.container, null, noop) } - writeToStdout(data: string): void { - if (this.isUnmounted) { - return - } - - if (this.options.debug) { - this.options.stdout.write(data + this.fullStaticOutput + this.lastOutput) - return - } - - this.options.stdout.write(data) - } - - writeToStderr(data: string): void { - if (this.isUnmounted) { - return - } - - if (this.options.debug) { - this.options.stderr.write(data) - this.options.stdout.write(this.fullStaticOutput + this.lastOutput) - return - } - - this.options.stderr.write(data) - } - unmount(error?: Error | number | null): void { if (this.isUnmounted) { return @@ -162,18 +120,10 @@ export class ReactTemplate { this.onRender() this.unsubscribeExit() - if (typeof this.restoreConsole === 'function') { - this.restoreConsole() - } - - if (typeof this.unsubscribeResize === 'function') { - this.unsubscribeResize() - } - this.isUnmounted = true reconciler.updateContainer(null, this.container, null, noop) - instances.delete(this.options.stdout) + instances.delete(this.options.id) if (error instanceof Error) { this.rejectExitPromise(error) @@ -182,16 +132,5 @@ export class ReactTemplate { } } - async waitUntilExit(): Promise { - if (!this.exitPromise) { - this.exitPromise = new Promise((resolve, reject) => { - this.resolveExitPromise = resolve - this.rejectExitPromise = reject - }) - } - - return this.exitPromise - } - clear(): void {} } diff --git a/packages/react-template/src/components/App.tsx b/packages/react-template/src/components/App.tsx index d4aca8420..81c8a5015 100644 --- a/packages/react-template/src/components/App.tsx +++ b/packages/react-template/src/components/App.tsx @@ -1,5 +1,6 @@ // eslint-disable-next-line @typescript-eslint/consistent-type-imports import React from 'react' + import type { ReactNode } from 'react' type Props = { diff --git a/packages/react-template/src/components/Export.tsx b/packages/react-template/src/components/Export.tsx index 7f1e528d4..0b1cfcf80 100644 --- a/packages/react-template/src/components/Export.tsx +++ b/packages/react-template/src/components/Export.tsx @@ -1,4 +1,5 @@ import React from 'react' + import type { Export as ExportFileType } from '@kubb/core' type Props = ExportFileType & { diff --git a/packages/react-template/src/components/Function.tsx b/packages/react-template/src/components/Function.tsx index a4ad08a53..c43ad3e8a 100644 --- a/packages/react-template/src/components/Function.tsx +++ b/packages/react-template/src/components/Function.tsx @@ -1,8 +1,11 @@ import React from 'react' -import type { ReactNode } from 'react' -import { Text } from './Text.tsx' + import { createJSDocBlockText } from '@kubb/core' +import { Text } from './Text.tsx' + +import type { ReactNode } from 'react' + type Props = { name: string export?: boolean diff --git a/packages/react-template/src/components/Import.tsx b/packages/react-template/src/components/Import.tsx index b334e2bdd..a23708ca0 100644 --- a/packages/react-template/src/components/Import.tsx +++ b/packages/react-template/src/components/Import.tsx @@ -1,4 +1,5 @@ import React from 'react' + import type { Import as ImportFileType } from '@kubb/core' type Props = ImportFileType & { diff --git a/packages/react-template/src/components/Text.tsx b/packages/react-template/src/components/Text.tsx index 69121156c..fd4b0fc2f 100644 --- a/packages/react-template/src/components/Text.tsx +++ b/packages/react-template/src/components/Text.tsx @@ -1,4 +1,5 @@ import React from 'react' + import type { ReactNode } from 'react' type Props = { diff --git a/packages/react-template/src/instances.ts b/packages/react-template/src/instances.ts index 8c9fcd138..51126f34e 100644 --- a/packages/react-template/src/instances.ts +++ b/packages/react-template/src/instances.ts @@ -1,3 +1,3 @@ import type { ReactTemplate } from './ReactTemplate.ts' -export const instances = new WeakMap() +export const instances = new Map() diff --git a/packages/react-template/src/reconciler.ts b/packages/react-template/src/reconciler.ts index 5a2cb65e4..195f188f8 100644 --- a/packages/react-template/src/reconciler.ts +++ b/packages/react-template/src/reconciler.ts @@ -3,8 +3,9 @@ import createReconciler from 'react-reconciler' import { DefaultEventPriority } from 'react-reconciler/constants.js' -import { createTextNode, appendChildNode, insertBeforeNode, removeChildNode, setTextNodeValue, createNode, setAttribute } from './dom.js' -import type { DOMNodeAttribute, TextNode, DOMElement } from './dom.ts' +import { appendChildNode, createNode, createTextNode, insertBeforeNode, removeChildNode, setAttribute, setTextNodeValue } from './dom.ts' + +import type { DOMElement, DOMNodeAttribute, TextNode } from './dom.ts' import type { ElementNames } from './types.ts' type AnyObject = Record @@ -105,7 +106,7 @@ export const reconciler = createReconciler< return { isInsideText } }, shouldSetTextContent: () => false, - createInstance(originalType, newProps, _root, hostContext) { + createInstance(originalType, newProps, _root) { const node = createNode(originalType) for (const [key, value] of Object.entries(newProps)) { diff --git a/packages/react-template/src/render.ts b/packages/react-template/src/render.ts index 53c124b73..b66ff74aa 100644 --- a/packages/react-template/src/render.ts +++ b/packages/react-template/src/render.ts @@ -1,10 +1,12 @@ /* eslint-disable @typescript-eslint/unbound-method */ -import process from 'node:process' -import type { ReactNode } from 'react' -import type { ReactTemplateOptions } from './ReactTemplate.ts' -import { ReactTemplate } from './ReactTemplate.tsx' +import crypto from 'node:crypto' + import { instances } from './instances.ts' +import { ReactTemplate } from './ReactTemplate.tsx' + import type { Export, Import } from '@kubb/core' +import type { ReactNode } from 'react' +import type { ReactTemplateOptions } from './ReactTemplate.ts' export type RenderOptions = { /** @@ -21,13 +23,9 @@ export type Instance = { */ rerender: ReactTemplate['render'] /** - * Manually unmount the whole Ink app. + * Manually unmount the whole Kubb app. */ unmount: ReactTemplate['unmount'] - /** - * Returns a promise, which resolves when app is unmounted. - */ - waitUntilExit: ReactTemplate['waitUntilExit'] cleanup: () => void /** @@ -44,16 +42,13 @@ export type Instance = { */ export function render(node: ReactNode | JSX.Element, options: RenderOptions = {}): Instance { const reactTemplateOptions: ReactTemplateOptions = { - stdout: process.stdout, - stdin: process.stdin, - stderr: process.stderr, debug: false, - exitOnCtrlC: true, + id: crypto.randomUUID(), ...options, } const instance = new ReactTemplate(reactTemplateOptions) - instances.set(reactTemplateOptions.stdout, instance) + instances.set(reactTemplateOptions.id, instance) instance.render(node) @@ -65,19 +60,7 @@ export function render(node: ReactNode | JSX.Element, options: RenderOptions = { unmount() { instance.unmount() }, - waitUntilExit: instance.waitUntilExit, - cleanup: () => instances.delete(reactTemplateOptions.stdout), + cleanup: () => instances.delete(reactTemplateOptions.id), clear: instance.clear, } } - -const getInstance = (stdout: NodeJS.WriteStream, createInstance: () => ReactTemplate): ReactTemplate => { - let instance = instances.get(stdout) - - if (!instance) { - instance = createInstance() - instances.set(stdout, instance) - } - - return instance -} diff --git a/packages/react-template/src/renderer.ts b/packages/react-template/src/renderer.ts index e4e6b8e6d..0c1f4738e 100644 --- a/packages/react-template/src/renderer.ts +++ b/packages/react-template/src/renderer.ts @@ -1,8 +1,9 @@ -import type { Import, Export } from '@kubb/core' -import type { DOMElement } from './dom.ts' -import { squashTextNodes } from './squashTextNodes.ts' -import { squashImportNodes } from './squashImportNodes.ts' import { squashExportNodes } from './squashExportNodes.ts' +import { squashImportNodes } from './squashImportNodes.ts' +import { squashTextNodes } from './squashTextNodes.ts' + +import type { Export, Import } from '@kubb/core' +import type { DOMElement } from './dom.ts' type Result = { output: string diff --git a/packages/react-template/src/squashExportNodes.ts b/packages/react-template/src/squashExportNodes.ts index 0cf6a6b03..29cb0e6f3 100644 --- a/packages/react-template/src/squashExportNodes.ts +++ b/packages/react-template/src/squashExportNodes.ts @@ -1,7 +1,7 @@ -import type { Export as ExportComponent } from './components/Export.tsx' -import type { DOMElement } from './dom.js' -import type React from 'react' import type { Export } from '@kubb/core' +import type React from 'react' +import type { Export as ExportComponent } from './components/Export.tsx' +import type { DOMElement } from './dom.ts' export function squashExportNodes(node: DOMElement): Export[] { const exports: Export[] = [] diff --git a/packages/react-template/src/squashImportNodes.ts b/packages/react-template/src/squashImportNodes.ts index 1c5c9dd28..b6d303620 100644 --- a/packages/react-template/src/squashImportNodes.ts +++ b/packages/react-template/src/squashImportNodes.ts @@ -1,8 +1,7 @@ import type { Import } from '@kubb/core' - -import type { Import as ImportComponent } from './components/Import.ts' -import type { DOMElement } from './dom.js' import type React from 'react' +import type { Import as ImportComponent } from './components/Import.ts' +import type { DOMElement } from './dom.ts' export function squashImportNodes(node: DOMElement): Import[] { const imports: Import[] = [] diff --git a/packages/react-template/src/squashTextNodes.ts b/packages/react-template/src/squashTextNodes.ts index 2fab2fc40..b4d3ecd1f 100644 --- a/packages/react-template/src/squashTextNodes.ts +++ b/packages/react-template/src/squashTextNodes.ts @@ -1,7 +1,8 @@ -import type { DOMElement } from './dom.js' +import { createExportDeclaration, createImportDeclaration, print } from '@kubb/ts-codegen' + import type { Export as ExportComponent } from './components/Export.tsx' import type { Import as ImportComponent } from './components/Import.ts' -import { createExportDeclaration, createImportDeclaration, print } from '@kubb/ts-codegen' +import type { DOMElement } from './dom.ts' // Squashing text nodes allows to combine multiple text nodes into one and write // to `Output` instance only once. For example, hello{' '}world diff --git a/packages/swagger-client/client.ts b/packages/swagger-client/client.ts index 24b836b38..0812e1cd4 100644 --- a/packages/swagger-client/client.ts +++ b/packages/swagger-client/client.ts @@ -1,6 +1,6 @@ import axios from 'axios' -import type { AxiosError, AxiosHeaders, AxiosResponse, AxiosRequestConfig } from 'axios' +import type { AxiosError, AxiosHeaders, AxiosRequestConfig, AxiosResponse } from 'axios' declare const AXIOS_BASE: string declare const AXIOS_HEADERS: string diff --git a/packages/swagger-client/src/builders/ClientBuilder.tsx b/packages/swagger-client/src/builders/ClientBuilder.tsx index 3c134d424..9970a2ea1 100644 --- a/packages/swagger-client/src/builders/ClientBuilder.tsx +++ b/packages/swagger-client/src/builders/ClientBuilder.tsx @@ -1,12 +1,12 @@ /* eslint- @typescript-eslint/explicit-module-boundary-types */ -import type { Import } from '@kubb/core' -import { combineCodes, createFunctionParams } from '@kubb/core' -import { OasBuilder, getComments, getDataParams } from '@kubb/swagger' +import { combineCodes, createFunctionParams, URLPath } from '@kubb/core' import { Import as ImportTemplate, render } from '@kubb/react-template' +import { getComments, getDataParams, OasBuilder } from '@kubb/swagger' -import { URLPath } from '@kubb/core' -import type { Operation, OperationSchemas } from '@kubb/swagger' import { ClientFunction } from '../components/index.ts' + +import type { Import } from '@kubb/core' +import type { Operation, OperationSchemas } from '@kubb/swagger' import type { Options as PluginOptions } from '../types' type Config = { diff --git a/packages/swagger-client/src/components/ClientFunction.tsx b/packages/swagger-client/src/components/ClientFunction.tsx index 914c842e5..0984280d6 100644 --- a/packages/swagger-client/src/components/ClientFunction.tsx +++ b/packages/swagger-client/src/components/ClientFunction.tsx @@ -1,7 +1,9 @@ import React from 'react' -import type { ReactNode } from 'react' -import { Function, createIndent } from '@kubb/react-template' + +import { createIndent, Function } from '@kubb/react-template' + import type { HttpMethod } from '@kubb/swagger' +import type { ReactNode } from 'react' import type { Options as PluginOptions } from '../types' type Props = { diff --git a/packages/swagger-client/src/generators/OperationGenerator.ts b/packages/swagger-client/src/generators/OperationGenerator.ts index 565524ccd..e59b18074 100644 --- a/packages/swagger-client/src/generators/OperationGenerator.ts +++ b/packages/swagger-client/src/generators/OperationGenerator.ts @@ -2,13 +2,13 @@ import { getRelativePath, URLPath } from '@kubb/core' import { OperationGenerator as Generator } from '@kubb/swagger' import { pluginName as swaggerTypescriptPluginName } from '@kubb/swagger-ts' +import { ClientBuilder } from '../builders/ClientBuilder.tsx' import { pluginName } from '../plugin.ts' import type { File, OptionalPath, PluginContext } from '@kubb/core' import type { ContentType, HttpMethod, Oas, Operation, OperationSchemas, Resolver, SkipBy } from '@kubb/swagger' -import type { ResolvePathOptions, FileMeta } from '../types.ts' -import { ClientBuilder } from '../builders/ClientBuilder.tsx' import type { Options as PluginOptions } from '../types' +import type { FileMeta, ResolvePathOptions } from '../types.ts' type Options = { clientPath?: OptionalPath diff --git a/packages/swagger-client/src/plugin.ts b/packages/swagger-client/src/plugin.ts index b2c8a12be..b37026607 100644 --- a/packages/swagger-client/src/plugin.ts +++ b/packages/swagger-client/src/plugin.ts @@ -1,16 +1,16 @@ import pathParser from 'node:path' -import { createPlugin, getLocation, getPathMode, getRelativePath, read, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getLocation, getPathMode, getRelativePath, read, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' import { camelCase, camelCaseTransformMerge } from 'change-case' import { OperationGenerator } from './generators/OperationGenerator.ts' -import type { OptionalPath, File } from '@kubb/core' +import type { File, OptionalPath } from '@kubb/core' import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' -import type { PluginOptions } from './types.ts' import type { FileMeta } from './types' +import type { PluginOptions } from './types.ts' export const pluginName: PluginOptions['name'] = 'swagger-client' as const diff --git a/packages/swagger-client/src/types.ts b/packages/swagger-client/src/types.ts index 992791098..970605c3c 100644 --- a/packages/swagger-client/src/types.ts +++ b/packages/swagger-client/src/types.ts @@ -1,7 +1,6 @@ -import type { CreateAxiosDefaults } from 'axios' - import type { PluginFactoryOptions } from '@kubb/core' import type { SkipBy } from '@kubb/swagger' +import type { CreateAxiosDefaults } from 'axios' /** * We override `process.env` so no need to import this diff --git a/packages/swagger-faker/src/builders/FakerBuilder.ts b/packages/swagger-faker/src/builders/FakerBuilder.ts index 11acb2128..d0968bc7c 100644 --- a/packages/swagger-faker/src/builders/FakerBuilder.ts +++ b/packages/swagger-faker/src/builders/FakerBuilder.ts @@ -1,12 +1,11 @@ /* eslint-disable @typescript-eslint/explicit-module-boundary-types */ -import { nameSorter } from '@kubb/core' +import { combineCodes, nameSorter } from '@kubb/core' import { ImportsGenerator, OasBuilder } from '@kubb/swagger' import { createImportDeclaration, print } from '@kubb/ts-codegen' import { FakerGenerator } from '../generators/index.ts' import type { PluginContext } from '@kubb/core' -import { combineCodes } from '@kubb/core' import type { FileResolver, ImportMeta, Refs } from '@kubb/swagger' type Generated = { import: { refs: Refs; name: string }; sources: string[]; imports?: ImportMeta[] } diff --git a/packages/swagger-faker/src/generators/FakerGenerator.ts b/packages/swagger-faker/src/generators/FakerGenerator.ts index 4e88b5839..38cc23c6e 100644 --- a/packages/swagger-faker/src/generators/FakerGenerator.ts +++ b/packages/swagger-faker/src/generators/FakerGenerator.ts @@ -2,6 +2,7 @@ import { getUniqueName, SchemaGenerator } from '@kubb/core' import { isReference } from '@kubb/swagger' import { pluginName as swaggerTypeScriptPluginName } from '@kubb/swagger-ts' +import { createJSDocBlockText } from '../../../core/src/utils/jsdoc' import { fakerKeywords, fakerParser } from '../parsers/index.ts' import { pluginName } from '../plugin.ts' @@ -9,7 +10,6 @@ import type { PluginContext } from '@kubb/core' import type { FileResolver, ImportMeta, OpenAPIV3, Refs } from '@kubb/swagger' import type ts from 'typescript' import type { FakerKeyword, FakerMeta } from '../parsers/index.ts' -import { createJSDocBlockText } from '../../../core/src/utils/jsdoc' type Options = { fileResolver?: FileResolver diff --git a/packages/swagger-faker/src/plugin.ts b/packages/swagger-faker/src/plugin.ts index f49b42158..9cb80ae1f 100644 --- a/packages/swagger-faker/src/plugin.ts +++ b/packages/swagger-faker/src/plugin.ts @@ -1,9 +1,7 @@ import pathParser from 'node:path' -import type { File } from '@kubb/core' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' - import { pluginName as swaggerTypeScriptPluginName } from '@kubb/swagger-ts' import { camelCase, camelCaseTransformMerge } from 'change-case' @@ -11,9 +9,8 @@ import { camelCase, camelCaseTransformMerge } from 'change-case' import { FakerBuilder } from './builders/index.ts' import { OperationGenerator } from './generators/index.ts' -import type { OpenAPIV3 } from '@kubb/swagger' -import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' - +import type { File } from '@kubb/core' +import type { OpenAPIV3, PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' import type { FileMeta, PluginOptions } from './types.ts' export const pluginName: PluginOptions['name'] = 'swagger-faker' as const diff --git a/packages/swagger-msw/src/builders/MSWBuilder.ts b/packages/swagger-msw/src/builders/MSWBuilder.ts index 430ce09fd..2a9accde4 100644 --- a/packages/swagger-msw/src/builders/MSWBuilder.ts +++ b/packages/swagger-msw/src/builders/MSWBuilder.ts @@ -1,10 +1,11 @@ /* eslint-disable @typescript-eslint/explicit-module-boundary-types */ +import { combineCodes } from '@kubb/core' import { OasBuilder } from '@kubb/swagger' -import { combineCodes } from '@kubb/core' +import { URLPath } from '../../../core/src/utils/URLPath' + import type { PluginContext } from '@kubb/core' import type { Operation } from '@kubb/swagger' -import { URLPath } from '../../../core/src/utils/URLPath' type Config = { operation: Operation diff --git a/packages/swagger-msw/src/plugin.ts b/packages/swagger-msw/src/plugin.ts index 58308aab4..7274eec40 100644 --- a/packages/swagger-msw/src/plugin.ts +++ b/packages/swagger-msw/src/plugin.ts @@ -1,18 +1,17 @@ import pathParser from 'node:path' -import type { File } from '@kubb/core' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' - -import { pluginName as swaggerTypeScriptPluginName } from '@kubb/swagger-ts' import { pluginName as swaggerFakerPluginName } from '@kubb/swagger-faker' +import { pluginName as swaggerTypeScriptPluginName } from '@kubb/swagger-ts' import { camelCase, camelCaseTransformMerge } from 'change-case' import { OperationGenerator } from './generators/index.ts' -import type { FileMeta, PluginOptions } from './types.ts' +import type { File } from '@kubb/core' import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' +import type { FileMeta, PluginOptions } from './types.ts' export const pluginName: PluginOptions['name'] = 'swagger-msw' as const diff --git a/packages/swagger-swr/src/builders/QueryBuilder.ts b/packages/swagger-swr/src/builders/QueryBuilder.ts index 94c6f8450..df812d096 100644 --- a/packages/swagger-swr/src/builders/QueryBuilder.ts +++ b/packages/swagger-swr/src/builders/QueryBuilder.ts @@ -1,11 +1,10 @@ /* eslint- @typescript-eslint/explicit-module-boundary-types */ -import { createFunctionParams, createJSDocBlockText } from '@kubb/core' -import type { Resolver } from '@kubb/swagger' -import { OasBuilder, getComments, getDataParams } from '@kubb/swagger' +import { combineCodes, createFunctionParams, createJSDocBlockText, URLPath } from '@kubb/core' +import { getComments, getDataParams, OasBuilder } from '@kubb/swagger' -import { URLPath, combineCodes } from '@kubb/core' -import type { Operation, OperationSchemas } from '@kubb/swagger' import { camelCase } from 'change-case' + +import type { Operation, OperationSchemas, Resolver } from '@kubb/swagger' import type { Options as PluginOptions } from '../types' type Config = { diff --git a/packages/swagger-swr/src/generators/OperationGenerator.ts b/packages/swagger-swr/src/generators/OperationGenerator.ts index 32ffbfdc0..7040a8584 100644 --- a/packages/swagger-swr/src/generators/OperationGenerator.ts +++ b/packages/swagger-swr/src/generators/OperationGenerator.ts @@ -2,14 +2,13 @@ import { getRelativePath } from '@kubb/core' import { OperationGenerator as Generator } from '@kubb/swagger' import { pluginName as swaggerTypescriptPluginName } from '@kubb/swagger-ts' +import { QueryBuilder } from '../builders/QueryBuilder.ts' import { pluginName } from '../plugin.ts' import type { File, OptionalPath, PluginContext } from '@kubb/core' import type { ContentType, Oas, Operation, OperationSchemas, Resolver, SkipBy } from '@kubb/swagger' -import type { ResolvePathOptions } from '../types.ts' -import { QueryBuilder } from '../builders/QueryBuilder.ts' -import type { FileMeta } from '../types.ts' import type { Options as PluginOptions } from '../types' +import type { FileMeta, ResolvePathOptions } from '../types.ts' type Options = { clientPath?: OptionalPath diff --git a/packages/swagger-swr/src/plugin.ts b/packages/swagger-swr/src/plugin.ts index 5571a0622..e235884b0 100644 --- a/packages/swagger-swr/src/plugin.ts +++ b/packages/swagger-swr/src/plugin.ts @@ -1,16 +1,15 @@ import pathParser from 'node:path' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' import { camelCase, camelCaseTransformMerge } from 'change-case' import { OperationGenerator } from './generators/index.ts' -import type { OptionalPath, File } from '@kubb/core' -import type { PluginOptions } from './types.ts' -import type { FileMeta } from './types.ts' +import type { File, OptionalPath } from '@kubb/core' import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' +import type { FileMeta, PluginOptions } from './types.ts' export const pluginName: PluginOptions['name'] = 'swagger-swr' as const diff --git a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts index aae302067..83718b278 100644 --- a/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts +++ b/packages/swagger-tanstack-query/src/builders/QueryBuilder.ts @@ -1,16 +1,13 @@ /* eslint- @typescript-eslint/explicit-module-boundary-types */ -import type { Import } from '@kubb/core' -import { createJSDocBlockText } from '@kubb/core' -import type { Resolver } from '@kubb/swagger' -import { OasBuilder, getComments, getDataParams } from '@kubb/swagger' +import { combineCodes, createFunctionParams, createJSDocBlockText, URLPath } from '@kubb/core' +import { getComments, getDataParams, getParams, OasBuilder } from '@kubb/swagger' -import { URLPath, combineCodes } from '@kubb/core' -import type { Operation, OperationSchemas } from '@kubb/swagger' -import { getParams } from '@kubb/swagger' import { camelCase, pascalCase } from 'change-case' -import type { Framework, FrameworkImports } from '../types.ts' -import { createFunctionParams } from '@kubb/core' + +import type { Import } from '@kubb/core' +import type { Operation, OperationSchemas, Resolver } from '@kubb/swagger' import type { Options as PluginOptions } from '../types' +import type { Framework, FrameworkImports } from '../types.ts' type BaseConfig = { dataReturnType: PluginOptions['dataReturnType'] diff --git a/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts b/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts index 1f014ef0d..d33a2ebd7 100644 --- a/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts +++ b/packages/swagger-tanstack-query/src/generators/OperationGenerator.ts @@ -2,13 +2,13 @@ import { getRelativePath } from '@kubb/core' import { OperationGenerator as Generator } from '@kubb/swagger' import { pluginName as swaggerTypescriptPluginName } from '@kubb/swagger-ts' -import type { File, OptionalPath, PluginContext } from '@kubb/core' -import type { ContentType, Oas, Operation, OperationSchemas, Resolver, SkipBy } from '@kubb/swagger' -import type { ResolvePathOptions, Framework, FrameworkImports } from '../types.ts' import { QueryBuilder } from '../builders/QueryBuilder.ts' -import type { FileMeta } from '../types.ts' import { pluginName } from '../plugin.ts' + +import type { File, OptionalPath, PluginContext } from '@kubb/core' +import type { ContentType, Oas, Operation, OperationSchemas, Resolver, SkipBy } from '@kubb/swagger' import type { Options as PluginOptions } from '../types' +import type { FileMeta, Framework, FrameworkImports, ResolvePathOptions } from '../types.ts' type Options = { framework: Framework diff --git a/packages/swagger-tanstack-query/src/plugin.ts b/packages/swagger-tanstack-query/src/plugin.ts index 65217f9c6..7a041390a 100644 --- a/packages/swagger-tanstack-query/src/plugin.ts +++ b/packages/swagger-tanstack-query/src/plugin.ts @@ -1,6 +1,6 @@ import pathParser from 'node:path' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' import { camelCase, camelCaseTransformMerge } from 'change-case' @@ -8,8 +8,8 @@ import { camelCase, camelCaseTransformMerge } from 'change-case' import { OperationGenerator } from './generators/index.ts' import type { File, OptionalPath } from '@kubb/core' -import type { FileMeta, PluginOptions } from './types.ts' import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' +import type { FileMeta, PluginOptions } from './types.ts' export const pluginName: PluginOptions['name'] = 'swagger-tanstack-query' as const diff --git a/packages/swagger-ts/src/builders/TypeBuilder.ts b/packages/swagger-ts/src/builders/TypeBuilder.ts index 3da52ef6b..1abc3e232 100644 --- a/packages/swagger-ts/src/builders/TypeBuilder.ts +++ b/packages/swagger-ts/src/builders/TypeBuilder.ts @@ -1,12 +1,11 @@ /* eslint-disable @typescript-eslint/explicit-module-boundary-types */ -import { nameSorter } from '@kubb/core' +import { combineCodes, nameSorter } from '@kubb/core' import { ImportsGenerator, OasBuilder } from '@kubb/swagger' import { createImportDeclaration, print } from '@kubb/ts-codegen' import { TypeGenerator } from '../generators/TypeGenerator.ts' import type { PluginContext } from '@kubb/core' -import { combineCodes } from '@kubb/core' import type { FileResolver, Refs } from '@kubb/swagger' import type ts from 'typescript' diff --git a/packages/swagger-ts/src/generators/TypeGenerator.ts b/packages/swagger-ts/src/generators/TypeGenerator.ts index 0ad23d71c..28af6b368 100644 --- a/packages/swagger-ts/src/generators/TypeGenerator.ts +++ b/packages/swagger-ts/src/generators/TypeGenerator.ts @@ -13,7 +13,6 @@ import { } from '@kubb/ts-codegen' import { camelCase } from 'change-case' -import type { Options as CaseOptions } from 'change-case' import ts from 'typescript' import { pluginName } from '../plugin.ts' @@ -22,6 +21,7 @@ import { keywordTypeNodes } from '../utils/index.ts' import type { PluginContext } from '@kubb/core' import type { OpenAPIV3, Refs } from '@kubb/swagger' import type { ArrayTwoOrMore } from '@kubb/ts-codegen' +import type { Options as CaseOptions } from 'change-case' const { factory } = ts diff --git a/packages/swagger-ts/src/plugin.ts b/packages/swagger-ts/src/plugin.ts index 9cb9ecb89..278b259c8 100644 --- a/packages/swagger-ts/src/plugin.ts +++ b/packages/swagger-ts/src/plugin.ts @@ -1,16 +1,15 @@ import pathParser from 'node:path' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes, timeout } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate, timeout } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' -import { pascalCase, pascalCaseTransformMerge, camelCase, camelCaseTransformMerge } from 'change-case' +import { camelCase, camelCaseTransformMerge, pascalCase, pascalCaseTransformMerge } from 'change-case' import { TypeBuilder } from './builders/index.ts' import { OperationGenerator } from './generators/index.ts' -import type { OpenAPIV3 } from '@kubb/swagger' +import type { OpenAPIV3, PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' import type { PluginOptions } from './types.ts' -import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' export const pluginName: PluginOptions['name'] = 'swagger-ts' as const diff --git a/packages/swagger-zod/src/builders/ZodBuilder.ts b/packages/swagger-zod/src/builders/ZodBuilder.ts index 7467a5310..587a32c04 100644 --- a/packages/swagger-zod/src/builders/ZodBuilder.ts +++ b/packages/swagger-zod/src/builders/ZodBuilder.ts @@ -1,11 +1,10 @@ -import { nameSorter } from '@kubb/core' +import { combineCodes, nameSorter } from '@kubb/core' import { ImportsGenerator, OasBuilder } from '@kubb/swagger' import { createImportDeclaration, print } from '@kubb/ts-codegen' import { ZodGenerator } from '../generators/index.ts' import type { PluginContext } from '@kubb/core' -import { combineCodes } from '@kubb/core' import type { FileResolver, Refs } from '@kubb/swagger' type Generated = { import: { refs: Refs; name: string }; sources: string[] } diff --git a/packages/swagger-zod/src/generators/ZodGenerator.ts b/packages/swagger-zod/src/generators/ZodGenerator.ts index 4990ff1bc..f4259d113 100644 --- a/packages/swagger-zod/src/generators/ZodGenerator.ts +++ b/packages/swagger-zod/src/generators/ZodGenerator.ts @@ -1,4 +1,4 @@ -import { getUniqueName, SchemaGenerator, jsStringEscape } from '@kubb/core' +import { getUniqueName, jsStringEscape, SchemaGenerator } from '@kubb/core' import { isReference } from '@kubb/swagger' import { zodKeywords, zodParser } from '../parsers/index.ts' diff --git a/packages/swagger-zod/src/plugin.ts b/packages/swagger-zod/src/plugin.ts index f371a785a..b0380b6ca 100644 --- a/packages/swagger-zod/src/plugin.ts +++ b/packages/swagger-zod/src/plugin.ts @@ -1,7 +1,6 @@ import pathParser from 'node:path' -import type { File } from '@kubb/core' -import { createPlugin, getPathMode, getRelativePath, renderTemplate, getDependedPlugins, getIndexes } from '@kubb/core' +import { createPlugin, getDependedPlugins, getIndexes, getPathMode, getRelativePath, renderTemplate } from '@kubb/core' import { pluginName as swaggerPluginName } from '@kubb/swagger' import { camelCase, camelCaseTransformMerge } from 'change-case' @@ -9,9 +8,9 @@ import { camelCase, camelCaseTransformMerge } from 'change-case' import { ZodBuilder } from './builders/index.ts' import { OperationGenerator } from './generators/index.ts' -import type { OpenAPIV3 } from '@kubb/swagger' +import type { File } from '@kubb/core' +import type { OpenAPIV3, PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' import type { FileMeta, PluginOptions } from './types.ts' -import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' export const pluginName: PluginOptions['name'] = 'swagger-zod' as const diff --git a/packages/swagger-zodios/src/plugin.ts b/packages/swagger-zodios/src/plugin.ts index fa6ba5e68..45460c733 100644 --- a/packages/swagger-zodios/src/plugin.ts +++ b/packages/swagger-zodios/src/plugin.ts @@ -8,9 +8,9 @@ import { camelCase, camelCaseTransformMerge } from 'change-case' import { OperationGenerator } from './generators/index.ts' +import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' import type { PluginOptions as SwaggerZodPluginOptions } from '@kubb/swagger-zod' import type { PluginOptions } from './types.ts' -import type { PluginOptions as SwaggerPluginOptions } from '@kubb/swagger' export const pluginName: PluginOptions['name'] = 'swagger-zodios' as const diff --git a/packages/swagger/src/generators/OperationGenerator.ts b/packages/swagger/src/generators/OperationGenerator.ts index b7d7d5ad4..16a229674 100644 --- a/packages/swagger/src/generators/OperationGenerator.ts +++ b/packages/swagger/src/generators/OperationGenerator.ts @@ -1,7 +1,8 @@ /* eslint-disable @typescript-eslint/unbound-method */ -import { combineFiles, Generator } from '@kubb/core' +import { combineFiles, Generator, Warning } from '@kubb/core' import { pascalCase, pascalCaseTransformMerge } from 'change-case' +import { utils } from 'oas' import { isReference } from '../utils/isReference.ts' @@ -10,9 +11,6 @@ import type { Operation } from 'oas' import type { HttpMethods as HttpMethod, MediaTypeObject, RequestBodyObject } from 'oas/dist/rmoas.types.ts' import type { OpenAPIV3 } from 'openapi-types' import type { ContentType, Oas, OperationSchemas, Resolver, SkipBy } from '../types.ts' -import { Warning } from '@kubb/core' - -import { utils } from 'oas' const { findSchemaDefinition } = utils diff --git a/packages/swagger/src/parsers/oasParser.ts b/packages/swagger/src/parsers/oasParser.ts index 6b2cc0655..0de8d77d4 100644 --- a/packages/swagger/src/parsers/oasParser.ts +++ b/packages/swagger/src/parsers/oasParser.ts @@ -3,6 +3,8 @@ import pathParser from 'node:path' import { URLPath } from '@kubb/core' import SwaggerParser from '@apidevtools/swagger-parser' +import Oas from 'oas' +import OASNormalize from 'oas-normalize' import swagger2openapi from 'swagger2openapi' import { isOpenApiV3Document } from '../utils/index.ts' @@ -12,9 +14,6 @@ import type oas from 'oas' import type { OASDocument } from 'oas/dist/rmoas.types.ts' import type { OpenAPIV2 } from 'openapi-types' -import Oas from 'oas' -import OASNormalize from 'oas-normalize' - export type OasOptions = { validate?: boolean } diff --git a/packages/swagger/src/plugin.ts b/packages/swagger/src/plugin.ts index 8ae130814..9d05bb9de 100644 --- a/packages/swagger/src/plugin.ts +++ b/packages/swagger/src/plugin.ts @@ -1,13 +1,13 @@ import pathParser from 'node:path' -import type { KubbConfig, Logger } from '@kubb/core' import { createPlugin } from '@kubb/core' import { oasParser } from './parsers/oasParser.ts' +import { getSchemas } from './utils/getSchemas.ts' +import type { KubbConfig, Logger } from '@kubb/core' import type { OpenAPIV3 } from 'openapi-types' import type { Oas, PluginOptions } from './types.ts' -import { getSchemas } from './utils/getSchemas.ts' export const pluginName: PluginOptions['name'] = 'swagger' as const diff --git a/packages/swagger/src/types.ts b/packages/swagger/src/types.ts index 600815940..8621706e5 100644 --- a/packages/swagger/src/types.ts +++ b/packages/swagger/src/types.ts @@ -1,8 +1,8 @@ import type { Path, PluginFactoryOptions } from '@kubb/core' -import type { GetSchemasProps } from './utils/getSchemas' import type Oas from 'oas' -import type { OpenAPIV3 } from 'openapi-types' import type { HttpMethods as HttpMethod } from 'oas/dist/rmoas.types.ts' +import type { OpenAPIV3 } from 'openapi-types' +import type { GetSchemasProps } from './utils/getSchemas' // eslint-disable-next-line @typescript-eslint/ban-types export type ContentType = 'application/json' | (string & {}) diff --git a/packages/swagger/src/utils/getParams.ts b/packages/swagger/src/utils/getParams.ts index 8df07fe7d..56ccc4563 100644 --- a/packages/swagger/src/utils/getParams.ts +++ b/packages/swagger/src/utils/getParams.ts @@ -1,8 +1,9 @@ import { createFunctionParams } from '@kubb/core' -import type { OperationSchema } from '../types.ts' import { isParameterObject } from './isParameterObject' +import type { OperationSchema } from '../types.ts' + type FunctionParamsAst = Parameters[0][number] export function getDataParams( diff --git a/packages/ts-codegen/src/codegen.ts b/packages/ts-codegen/src/codegen.ts index c480a9179..d064cb762 100644 --- a/packages/ts-codegen/src/codegen.ts +++ b/packages/ts-codegen/src/codegen.ts @@ -311,7 +311,7 @@ export function createEnumDeclaration({ * Enum name in PascalCase. */ typeName: string - enums: [key: string, value: string | number | boolean][] + enums: [key: string | number, value: string | number | boolean][] }) { if (type === 'enum') { return [ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index fe35470d9..9ebfdee78 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -34,9 +34,6 @@ importers: prettier-eslint: specifier: ^15.0.1 version: 15.0.1 - prettier-plugin-curly: - specifier: ^0.1.3 - version: 0.1.3(prettier@3.0.3) ts-node: specifier: ^10.9.1 version: 10.9.1(@swc/core@1.3.82)(@types/node@20.8.3)(typescript@5.2.2) @@ -120,8 +117,8 @@ importers: specifier: ^4.36.1 version: 4.36.1(svelte@3.59.2) '@tanstack/vue-query': - specifier: ^4.36.1 - version: 4.36.1(vue@3.3.4) + specifier: ^4.36.2 + version: 4.36.2(vue@3.3.4) '@zodios/core': specifier: ^10.9.6 version: 10.9.6(axios@1.5.1)(zod@3.22.4) @@ -211,8 +208,8 @@ importers: specifier: ^4.36.1 version: 4.36.1(svelte@3.59.2) '@tanstack/vue-query': - specifier: ^4.36.1 - version: 4.36.1(vue@3.3.4) + specifier: ^4.36.2 + version: 4.36.2(vue@3.3.4) '@zodios/core': specifier: ^10.9.6 version: 10.9.6(axios@1.5.1)(zod@3.22.4) @@ -621,8 +618,8 @@ importers: specifier: workspace:* version: link:../../packages/swagger-zod '@tanstack/vue-query': - specifier: ^4.36.1 - version: 4.36.1(vue@3.3.4) + specifier: ^4.36.2 + version: 4.36.2(vue@3.3.4) axios: specifier: ^1.5.1 version: 1.5.1 @@ -2668,8 +2665,8 @@ packages: svelte: 3.59.2 dev: false - /@tanstack/vue-query@4.36.1(vue@3.3.4): - resolution: {integrity: sha512-+dS/+Xb5OL0bdy8iurT2U4oX9R5T+eUJCK3JHIn6JAQKcVk+Zp09uVzF/dwy1Xe/8Xhy593vcr+wWc9fMrsAPQ==} + /@tanstack/vue-query@4.36.2(vue@3.3.4): + resolution: {integrity: sha512-zZjP1q7Fe+tmvZeJeQ9v56VQ4VgyafdjjCRaYxLNHDBlXB+fpqP4kWhUfTKQEDHSAyzrtX8Bk789jg/yUPyIKQ==} peerDependencies: '@vue/composition-api': ^1.1.2 vue: ^2.5.0 || ^3.0.0 @@ -6561,19 +6558,6 @@ packages: - supports-color dev: true - /prettier-plugin-curly@0.1.3(prettier@3.0.3): - resolution: {integrity: sha512-NYr2BPex/0fFwDbiZZr91kfgBko1tmaorLOrVAkT5rN91mIYYJRiWabRxWGFqzRSO7J0eoEcxakY9NWvJWAh4w==} - engines: {node: '>=18'} - peerDependencies: - prettier: ^2 || ^3 - dependencies: - '@babel/parser': 7.22.7 - '@babel/traverse': 7.22.8 - prettier: 3.0.3 - transitivePeerDependencies: - - supports-color - dev: true - /prettier@2.8.8: resolution: {integrity: sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==} engines: {node: '>=10.13.0'} diff --git a/prettier.config.cjs b/prettier.config.cjs index b3231b1c5..662fcd978 100644 --- a/prettier.config.cjs +++ b/prettier.config.cjs @@ -19,10 +19,10 @@ const config = { semi: false, bracketSameLine: false, endOfLine: 'auto', - plugins: ['@ianvs/prettier-plugin-sort-imports', 'prettier-plugin-curly'], + plugins: ['@ianvs/prettier-plugin-sort-imports'], // `@ianvs/prettier-plugin-sort-imports` plugin's options importOrderParserPlugins: ['typescript', 'jsx', 'decorators-legacy'], - importOrderTypeScriptVersion: '5.1.3', + importOrderTypeScriptVersion: '5.0.0', importOrder: [ '^(react/(.*)$)|^(react$)', '', // Node.js built-in modules From 1c77dc5c9d5cc9140b4b6eec28e906bfb1122680 Mon Sep 17 00:00:00 2001 From: Stijn Van Hulle Date: Mon, 9 Oct 2023 13:50:51 +0200 Subject: [PATCH 9/9] chore: releaes please update --- release-please-config.json | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/release-please-config.json b/release-please-config.json index f32d009b2..e5ad4b650 100644 --- a/release-please-config.json +++ b/release-please-config.json @@ -15,6 +15,15 @@ { "type": "ci", "section": "Continuous Integration", "hidden": true } ], "packages": { + ".": { + "changelog-path": "CHANGELOG.md", + "release-type": "node", + "bump-minor-pre-major": false, + "bump-patch-for-minor-pre-major": false, + "draft": false, + "prerelease": false, + "skip-github-release": true + }, "packages/kubb": { "component": "kubb", "changelog-path": "CHANGELOG.md",