@kubb/plugin-react-query 0.0.0-canary-20241104172400

package/src/generators/__snapshots__/findByTagsWithCustomQueryKey.ts

@@ -0,0 +1,51 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { QueryKey, QueryObserverOptions, UseQueryResult } from "@tanstack/react-query";
+import { queryOptions, useQuery } from "@tanstack/react-query";
+
+ export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => ["test", { url: "/pet/findByTags" }, ...(params ? [params] : [])] as const;
+
+ export type FindPetsByTagsQueryKey = ReturnType<typeof findPetsByTagsQueryKey>;
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+async function findPetsByTags(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const res = await client<FindPetsByTagsQueryResponse, FindPetsByTags400, unknown>({ method: "GET", url: `/pet/findByTags`, params, headers: { ...headers, ...config.headers }, ...config });
+    return findPetsByTagsQueryResponse.parse(res.data);
+}
+
+ export function findPetsByTagsQueryOptions(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const queryKey = findPetsByTagsQueryKey(params);
+    return queryOptions({
+        queryKey,
+        queryFn: async ({ signal }) => {
+            config.signal = signal;
+            return findPetsByTags(headers, params, config);
+        },
+    });
+}
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+export function useFindPetsByTags<TData = FindPetsByTagsQueryResponse, TQueryData = FindPetsByTagsQueryResponse, TQueryKey extends QueryKey = FindPetsByTagsQueryKey>(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, options: {
+    query?: Partial<QueryObserverOptions<FindPetsByTagsQueryResponse, FindPetsByTags400, TData, TQueryData, TQueryKey>>;
+    client?: Partial<RequestConfig>;
+} = {}) {
+    const { query: queryOptions, client: config = {} } = options ?? {};
+    const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params);
+    const query = useQuery({
+        ...findPetsByTagsQueryOptions(headers, params, config) as unknown as QueryObserverOptions,
+        queryKey,
+        ...queryOptions as unknown as Omit<QueryObserverOptions, "queryKey">
+    }) as UseQueryResult<TData, FindPetsByTags400> & {
+        queryKey: TQueryKey;
+    };
+    query.queryKey = queryKey as TQueryKey;
+    return query;
+}

package/src/generators/__snapshots__/findByTagsWithZod.ts

@@ -0,0 +1,51 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { QueryKey, QueryObserverOptions, UseQueryResult } from "@tanstack/react-query";
+import { queryOptions, useQuery } from "@tanstack/react-query";
+
+ export const findPetsByTagsQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: "/pet/findByTags" }, ...(params ? [params] : [])] as const;
+
+ export type FindPetsByTagsQueryKey = ReturnType<typeof findPetsByTagsQueryKey>;
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+async function findPetsByTags(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const res = await client<FindPetsByTagsQueryResponse, FindPetsByTags400, unknown>({ method: "GET", url: `/pet/findByTags`, params, headers: { ...headers, ...config.headers }, ...config });
+    return findPetsByTagsQueryResponse.parse(res.data);
+}
+
+ export function findPetsByTagsQueryOptions(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const queryKey = findPetsByTagsQueryKey(params);
+    return queryOptions({
+        queryKey,
+        queryFn: async ({ signal }) => {
+            config.signal = signal;
+            return findPetsByTags(headers, params, config);
+        },
+    });
+}
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+export function useFindPetsByTags<TData = FindPetsByTagsQueryResponse, TQueryData = FindPetsByTagsQueryResponse, TQueryKey extends QueryKey = FindPetsByTagsQueryKey>(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, options: {
+    query?: Partial<QueryObserverOptions<FindPetsByTagsQueryResponse, FindPetsByTags400, TData, TQueryData, TQueryKey>>;
+    client?: Partial<RequestConfig>;
+} = {}) {
+    const { query: queryOptions, client: config = {} } = options ?? {};
+    const queryKey = queryOptions?.queryKey ?? findPetsByTagsQueryKey(params);
+    const query = useQuery({
+        ...findPetsByTagsQueryOptions(headers, params, config) as unknown as QueryObserverOptions,
+        queryKey,
+        ...queryOptions as unknown as Omit<QueryObserverOptions, "queryKey">
+    }) as UseQueryResult<TData, FindPetsByTags400> & {
+        queryKey: TQueryKey;
+    };
+    query.queryKey = queryKey as TQueryKey;
+    return query;
+}

package/src/generators/__snapshots__/findInfiniteByTags.ts

@@ -0,0 +1,57 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { QueryKey, InfiniteQueryObserverOptions, UseInfiniteQueryResult } from "@tanstack/react-query";
+import { infiniteQueryOptions, useInfiniteQuery } from "@tanstack/react-query";
+
+ export const findPetsByTagsInfiniteQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: "/pet/findByTags" }, ...(params ? [params] : [])] as const;
+
+ export type FindPetsByTagsInfiniteQueryKey = ReturnType<typeof findPetsByTagsInfiniteQueryKey>;
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+async function findPetsByTags(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const res = await client<FindPetsByTagsQueryResponse, FindPetsByTags400, unknown>({ method: "GET", url: `/pet/findByTags`, params, headers: { ...headers, ...config.headers }, ...config });
+    return findPetsByTagsQueryResponse.parse(res.data);
+}
+
+ export function findPetsByTagsInfiniteQueryOptions(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const queryKey = findPetsByTagsInfiniteQueryKey(params);
+    return infiniteQueryOptions({
+        queryKey,
+        queryFn: async ({ signal, pageParam }) => {
+            config.signal = signal;
+            if (params) {
+                params["pageSize"] = pageParam as unknown as FindPetsByTagsQueryParams["pageSize"];
+            }
+            return findPetsByTags(headers, params, config);
+        },
+        initialPageParam: 0,
+        getNextPageParam: (lastPage, _allPages, lastPageParam) => Array.isArray(lastPage) && lastPage.length === 0 ? undefined : lastPageParam + 1,
+        getPreviousPageParam: (_firstPage, _allPages, firstPageParam) => firstPageParam <= 1 ? undefined : firstPageParam - 1
+    });
+}
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+export function useFindPetsByTagsInfinite<TData = FindPetsByTagsQueryResponse, TQueryData = FindPetsByTagsQueryResponse, TQueryKey extends QueryKey = FindPetsByTagsInfiniteQueryKey>(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, options: {
+    query?: Partial<InfiniteQueryObserverOptions<FindPetsByTagsQueryResponse, FindPetsByTags400, TData, TQueryData, TQueryKey>>;
+    client?: Partial<RequestConfig>;
+} = {}) {
+    const { query: queryOptions, client: config = {} } = options ?? {};
+    const queryKey = queryOptions?.queryKey ?? findPetsByTagsInfiniteQueryKey(params);
+    const query = useInfiniteQuery({
+        ...findPetsByTagsInfiniteQueryOptions(headers, params, config) as unknown as InfiniteQueryObserverOptions,
+        queryKey,
+        ...queryOptions as unknown as Omit<InfiniteQueryObserverOptions, "queryKey">
+    }) as UseInfiniteQueryResult<TData, FindPetsByTags400> & {
+        queryKey: TQueryKey;
+    };
+    query.queryKey = queryKey as TQueryKey;
+    return query;
+}

package/src/generators/__snapshots__/findInfiniteByTagsCursor.ts

@@ -0,0 +1,57 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { QueryKey, InfiniteQueryObserverOptions, UseInfiniteQueryResult } from "@tanstack/react-query";
+import { infiniteQueryOptions, useInfiniteQuery } from "@tanstack/react-query";
+
+ export const findPetsByTagsInfiniteQueryKey = (params?: FindPetsByTagsQueryParams) => [{ url: "/pet/findByTags" }, ...(params ? [params] : [])] as const;
+
+ export type FindPetsByTagsInfiniteQueryKey = ReturnType<typeof findPetsByTagsInfiniteQueryKey>;
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+async function findPetsByTags(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const res = await client<FindPetsByTagsQueryResponse, FindPetsByTags400, unknown>({ method: "GET", url: `/pet/findByTags`, params, headers: { ...headers, ...config.headers }, ...config });
+    return findPetsByTagsQueryResponse.parse(res.data);
+}
+
+ export function findPetsByTagsInfiniteQueryOptions(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, config: Partial<RequestConfig> = {}) {
+    const queryKey = findPetsByTagsInfiniteQueryKey(params);
+    return infiniteQueryOptions({
+        queryKey,
+        queryFn: async ({ signal, pageParam }) => {
+            config.signal = signal;
+            if (params) {
+                params["pageSize"] = pageParam as unknown as FindPetsByTagsQueryParams["pageSize"];
+            }
+            return findPetsByTags(headers, params, config);
+        },
+        initialPageParam: 0,
+        getNextPageParam: (lastPage) => lastPage["cursor"],
+        getPreviousPageParam: (firstPage) => firstPage["cursor"]
+    });
+}
+
+ /**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+export function useFindPetsByTagsInfinite<TData = FindPetsByTagsQueryResponse, TQueryData = FindPetsByTagsQueryResponse, TQueryKey extends QueryKey = FindPetsByTagsInfiniteQueryKey>(headers: FindPetsByTagsHeaderParams, params?: FindPetsByTagsQueryParams, options: {
+    query?: Partial<InfiniteQueryObserverOptions<FindPetsByTagsQueryResponse, FindPetsByTags400, TData, TQueryData, TQueryKey>>;
+    client?: Partial<RequestConfig>;
+} = {}) {
+    const { query: queryOptions, client: config = {} } = options ?? {};
+    const queryKey = queryOptions?.queryKey ?? findPetsByTagsInfiniteQueryKey(params);
+    const query = useInfiniteQuery({
+        ...findPetsByTagsInfiniteQueryOptions(headers, params, config) as unknown as InfiniteQueryObserverOptions,
+        queryKey,
+        ...queryOptions as unknown as Omit<InfiniteQueryObserverOptions, "queryKey">
+    }) as UseInfiniteQueryResult<TData, FindPetsByTags400> & {
+        queryKey: TQueryKey;
+    };
+    query.queryKey = queryKey as TQueryKey;
+    return query;
+}

package/src/generators/__snapshots__/getAsMutation.ts

@@ -0,0 +1,31 @@
+import client from '@kubb/plugin-client/client'
+import type { RequestConfig } from '@kubb/plugin-client/client'
+import type { UseMutationOptions } from 'custom-swr/mutation'
+import { useMutation } from 'custom-swr/mutation'
+
+/**
+ * @description Multiple tags can be provided with comma separated strings. Use tag1, tag2, tag3 for testing.
+ * @summary Finds Pets by tags
+ * @link /pet/findByTags
+ */
+export function findPetsByTags(
+  options: {
+    mutation?: UseMutationOptions<
+      FindPetsByTagsQueryResponse,
+      FindPetsByTags400,
+      {
+        headers: FindPetsByTagsHeaderParams
+        params?: FindPetsByTagsQueryParams
+      }
+    >
+    client?: Partial<RequestConfig>
+  } = {},
+) {
+  const { mutation: mutationOptions, client: config = {} } = options ?? {}
+  return useMutation({
+    mutationFn: async ({ headers, params }: { headers: FindPetsByTagsHeaderParams; params?: FindPetsByTagsQueryParams }) => {
+      return findPetsByTags(headers, params, config)
+    },
+    ...mutationOptions,
+  })
+}

package/src/generators/__snapshots__/postAsQuery.ts

@@ -0,0 +1,50 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { QueryKey, QueryObserverOptions, UseQueryResult } from "custom-query";
+import { queryOptions, useQuery } from "custom-query";
+
+ export const updatePetWithFormQueryKey = (petId: UpdatePetWithFormPathParams["petId"], data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams) => [{ url: "/pet/:petId", params: { petId: petId } }, ...(params ? [params] : []), ...(data ? [data] : [])] as const;
+
+ export type UpdatePetWithFormQueryKey = ReturnType<typeof updatePetWithFormQueryKey>;
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+async function updatePetWithForm(petId: UpdatePetWithFormPathParams["petId"], data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams, config: Partial<RequestConfig<UpdatePetWithFormMutationRequest>> = {}) {
+    const res = await client<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, UpdatePetWithFormMutationRequest>({ method: "POST", url: `/pet/${petId}`, params, data, ...config });
+    return updatePetWithFormMutationResponse.parse(res.data);
+}
+
+ export function updatePetWithFormQueryOptions(petId: UpdatePetWithFormPathParams["petId"], data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams, config: Partial<RequestConfig<UpdatePetWithFormMutationRequest>> = {}) {
+    const queryKey = updatePetWithFormQueryKey(petId, data, params);
+    return queryOptions({
+        enabled: !!(petId),
+        queryKey,
+        queryFn: async ({ signal }) => {
+            config.signal = signal;
+            return updatePetWithForm(petId, data, params, config);
+        },
+    });
+}
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+export function useUpdatePetWithForm<TData = UpdatePetWithFormMutationResponse, TQueryData = UpdatePetWithFormMutationResponse, TQueryKey extends QueryKey = UpdatePetWithFormQueryKey>(petId: UpdatePetWithFormPathParams["petId"], data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams, options: {
+    query?: Partial<QueryObserverOptions<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, TData, TQueryData, TQueryKey>>;
+    client?: Partial<RequestConfig<UpdatePetWithFormMutationRequest>>;
+} = {}) {
+    const { query: queryOptions, client: config = {} } = options ?? {};
+    const queryKey = queryOptions?.queryKey ?? updatePetWithFormQueryKey(petId, data, params);
+    const query = useQuery({
+        ...updatePetWithFormQueryOptions(petId, data, params, config) as unknown as QueryObserverOptions,
+        queryKey,
+        ...queryOptions as unknown as Omit<QueryObserverOptions, "queryKey">
+    }) as UseQueryResult<TData, UpdatePetWithForm405> & {
+        queryKey: TQueryKey;
+    };
+    query.queryKey = queryKey as TQueryKey;
+    return query;
+}

package/src/generators/__snapshots__/updatePetById.ts

@@ -0,0 +1,44 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { UseMutationOptions } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
+
+ export const updatePetWithFormMutationKey = () => [{ "url": "/pet/{petId}" }] as const;
+
+ export type UpdatePetWithFormMutationKey = ReturnType<typeof updatePetWithFormMutationKey>;
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+async function updatePetWithForm(petId: UpdatePetWithFormPathParams["petId"], data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams, config: Partial<RequestConfig<UpdatePetWithFormMutationRequest>> = {}) {
+    const res = await client<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, UpdatePetWithFormMutationRequest>({ method: "POST", url: `/pet/${petId}`, params, data, ...config });
+    return updatePetWithFormMutationResponse.parse(res.data);
+}
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+export function useUpdatePetWithForm(options: {
+    mutation?: UseMutationOptions<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, {
+        petId: UpdatePetWithFormPathParams["petId"];
+        data?: UpdatePetWithFormMutationRequest;
+        params?: UpdatePetWithFormQueryParams;
+    }>;
+    client?: Partial<RequestConfig<UpdatePetWithFormMutationRequest>>;
+} = {}) {
+    const { mutation: mutationOptions, client: config = {} } = options ?? {};
+    const mutationKey = mutationOptions?.mutationKey ?? updatePetWithFormMutationKey();
+    return useMutation<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, {
+        petId: UpdatePetWithFormPathParams["petId"];
+        data?: UpdatePetWithFormMutationRequest;
+        params?: UpdatePetWithFormQueryParams;
+    }>({
+        mutationFn: async ({ petId, data, params }) => {
+            return updatePetWithForm(petId, data, params, config);
+        },
+        mutationKey,
+        ...mutationOptions
+    });
+}

package/src/generators/__snapshots__/updatePetByIdPathParamsObject.ts

@@ -0,0 +1,44 @@
+import client from "@kubb/plugin-client/client";
+import type { RequestConfig } from "@kubb/plugin-client/client";
+import type { UseMutationOptions } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
+
+ export const updatePetWithFormMutationKey = () => [{ "url": "/pet/{petId}" }] as const;
+
+ export type UpdatePetWithFormMutationKey = ReturnType<typeof updatePetWithFormMutationKey>;
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+async function updatePetWithForm({ petId }: UpdatePetWithFormPathParams, data?: UpdatePetWithFormMutationRequest, params?: UpdatePetWithFormQueryParams, config: Partial<RequestConfig<UpdatePetWithFormMutationRequest>> = {}) {
+    const res = await client<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, UpdatePetWithFormMutationRequest>({ method: "POST", url: `/pet/${petId}`, params, data, ...config });
+    return updatePetWithFormMutationResponse.parse(res.data);
+}
+
+ /**
+ * @summary Updates a pet in the store with form data
+ * @link /pet/:petId
+ */
+export function useUpdatePetWithForm(options: {
+    mutation?: UseMutationOptions<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, {
+        petId: UpdatePetWithFormPathParams["petId"];
+        data?: UpdatePetWithFormMutationRequest;
+        params?: UpdatePetWithFormQueryParams;
+    }>;
+    client?: Partial<RequestConfig<UpdatePetWithFormMutationRequest>>;
+} = {}) {
+    const { mutation: mutationOptions, client: config = {} } = options ?? {};
+    const mutationKey = mutationOptions?.mutationKey ?? updatePetWithFormMutationKey();
+    return useMutation<UpdatePetWithFormMutationResponse, UpdatePetWithForm405, {
+        petId: UpdatePetWithFormPathParams["petId"];
+        data?: UpdatePetWithFormMutationRequest;
+        params?: UpdatePetWithFormQueryParams;
+    }>({
+        mutationFn: async ({ petId, data, params }) => {
+            return updatePetWithForm({ petId }, data, params, config);
+        },
+        mutationKey,
+        ...mutationOptions
+    });
+}

package/src/generators/index.ts

@@ -0,0 +1,4 @@
+export { queryGenerator } from './queryGenerator.tsx'
+export { mutationGenerator } from './mutationGenerator.tsx'
+export { infiniteQueryGenerator } from './infiniteQueryGenerator.tsx'
+export { suspenseQueryGenerator } from './suspenseQueryGenerator.tsx'

package/src/generators/infiniteQueryGenerator.tsx

@@ -0,0 +1,136 @@
+import { pluginClientName } from '@kubb/plugin-client'
+import { Client } from '@kubb/plugin-client/components'
+import { createReactGenerator } from '@kubb/plugin-oas'
+import { useOperationManager } from '@kubb/plugin-oas/hooks'
+import { pluginTsName } from '@kubb/plugin-ts'
+import { pluginZodName } from '@kubb/plugin-zod'
+import { File, useApp } from '@kubb/react'
+import { InfiniteQuery, InfiniteQueryOptions, QueryKey } from '../components'
+import type { PluginReactQuery } from '../types'
+
+export const infiniteQueryGenerator = createReactGenerator<PluginReactQuery>({
+  name: 'react-infinite-query',
+  Operation({ options, operation }) {
+    const {
+      plugin: {
+        options: { output },
+      },
+    } = useApp<PluginReactQuery>()
+    const { getSchemas, getName, getFile } = useOperationManager()
+    const isQuery = typeof options.query === 'boolean' ? options.query : !!options.query.methods?.some((method) => operation.method === method)
+    const isInfinite = isQuery && !!options.infinite
+
+    const importPath = options.query ? options.query.importPath : '@tanstack/react-query'
+
+    const query = {
+      name: getName(operation, { type: 'function', prefix: 'use', suffix: 'infinite' }),
+      typeName: getName(operation, { type: 'type' }),
+      file: getFile(operation, { prefix: 'use', suffix: 'infinite' }),
+    }
+
+    const client = {
+      name: getName(operation, { type: 'function', pluginKey: [pluginClientName] }),
+    }
+
+    const queryOptions = {
+      name: getName(operation, { type: 'function', suffix: 'InfiniteQueryOptions' }),
+    }
+
+    const queryKey = {
+      name: getName(operation, { type: 'const', suffix: 'InfiniteQueryKey' }),
+      typeName: getName(operation, { type: 'type', suffix: 'InfiniteQueryKey' }),
+    }
+
+    const type = {
+      file: getFile(operation, { pluginKey: [pluginTsName] }),
+      //todo remove type?
+      schemas: getSchemas(operation, { pluginKey: [pluginTsName], type: 'type' }),
+    }
+
+    const zod = {
+      file: getFile(operation, { pluginKey: [pluginZodName] }),
+      schemas: getSchemas(operation, { pluginKey: [pluginZodName], type: 'function' }),
+    }
+
+    if (!isQuery || !isInfinite) {
+      return null
+    }
+
+    return (
+      <File baseName={query.file.baseName} path={query.file.path} meta={query.file.meta} banner={output?.banner} footer={output?.footer}>
+        {options.parser === 'zod' && <File.Import name={[zod.schemas.response.name]} root={query.file.path} path={zod.file.path} />}
+        <File.Import name={'client'} path={options.client.importPath} />
+        <File.Import name={['RequestConfig']} path={options.client.importPath} isTypeOnly />
+        {options.client.dataReturnType === 'full' && <File.Import name={['ResponseConfig']} path={options.client.importPath} isTypeOnly />}
+        <File.Import
+          name={[
+            type.schemas.request?.name,
+            type.schemas.response.name,
+            type.schemas.pathParams?.name,
+            type.schemas.queryParams?.name,
+            type.schemas.headerParams?.name,
+            ...(type.schemas.statusCodes?.map((item) => item.name) || []),
+          ].filter(Boolean)}
+          root={query.file.path}
+          path={type.file.path}
+          isTypeOnly
+        />
+        <QueryKey
+          name={queryKey.name}
+          typeName={queryKey.typeName}
+          operation={operation}
+          pathParamsType={options.pathParamsType}
+          typeSchemas={type.schemas}
+          transformer={options.queryKey}
+        />
+        <Client
+          name={client.name}
+          isExportable={false}
+          isIndexable={false}
+          baseURL={options.client.baseURL}
+          operation={operation}
+          typeSchemas={type.schemas}
+          zodSchemas={zod.schemas}
+          dataReturnType={options.client.dataReturnType}
+          paramsType={options.paramsType}
+          pathParamsType={options.pathParamsType}
+          parser={options.parser}
+        />
+        {options.infinite && (
+          <>
+            <File.Import name={['infiniteQueryOptions']} path={importPath} />
+            <InfiniteQueryOptions
+              name={queryOptions.name}
+              clientName={client.name}
+              queryKeyName={queryKey.name}
+              typeSchemas={type.schemas}
+              paramsType={options.paramsType}
+              pathParamsType={options.pathParamsType}
+              dataReturnType={options.client.dataReturnType}
+              cursorParam={options.infinite.cursorParam}
+              initialPageParam={options.infinite.initialPageParam}
+              queryParam={options.infinite.queryParam}
+            />
+          </>
+        )}
+        {options.infinite && (
+          <>
+            <File.Import name={['useInfiniteQuery']} path={importPath} />
+            <File.Import name={['QueryKey', 'InfiniteQueryObserverOptions', 'UseInfiniteQueryResult']} path={importPath} isTypeOnly />
+            <InfiniteQuery
+              name={query.name}
+              queryOptionsName={queryOptions.name}
+              typeSchemas={type.schemas}
+              paramsType={options.paramsType}
+              pathParamsType={options.pathParamsType}
+              operation={operation}
+              dataReturnType={options.client.dataReturnType}
+              queryKeyName={queryKey.name}
+              queryKeyTypeName={queryKey.typeName}
+            />
+          </>
+        )}
+      </File>
+    )
+  },
+})

package/src/generators/mutationGenerator.tsx

@@ -0,0 +1,117 @@
+import { pluginClientName } from '@kubb/plugin-client'
+import { Client } from '@kubb/plugin-client/components'
+import { createReactGenerator } from '@kubb/plugin-oas'
+import { useOperationManager } from '@kubb/plugin-oas/hooks'
+import { pluginTsName } from '@kubb/plugin-ts'
+import { pluginZodName } from '@kubb/plugin-zod'
+import { File, useApp } from '@kubb/react'
+import { Mutation, MutationKey } from '../components'
+import type { PluginReactQuery } from '../types'
+
+export const mutationGenerator = createReactGenerator<PluginReactQuery>({
+  name: 'react-query',
+  Operation({ options, operation }) {
+    const {
+      plugin: {
+        options: { output },
+      },
+    } = useApp<PluginReactQuery>()
+    const { getSchemas, getName, getFile } = useOperationManager()
+
+    const isQuery = typeof options.query === 'boolean' ? true : options.query?.methods.some((method) => operation.method === method)
+    const isMutation = !isQuery && options.mutation && options.mutation.methods.some((method) => operation.method === method)
+
+    const importPath = options.mutation ? options.mutation.importPath : '@tanstack/react-query'
+
+    const mutation = {
+      name: getName(operation, { type: 'function', prefix: 'use' }),
+      typeName: getName(operation, { type: 'type' }),
+      file: getFile(operation, { prefix: 'use' }),
+    }
+
+    const type = {
+      file: getFile(operation, { pluginKey: [pluginTsName] }),
+      //todo remove type?
+      schemas: getSchemas(operation, { pluginKey: [pluginTsName], type: 'type' }),
+    }
+
+    const zod = {
+      file: getFile(operation, { pluginKey: [pluginZodName] }),
+      schemas: getSchemas(operation, { pluginKey: [pluginZodName], type: 'function' }),
+    }
+
+    const client = {
+      name: getName(operation, { type: 'function', pluginKey: [pluginClientName] }),
+    }
+
+    const mutationKey = {
+      name: getName(operation, { type: 'const', suffix: 'MutationKey' }),
+      typeName: getName(operation, { type: 'type', suffix: 'MutationKey' }),
+    }
+
+    if (!isMutation) {
+      return null
+    }
+
+    return (
+      <File baseName={mutation.file.baseName} path={mutation.file.path} meta={mutation.file.meta} banner={output?.banner} footer={output?.footer}>
+        {options.parser === 'zod' && <File.Import name={[zod.schemas.response.name]} root={mutation.file.path} path={zod.file.path} />}
+        <File.Import name={'client'} path={options.client.importPath} />
+        <File.Import name={['RequestConfig', 'ResponseConfig']} path={options.client.importPath} isTypeOnly />
+        <File.Import
+          name={[
+            type.schemas.request?.name,
+            type.schemas.response.name,
+            type.schemas.pathParams?.name,
+            type.schemas.queryParams?.name,
+            type.schemas.headerParams?.name,
+            ...(type.schemas.statusCodes?.map((item) => item.name) || []),
+          ].filter(Boolean)}
+          root={mutation.file.path}
+          path={type.file.path}
+          isTypeOnly
+        />
+
+        <MutationKey
+          name={mutationKey.name}
+          typeName={mutationKey.typeName}
+          operation={operation}
+          pathParamsType={options.pathParamsType}
+          typeSchemas={type.schemas}
+          transformer={options.mutationKey}
+        />
+
+        <Client
+          name={client.name}
+          isExportable={false}
+          isIndexable={false}
+          baseURL={options.client.baseURL}
+          operation={operation}
+          typeSchemas={type.schemas}
+          zodSchemas={zod.schemas}
+          dataReturnType={options.client.dataReturnType}
+          paramsType={options.paramsType}
+          pathParamsType={options.pathParamsType}
+          parser={options.parser}
+        />
+        {options.mutation && (
+          <>
+            <File.Import name={['useMutation']} path={importPath} />
+            <File.Import name={['UseMutationOptions']} path={importPath} isTypeOnly />
+            <Mutation
+              name={mutation.name}
+              clientName={client.name}
+              typeName={mutation.typeName}
+              typeSchemas={type.schemas}
+              operation={operation}
+              dataReturnType={options.client.dataReturnType}
+              paramsType={options.paramsType}
+              pathParamsType={options.pathParamsType}
+              mutationKeyName={mutationKey.name}
+            />
+          </>
+        )}
+      </File>
+    )
+  },
+})