@kubb/plugin-react-query 3.0.0-alpha.9 → 3.0.0-beta.2

package/dist/types-5pnOmDmM.d.cts

@@ -0,0 +1,231 @@
+import { PluginFactoryOptions, Output, Group, ResolveNameParams } from '@kubb/core';
+import { HttpMethod } from '@kubb/oas';
+import { ResolvePathOptions, Exclude, Include, Override, Generator } from '@kubb/plugin-oas';
+
+type Options$1 = {
+    /**
+     * Specify the export location for the files and define the behavior of the output
+     * @default { path: 'clients', barrelType: 'named' }
+     */
+    output?: Output;
+    /**
+     * Group the clients based on the provided name.
+     */
+    group?: Group;
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions$1>>;
+    /**
+     * Create `operations.ts` file with all operations grouped by methods.
+     * @default `false`
+     */
+    operations?: boolean;
+    /**
+     * Path to the client import path that will be used to do the API calls.
+     * It will be used as `import client from '${client.importPath}'`.
+     * It allows both relative and absolute path but be aware that we will not change the path.
+     * @default '@kubb/plugin-client/client'
+     */
+    importPath?: string;
+    /**
+     * ReturnType that will be used when calling the client.
+     *
+     * `Data` will return ResponseConfig[data].
+     *
+     * `Full` will return ResponseConfig.
+     * @default `'data'`
+     * @private
+     */
+    dataReturnType?: 'data' | 'full';
+    /**
+     * How to pass your pathParams.
+     *
+     * `object` will return the pathParams as an object.
+     *
+     * `inline` will return the pathParams as comma separated params.
+     * @default `'inline'`
+     * @private
+     */
+    pathParamsType?: 'object' | 'inline';
+    /**
+     * Which parser can be used before returning the data
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     * @default 'client'
+     */
+    parser?: 'client' | 'zod';
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the client generators
+     */
+    generators?: Array<Generator<PluginClient>>;
+};
+type ResolvedOptions$1 = {
+    output: Output;
+    group?: Options$1['group'];
+    baseURL: string | undefined;
+    parser: NonNullable<Options$1['parser']>;
+    importPath: NonNullable<Options$1['importPath']>;
+    dataReturnType: NonNullable<Options$1['dataReturnType']>;
+    pathParamsType: NonNullable<Options$1['pathParamsType']>;
+};
+type PluginClient = PluginFactoryOptions<'plugin-client', Options$1, ResolvedOptions$1, never, ResolvePathOptions>;
+
+type Suspense = object;
+type Query = {
+    /**
+     * Customize the queryKey, here you can specify a suffix.
+     */
+    key: (key: unknown[]) => unknown[];
+    /**
+     * Define which HttpMethods can be used for queries
+     * @default ['get']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Mutation = {
+    /**
+     * Customize the queryKey, here you can specify a suffix.
+     */
+    key: (key: unknown[]) => unknown[];
+    /**
+     * Define which HttpMethods can be used for mutations
+     * @default ['post', 'put', 'delete']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Infinite = {
+    /**
+     * Specify the params key used for `pageParam`.
+     * @default `'id'`
+     */
+    queryParam: string;
+    /**
+     * Which field of the data will be used, set it to undefined when no cursor is known.
+     */
+    cursorParam?: string | undefined;
+    /**
+     * The initial value, the value of the first page.
+     * @default `0`
+     */
+    initialPageParam: unknown;
+};
+type Options = {
+    /**
+     * @default 'hooks'
+     */
+    output?: Output;
+    /**
+     * Group the @tanstack/query hooks based on the provided name.
+     */
+    group?: Group;
+    client?: Pick<PluginClient['options'], 'dataReturnType' | 'importPath'>;
+    /**
+     * ReturnType that needs to be used when calling client().
+     *
+     * `Data` will return ResponseConfig[data].
+     *
+     * `Full` will return ResponseConfig.
+     * @default `'data'`
+     * @private
+     */
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions>>;
+    /**
+     * How to pass your pathParams.
+     *
+     * `object` will return the pathParams as an object.
+     *
+     * `inline` will return the pathParams as comma separated params.
+     * @default `'inline'`
+     * @private
+     */
+    pathParamsType?: PluginClient['options']['pathParamsType'];
+    /**
+     * When set, an infiniteQuery hooks will be added.
+     */
+    infinite?: Partial<Infinite> | false;
+    /**
+     * When set, a suspenseQuery hooks will be added.
+     */
+    suspense?: Partial<Suspense> | false;
+    /**
+     * Override some useQuery behaviours.
+     */
+    query?: Partial<Query> | false;
+    /**
+     * Override some useMutation behaviours.
+     */
+    mutation?: Mutation | false;
+    /**
+     * Which parser can be used before returning the data to `@tanstack/query`.
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     */
+    parser?: PluginClient['options']['parser'];
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the react-query generators
+     */
+    generators?: Array<Generator<PluginReactQuery>>;
+};
+type ResolvedOptions = {
+    output: Output;
+    baseURL: string | undefined;
+    client: Required<NonNullable<PluginReactQuery['options']['client']>>;
+    parser: Required<NonNullable<Options['parser']>>;
+    pathParamsType: NonNullable<Options['pathParamsType']>;
+    /**
+     * Only used of infinite
+     */
+    infinite: NonNullable<Infinite> | false;
+    suspense: Suspense | false;
+    query: NonNullable<Required<Query>> | false;
+    mutation: NonNullable<Required<Mutation>> | false;
+};
+type PluginReactQuery = PluginFactoryOptions<'plugin-react-query', Options, ResolvedOptions, never, ResolvePathOptions>;
+
+export type { Infinite as I, Options as O, PluginReactQuery as P };

package/dist/types-5pnOmDmM.d.ts

@@ -0,0 +1,231 @@
+import { PluginFactoryOptions, Output, Group, ResolveNameParams } from '@kubb/core';
+import { HttpMethod } from '@kubb/oas';
+import { ResolvePathOptions, Exclude, Include, Override, Generator } from '@kubb/plugin-oas';
+
+type Options$1 = {
+    /**
+     * Specify the export location for the files and define the behavior of the output
+     * @default { path: 'clients', barrelType: 'named' }
+     */
+    output?: Output;
+    /**
+     * Group the clients based on the provided name.
+     */
+    group?: Group;
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions$1>>;
+    /**
+     * Create `operations.ts` file with all operations grouped by methods.
+     * @default `false`
+     */
+    operations?: boolean;
+    /**
+     * Path to the client import path that will be used to do the API calls.
+     * It will be used as `import client from '${client.importPath}'`.
+     * It allows both relative and absolute path but be aware that we will not change the path.
+     * @default '@kubb/plugin-client/client'
+     */
+    importPath?: string;
+    /**
+     * ReturnType that will be used when calling the client.
+     *
+     * `Data` will return ResponseConfig[data].
+     *
+     * `Full` will return ResponseConfig.
+     * @default `'data'`
+     * @private
+     */
+    dataReturnType?: 'data' | 'full';
+    /**
+     * How to pass your pathParams.
+     *
+     * `object` will return the pathParams as an object.
+     *
+     * `inline` will return the pathParams as comma separated params.
+     * @default `'inline'`
+     * @private
+     */
+    pathParamsType?: 'object' | 'inline';
+    /**
+     * Which parser can be used before returning the data
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     * @default 'client'
+     */
+    parser?: 'client' | 'zod';
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the client generators
+     */
+    generators?: Array<Generator<PluginClient>>;
+};
+type ResolvedOptions$1 = {
+    output: Output;
+    group?: Options$1['group'];
+    baseURL: string | undefined;
+    parser: NonNullable<Options$1['parser']>;
+    importPath: NonNullable<Options$1['importPath']>;
+    dataReturnType: NonNullable<Options$1['dataReturnType']>;
+    pathParamsType: NonNullable<Options$1['pathParamsType']>;
+};
+type PluginClient = PluginFactoryOptions<'plugin-client', Options$1, ResolvedOptions$1, never, ResolvePathOptions>;
+
+type Suspense = object;
+type Query = {
+    /**
+     * Customize the queryKey, here you can specify a suffix.
+     */
+    key: (key: unknown[]) => unknown[];
+    /**
+     * Define which HttpMethods can be used for queries
+     * @default ['get']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Mutation = {
+    /**
+     * Customize the queryKey, here you can specify a suffix.
+     */
+    key: (key: unknown[]) => unknown[];
+    /**
+     * Define which HttpMethods can be used for mutations
+     * @default ['post', 'put', 'delete']
+     */
+    methods: Array<HttpMethod>;
+    /**
+     * Path to the useQuery that will be used to do the useQuery functionality.
+     * It will be used as `import { useQuery } from '${importPath}'`.
+     * It allows both relative and absolute path.
+     * the path will be applied as is, so relative path should be based on the file being generated.
+     * @default '@tanstack/react-query'
+     */
+    importPath?: string;
+};
+type Infinite = {
+    /**
+     * Specify the params key used for `pageParam`.
+     * @default `'id'`
+     */
+    queryParam: string;
+    /**
+     * Which field of the data will be used, set it to undefined when no cursor is known.
+     */
+    cursorParam?: string | undefined;
+    /**
+     * The initial value, the value of the first page.
+     * @default `0`
+     */
+    initialPageParam: unknown;
+};
+type Options = {
+    /**
+     * @default 'hooks'
+     */
+    output?: Output;
+    /**
+     * Group the @tanstack/query hooks based on the provided name.
+     */
+    group?: Group;
+    client?: Pick<PluginClient['options'], 'dataReturnType' | 'importPath'>;
+    /**
+     * ReturnType that needs to be used when calling client().
+     *
+     * `Data` will return ResponseConfig[data].
+     *
+     * `Full` will return ResponseConfig.
+     * @default `'data'`
+     * @private
+     */
+    /**
+     * Array containing exclude parameters to exclude/skip tags/operations/methods/paths.
+     */
+    exclude?: Array<Exclude>;
+    /**
+     * Array containing include parameters to include tags/operations/methods/paths.
+     */
+    include?: Array<Include>;
+    /**
+     * Array containing override parameters to override `options` based on tags/operations/methods/paths.
+     */
+    override?: Array<Override<ResolvedOptions>>;
+    /**
+     * How to pass your pathParams.
+     *
+     * `object` will return the pathParams as an object.
+     *
+     * `inline` will return the pathParams as comma separated params.
+     * @default `'inline'`
+     * @private
+     */
+    pathParamsType?: PluginClient['options']['pathParamsType'];
+    /**
+     * When set, an infiniteQuery hooks will be added.
+     */
+    infinite?: Partial<Infinite> | false;
+    /**
+     * When set, a suspenseQuery hooks will be added.
+     */
+    suspense?: Partial<Suspense> | false;
+    /**
+     * Override some useQuery behaviours.
+     */
+    query?: Partial<Query> | false;
+    /**
+     * Override some useMutation behaviours.
+     */
+    mutation?: Mutation | false;
+    /**
+     * Which parser can be used before returning the data to `@tanstack/query`.
+     * `'zod'` will use `@kubb/plugin-zod` to parse the data.
+     */
+    parser?: PluginClient['options']['parser'];
+    transformers?: {
+        /**
+         * Customize the names based on the type that is provided by the plugin.
+         */
+        name?: (name: ResolveNameParams['name'], type?: ResolveNameParams['type']) => string;
+    };
+    /**
+     * Define some generators next to the react-query generators
+     */
+    generators?: Array<Generator<PluginReactQuery>>;
+};
+type ResolvedOptions = {
+    output: Output;
+    baseURL: string | undefined;
+    client: Required<NonNullable<PluginReactQuery['options']['client']>>;
+    parser: Required<NonNullable<Options['parser']>>;
+    pathParamsType: NonNullable<Options['pathParamsType']>;
+    /**
+     * Only used of infinite
+     */
+    infinite: NonNullable<Infinite> | false;
+    suspense: Suspense | false;
+    query: NonNullable<Required<Query>> | false;
+    mutation: NonNullable<Required<Mutation>> | false;
+};
+type PluginReactQuery = PluginFactoryOptions<'plugin-react-query', Options, ResolvedOptions, never, ResolvePathOptions>;
+
+export type { Infinite as I, Options as O, PluginReactQuery as P };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubb/plugin-react-query",
-  "version": "3.0.0-alpha.9",
+  "version": "3.0.0-beta.2",
   "description": "Generator react-query hooks",
   "keywords": [
     "faker",
@@ -29,6 +29,11 @@
       "require": "./dist/index.cjs",
       "default": "./dist/index.cjs"
     },
+    "./generators": {
+      "import": "./dist/generators.js",
+      "require": "./dist/generators.cjs",
+      "default": "./dist/generators.cjs"
+    },
     "./components": {
       "import": "./dist/components.js",
       "require": "./dist/components.cjs",
@@ -44,6 +49,9 @@
     "*": {
       "components": [
         "./dist/components.d.ts"
+      ],
+      "generators": [
+        "./dist/generators.d.ts"
       ]
     }
   },
@@ -54,27 +62,24 @@
     "!/**/__tests__/**"
   ],
   "dependencies": {
-    "@kubb/core": "3.0.0-alpha.9",
-    "@kubb/fs": "3.0.0-alpha.9",
-    "@kubb/oas": "3.0.0-alpha.9",
-    "@kubb/plugin-faker": "3.0.0-alpha.9",
-    "@kubb/parser-ts": "3.0.0-alpha.9",
-    "@kubb/plugin-oas": "3.0.0-alpha.9",
-    "@kubb/plugin-ts": "3.0.0-alpha.9",
-    "@kubb/plugin-zod": "3.0.0-alpha.9",
-    "@kubb/react": "3.0.0-alpha.9"
+    "@kubb/core": "3.0.0-beta.2",
+    "@kubb/fs": "3.0.0-beta.2",
+    "@kubb/oas": "3.0.0-beta.2",
+    "@kubb/plugin-oas": "3.0.0-beta.2",
+    "@kubb/plugin-ts": "3.0.0-beta.2",
+    "@kubb/plugin-zod": "3.0.0-beta.2",
+    "@kubb/react": "3.0.0-beta.2"
   },
   "devDependencies": {
-    "@types/react": "^18.3.4",
+    "@types/react": "^18.3.11",
     "react": "^18.3.1",
-    "tsup": "^8.2.4",
-    "typescript": "^5.5.4",
-    "@kubb/config-biome": "3.0.0-alpha.9",
-    "@kubb/config-ts": "3.0.0-alpha.9",
-    "@kubb/config-tsup": "3.0.0-alpha.9"
+    "tsup": "^8.3.0",
+    "typescript": "^5.6.2",
+    "@kubb/config-ts": "3.0.0-beta.2",
+    "@kubb/config-tsup": "3.0.0-beta.2"
   },
   "peerDependencies": {
-    "@kubb/react": "3.0.0-alpha.9"
+    "@kubb/react": "3.0.0-beta.2"
   },
   "engines": {
     "node": ">=20"

package/src/components/InfiniteQuery.tsx

@@ -0,0 +1,129 @@
+import { File, Function, FunctionParams } from '@kubb/react'
+
+import { type Operation, isOptional } from '@kubb/oas'
+import type { OperationSchemas } from '@kubb/plugin-oas'
+import { getComments, getPathParams } from '@kubb/plugin-oas/utils'
+import type { ReactNode } from 'react'
+import type { PluginReactQuery } from '../types.ts'
+import { QueryKey } from './QueryKey.tsx'
+import { QueryOptions } from './QueryOptions.tsx'
+
+type Props = {
+  /**
+   * Name of the function
+   */
+  name: string
+  queryOptionsName: string
+  queryKeyName: string
+  queryKeyTypeName: string
+  typeSchemas: OperationSchemas
+  operation: Operation
+  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
+  dataReturnType: PluginReactQuery['resolvedOptions']['client']['dataReturnType']
+}
+
+type GetParamsProps = {
+  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
+  dataReturnType: PluginReactQuery['resolvedOptions']['client']['dataReturnType']
+  typeSchemas: OperationSchemas
+}
+
+function getParams({ pathParamsType, dataReturnType, typeSchemas }: GetParamsProps) {
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+
+  return FunctionParams.factory({
+    pathParams: {
+      mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
+      children: getPathParams(typeSchemas.pathParams, { typed: true }),
+    },
+    data: typeSchemas.request?.name
+      ? {
+          type: typeSchemas.request?.name,
+          optional: isOptional(typeSchemas.request?.schema),
+        }
+      : undefined,
+    params: typeSchemas.queryParams?.name
+      ? {
+          type: typeSchemas.queryParams?.name,
+          optional: isOptional(typeSchemas.queryParams?.schema),
+        }
+      : undefined,
+    headers: typeSchemas.headerParams?.name
+      ? {
+          type: typeSchemas.headerParams?.name,
+          optional: isOptional(typeSchemas.headerParams?.schema),
+        }
+      : undefined,
+    options: {
+      type: `
+{
+  query?: Partial<InfiniteQueryObserverOptions<${[TData, typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error', 'TData', 'TQueryData', 'TQueryKey'].join(', ')}>>,
+  client?: ${typeSchemas.request?.name ? `Partial<RequestConfig<${typeSchemas.request?.name}>>` : 'Partial<RequestConfig>'}
+}
+`,
+      default: '{}',
+    },
+  })
+}
+
+export function InfiniteQuery({
+  name,
+  queryKeyTypeName,
+  queryOptionsName,
+  queryKeyName,
+  pathParamsType,
+  dataReturnType,
+  typeSchemas,
+  operation,
+}: Props): ReactNode {
+  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
+  const returnType = `UseInfiniteQueryResult<${['TData', typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'].join(', ')}> & { queryKey: TQueryKey }`
+  const generics = [`TData = ${TData}`, `TQueryData = ${TData}`, `TQueryKey extends QueryKey = ${queryKeyTypeName}`]
+
+  const queryKeyParams = QueryKey.getParams({
+    pathParamsType,
+    typeSchemas,
+  })
+  const queryOptionsParams = QueryOptions.getParams({
+    pathParamsType,
+    typeSchemas,
+  })
+  const params = getParams({
+    pathParamsType,
+    dataReturnType,
+    typeSchemas,
+  })
+
+  const queryOptions = `${queryOptionsName}(${queryOptionsParams.toCall()}) as unknown as InfiniteQueryObserverOptions`
+
+  return (
+    <File.Source name={name} isExportable isIndexable>
+      <Function
+        name={name}
+        export
+        generics={generics.join(', ')}
+        params={params.toConstructor()}
+        JSDoc={{
+          comments: getComments(operation),
+        }}
+      >
+        {`
+       const { query: queryOptions, client: config = {} } = options ?? {}
+       const queryKey = queryOptions?.queryKey ?? ${queryKeyName}(${queryKeyParams.toCall()})
+
+       const query = useInfiniteQuery({
+        ...${queryOptions},
+        queryKey,
+        ...queryOptions as unknown as Omit<InfiniteQueryObserverOptions, "queryKey">
+       }) as ${returnType}
+
+       query.queryKey = queryKey as TQueryKey
+
+       return query
+       `}
+      </Function>
+    </File.Source>
+  )
+}
+
+InfiniteQuery.getParams = getParams