@kubb/plugin-react-query 5.0.0-alpha.9 → 5.0.0-beta.100

package/src/components/SuspenseInfiniteQueryOptions.tsx

@@ -1,289 +0,0 @@
-import { getNestedAccessor } from '@internals/utils'
-import { isAllOptional, isOptional } from '@kubb/oas'
-import { Client } from '@kubb/plugin-client/components'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getPathParams } from '@kubb/plugin-oas/utils'
-import { File, Function, FunctionParams } from '@kubb/react-fabric'
-import type { FabricReactNode } from '@kubb/react-fabric/types'
-import type { Infinite, PluginReactQuery } from '../types.ts'
-import { QueryKey } from './QueryKey.tsx'
-
-type Props = {
-  name: string
-  clientName: string
-  queryKeyName: string
-  typeSchemas: OperationSchemas
-  paramsCasing: PluginReactQuery['resolvedOptions']['paramsCasing']
-  paramsType: PluginReactQuery['resolvedOptions']['paramsType']
-  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
-  dataReturnType: PluginReactQuery['resolvedOptions']['client']['dataReturnType']
-  initialPageParam: Infinite['initialPageParam']
-  cursorParam: Infinite['cursorParam']
-  nextParam: Infinite['nextParam']
-  previousParam: Infinite['previousParam']
-  queryParam: Infinite['queryParam']
-}
-
-type GetParamsProps = {
-  paramsCasing: PluginReactQuery['resolvedOptions']['paramsCasing']
-  paramsType: PluginReactQuery['resolvedOptions']['paramsType']
-  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
-  typeSchemas: OperationSchemas
-}
-
-function getParams({ paramsType, paramsCasing, pathParamsType, typeSchemas }: GetParamsProps) {
-  if (paramsType === 'object') {
-    const pathParams = getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing })
-
-    const children = {
-      ...pathParams,
-      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,
-    }
-
-    // Check if all children are optional or undefined
-    const allChildrenAreOptional = Object.values(children).every((child) => !child || child.optional)
-
-    return FunctionParams.factory({
-      data: {
-        mode: 'object',
-        children,
-        default: allChildrenAreOptional ? '{}' : undefined,
-      },
-      config: {
-        type: typeSchemas.request?.name
-          ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }`
-          : 'Partial<RequestConfig> & { client?: Client }',
-        default: '{}',
-      },
-    })
-  }
-
-  return FunctionParams.factory({
-    pathParams: typeSchemas.pathParams?.name
-      ? {
-          mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
-          children: getPathParams(typeSchemas.pathParams, {
-            typed: true,
-            casing: paramsCasing,
-          }),
-          default: isAllOptional(typeSchemas.pathParams?.schema) ? '{}' : undefined,
-        }
-      : undefined,
-    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,
-    config: {
-      type: typeSchemas.request?.name
-        ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }`
-        : 'Partial<RequestConfig> & { client?: Client }',
-      default: '{}',
-    },
-  })
-}
-
-export function SuspenseInfiniteQueryOptions({
-  name,
-  clientName,
-  initialPageParam,
-  cursorParam,
-  nextParam,
-  previousParam,
-  typeSchemas,
-  paramsCasing,
-  paramsType,
-  dataReturnType,
-  pathParamsType,
-  queryParam,
-  queryKeyName,
-}: Props): FabricReactNode {
-  const queryFnDataType = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
-  const errorType = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
-  const isInitialPageParamDefined = initialPageParam !== undefined && initialPageParam !== null
-  const fallbackPageParamType =
-    typeof initialPageParam === 'number'
-      ? 'number'
-      : typeof initialPageParam === 'string'
-        ? initialPageParam.includes(' as ')
-          ? (() => {
-              const parts = initialPageParam.split(' as ')
-              return parts[parts.length - 1] ?? 'unknown'
-            })()
-          : 'string'
-        : typeof initialPageParam === 'boolean'
-          ? 'boolean'
-          : 'unknown'
-  const queryParamType = queryParam && typeSchemas.queryParams?.name ? `${typeSchemas.queryParams?.name}['${queryParam}']` : undefined
-  const pageParamType = queryParamType ? (isInitialPageParamDefined ? `NonNullable<${queryParamType}>` : queryParamType) : fallbackPageParamType
-
-  const params = getParams({
-    paramsType,
-    paramsCasing,
-    pathParamsType,
-    typeSchemas,
-  })
-  const clientParams = Client.getParams({
-    paramsCasing,
-    typeSchemas,
-    paramsType,
-    pathParamsType,
-    isConfigurable: true,
-  })
-  const queryKeyParams = QueryKey.getParams({
-    pathParamsType,
-    typeSchemas,
-    paramsCasing,
-  })
-
-  // Determine if we should use the new nextParam/previousParam or fall back to legacy cursorParam behavior
-  const hasNewParams = nextParam !== undefined || previousParam !== undefined
-
-  let getNextPageParamExpr: string | undefined
-  let getPreviousPageParamExpr: string | undefined
-
-  if (hasNewParams) {
-    // Use the new nextParam and previousParam
-    if (nextParam) {
-      const accessor = getNestedAccessor(nextParam, 'lastPage')
-      if (accessor) {
-        getNextPageParamExpr = `getNextPageParam: (lastPage) => ${accessor}`
-      }
-    }
-    if (previousParam) {
-      const accessor = getNestedAccessor(previousParam, 'firstPage')
-      if (accessor) {
-        getPreviousPageParamExpr = `getPreviousPageParam: (firstPage) => ${accessor}`
-      }
-    }
-  } else if (cursorParam) {
-    // Legacy behavior: use cursorParam for both next and previous
-    getNextPageParamExpr = `getNextPageParam: (lastPage) => lastPage['${cursorParam}']`
-    getPreviousPageParamExpr = `getPreviousPageParam: (firstPage) => firstPage['${cursorParam}']`
-  } else {
-    // Fallback behavior: page-based pagination
-    if (dataReturnType === 'full') {
-      getNextPageParamExpr =
-        'getNextPageParam: (lastPage, _allPages, lastPageParam) => Array.isArray(lastPage.data) && lastPage.data.length === 0 ? undefined : lastPageParam + 1'
-    } else {
-      getNextPageParamExpr =
-        'getNextPageParam: (lastPage, _allPages, lastPageParam) => Array.isArray(lastPage) && lastPage.length === 0 ? undefined : lastPageParam + 1'
-    }
-    getPreviousPageParamExpr = 'getPreviousPageParam: (_firstPage, _allPages, firstPageParam) => firstPageParam <= 1 ? undefined : firstPageParam - 1'
-  }
-
-  const queryOptions = [
-    `initialPageParam: ${typeof initialPageParam === 'string' ? JSON.stringify(initialPageParam) : initialPageParam}`,
-    getNextPageParamExpr,
-    getPreviousPageParamExpr,
-  ].filter(Boolean)
-
-  const infiniteOverrideParams =
-    queryParam && typeSchemas.queryParams?.name
-      ? `
-          params = {
-            ...(params ?? {}),
-            ['${queryParam}']: pageParam as unknown as ${typeSchemas.queryParams?.name}['${queryParam}'],
-          } as ${typeSchemas.queryParams?.name}`
-      : ''
-
-  // Only add enabled check for required (non-optional) parameters
-  // Optional parameters with defaults should not prevent query execution
-  const enabled = Object.entries(queryKeyParams.flatParams)
-    .map(([key, item]) => {
-      // Only include if the parameter exists and is NOT optional
-      // This ensures we only check required parameters
-      return item && !item.optional && !item.default ? key : undefined
-    })
-    .filter(Boolean)
-    .join('&& ')
-
-  const enabledText = enabled ? `enabled: !!(${enabled}),` : ''
-
-  if (infiniteOverrideParams) {
-    return (
-      <File.Source name={name} isExportable isIndexable>
-        <Function name={name} export params={params.toConstructor()}>
-          {`
-      const queryKey = ${queryKeyName}(${queryKeyParams.toCall()})
-      return infiniteQueryOptions<${queryFnDataType}, ${errorType}, InfiniteData<${queryFnDataType}>, typeof queryKey, ${pageParamType}>({
-       ${enabledText}
-       queryKey,
-       queryFn: async ({ signal, pageParam }) => {
-          ${infiniteOverrideParams}
-          return ${clientName}(${clientParams.toCall({
-            transformName(name) {
-              if (name === 'config') {
-                return '{ ...config, signal: config.signal ?? signal }'
-              }
-
-              return name
-            },
-          })})
-        },
-       ${queryOptions.join(',\n')}
-      })
-`}
-        </Function>
-      </File.Source>
-    )
-  }
-
-  return (
-    <File.Source name={name} isExportable isIndexable>
-      <Function name={name} export params={params.toConstructor()}>
-        {`
-      const queryKey = ${queryKeyName}(${queryKeyParams.toCall()})
-      return infiniteQueryOptions<${queryFnDataType}, ${errorType}, InfiniteData<${queryFnDataType}>, typeof queryKey, ${pageParamType}>({
-       ${enabledText}
-       queryKey,
-       queryFn: async ({ signal }) => {
-          return ${clientName}(${clientParams.toCall({
-            transformName(name) {
-              if (name === 'config') {
-                return '{ ...config, signal: config.signal ?? signal }'
-              }
-
-              return name
-            },
-          })})
-        },
-       ${queryOptions.join(',\n')}
-     })
-`}
-      </Function>
-    </File.Source>
-  )
-}
-
-SuspenseInfiniteQueryOptions.getParams = getParams

package/src/components/SuspenseQuery.tsx

@@ -1,204 +0,0 @@
-import { isAllOptional, isOptional, type Operation } from '@kubb/oas'
-import type { OperationSchemas } from '@kubb/plugin-oas'
-import { getComments, getPathParams } from '@kubb/plugin-oas/utils'
-import { File, Function, FunctionParams } from '@kubb/react-fabric'
-import type { FabricReactNode } from '@kubb/react-fabric/types'
-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
-  paramsCasing: PluginReactQuery['resolvedOptions']['paramsCasing']
-  paramsType: PluginReactQuery['resolvedOptions']['paramsType']
-  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
-  dataReturnType: PluginReactQuery['resolvedOptions']['client']['dataReturnType']
-  customOptions: PluginReactQuery['resolvedOptions']['customOptions']
-}
-
-type GetParamsProps = {
-  paramsCasing: PluginReactQuery['resolvedOptions']['paramsCasing']
-  paramsType: PluginReactQuery['resolvedOptions']['paramsType']
-  pathParamsType: PluginReactQuery['resolvedOptions']['pathParamsType']
-  dataReturnType: PluginReactQuery['resolvedOptions']['client']['dataReturnType']
-  typeSchemas: OperationSchemas
-}
-
-function getParams({ paramsType, paramsCasing, pathParamsType, dataReturnType, typeSchemas }: GetParamsProps) {
-  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
-  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
-
-  if (paramsType === 'object') {
-    const pathParams = getPathParams(typeSchemas.pathParams, { typed: true, casing: paramsCasing })
-
-    const children = {
-      ...pathParams,
-      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,
-    }
-
-    // Check if all children are optional or undefined
-    const allChildrenAreOptional = Object.values(children).every((child) => !child || child.optional)
-
-    return FunctionParams.factory({
-      data: {
-        mode: 'object',
-        children,
-        default: allChildrenAreOptional ? '{}' : undefined,
-      },
-      options: {
-        type: `
-{
-  query?: Partial<UseSuspenseQueryOptions<${[TData, TError, 'TData', 'TQueryKey'].join(', ')}>> & { client?: QueryClient },
-  client?: ${typeSchemas.request?.name ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }` : 'Partial<RequestConfig> & { client?: Client }'}
-}
-`,
-        default: '{}',
-      },
-    })
-  }
-
-  return FunctionParams.factory({
-    pathParams: typeSchemas.pathParams?.name
-      ? {
-          mode: pathParamsType === 'object' ? 'object' : 'inlineSpread',
-          children: getPathParams(typeSchemas.pathParams, {
-            typed: true,
-            casing: paramsCasing,
-          }),
-          default: isAllOptional(typeSchemas.pathParams?.schema) ? '{}' : undefined,
-        }
-      : undefined,
-    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<UseSuspenseQueryOptions<${[TData, TError, 'TData', 'TQueryKey'].join(', ')}>> & { client?: QueryClient },
-  client?: ${typeSchemas.request?.name ? `Partial<RequestConfig<${typeSchemas.request?.name}>> & { client?: Client }` : 'Partial<RequestConfig> & { client?: Client }'}
-}
-`,
-      default: '{}',
-    },
-  })
-}
-
-/**
- * Generates a strongly-typed React Query Suspense hook function for an OpenAPI operation.
- *
- * The generated function wraps `useSuspenseQuery`, providing type-safe parameters and return types based on the supplied OpenAPI schemas and configuration.
- *
- * @returns A React component source node containing the generated query function.
- */
-export function SuspenseQuery({
-  name,
-  queryKeyTypeName,
-  queryOptionsName,
-  queryKeyName,
-  paramsType,
-  paramsCasing,
-  pathParamsType,
-  dataReturnType,
-  typeSchemas,
-  operation,
-  customOptions,
-}: Props): FabricReactNode {
-  const TData = dataReturnType === 'data' ? typeSchemas.response.name : `ResponseConfig<${typeSchemas.response.name}>`
-  const TError = `ResponseErrorConfig<${typeSchemas.errors?.map((item) => item.name).join(' | ') || 'Error'}>`
-  const returnType = `UseSuspenseQueryResult<${['TData', TError].join(', ')}> & { queryKey: TQueryKey }`
-  const generics = [`TData = ${TData}`, `TQueryKey extends QueryKey = ${queryKeyTypeName}`]
-
-  const queryKeyParams = QueryKey.getParams({
-    pathParamsType,
-    typeSchemas,
-    paramsCasing,
-  })
-  const queryOptionsParams = QueryOptions.getParams({
-    paramsCasing,
-    paramsType,
-    pathParamsType,
-    typeSchemas,
-  })
-  const params = getParams({
-    paramsCasing,
-    paramsType,
-    pathParamsType,
-    dataReturnType,
-    typeSchemas,
-  })
-
-  const queryOptions = `${queryOptionsName}(${queryOptionsParams.toCall()})`
-
-  return (
-    <File.Source name={name} isExportable isIndexable>
-      <Function
-        name={name}
-        export
-        generics={generics.join(', ')}
-        params={params.toConstructor()}
-        JSDoc={{
-          comments: getComments(operation),
-        }}
-      >
-        {`
-       const { query: queryConfig = {}, client: config = {} } = options ?? {}
-       const { client: queryClient, ...resolvedOptions } = queryConfig
-       const queryKey = resolvedOptions?.queryKey ?? ${queryKeyName}(${queryKeyParams.toCall()})
-       ${customOptions ? `const customOptions = ${customOptions.name}({ hookName: '${name}', operationId: '${operation.getOperationId()}' })` : ''}
-
-       const query = useSuspenseQuery({
-        ...${queryOptions},${customOptions ? '\n...customOptions,' : ''}
-        ...resolvedOptions,
-        queryKey,
-       } as unknown as UseSuspenseQueryOptions, queryClient) as ${returnType}
-
-       query.queryKey = queryKey as TQueryKey
-
-       return query
-       `}
-      </Function>
-    </File.Source>
-  )
-}
-
-SuspenseQuery.getParams = getParams

package/src/components/index.ts

@@ -1,11 +0,0 @@
-export { InfiniteQuery } from './InfiniteQuery.tsx'
-export { InfiniteQueryOptions } from './InfiniteQueryOptions.tsx'
-export { Mutation } from './Mutation.tsx'
-export { MutationKey } from './MutationKey.tsx'
-export { MutationOptions } from './MutationOptions.tsx'
-export { Query } from './Query.tsx'
-export { QueryKey } from './QueryKey.tsx'
-export { QueryOptions } from './QueryOptions.tsx'
-export { SuspenseInfiniteQuery } from './SuspenseInfiniteQuery.tsx'
-export { SuspenseInfiniteQueryOptions } from './SuspenseInfiniteQueryOptions.tsx'
-export { SuspenseQuery } from './SuspenseQuery.tsx'

package/src/generators/customHookOptionsFileGenerator.tsx

@@ -1,98 +0,0 @@
-import fs from 'node:fs'
-import path from 'node:path'
-import { usePluginDriver } from '@kubb/core/hooks'
-import type { Operation } from '@kubb/oas'
-import { createReactGenerator } from '@kubb/plugin-oas/generators'
-import { useOperationManager } from '@kubb/plugin-oas/hooks'
-import { File, Function } from '@kubb/react-fabric'
-import type { PluginReactQuery } from '../types'
-
-export const customHookOptionsFileGenerator = createReactGenerator<PluginReactQuery>({
-  name: 'react-query-custom-hook-options-file',
-  Operations({ operations, generator, plugin, config }) {
-    const {
-      options,
-      options: { output },
-      name: pluginName,
-    } = plugin
-    const driver = usePluginDriver()
-
-    const { getFile } = useOperationManager(generator)
-
-    if (!options.customOptions) {
-      return null
-    }
-
-    const override = output.override ?? config.output.override ?? false
-    const { importPath, name } = options.customOptions
-
-    const root = path.resolve(config.root, config.output.path)
-
-    const reactQueryImportPath = options.query ? options.query.importPath : '@tanstack/react-query'
-
-    const getHookFilePath = (operations: Operation[]) => {
-      const firstOperation = operations[0]
-      if (firstOperation != null) {
-        // Get the file of the first generated hook
-        return getFile(firstOperation, { prefix: 'use' }).path
-      }
-      // Get the index file of the hooks directory
-      return driver.getFile({ name: 'index', extname: '.ts', pluginName }).path
-    }
-
-    const ensureExtension = (filePath: string, extname: string) => {
-      if (path.extname(filePath) === '') {
-        return filePath + extname
-      }
-      return filePath
-    }
-
-    const getExternalFile = (filePath: string, rootPath: string) => {
-      const actualFilePath = ensureExtension(filePath, '.ts')
-      return {
-        baseName: path.basename(actualFilePath) as `${string}.${string}`,
-        name: path.basename(actualFilePath, path.extname(actualFilePath)),
-        path: path.resolve(rootPath, actualFilePath),
-      }
-    }
-
-    const basePath = path.dirname(getHookFilePath(operations))
-    const file = getExternalFile(importPath, basePath)
-
-    if (fs.existsSync(file.path) && !override) {
-      return null
-    }
-
-    return (
-      <File baseName={file.baseName} path={file.path}>
-        <File.Import name={['QueryClient']} path={reactQueryImportPath} isTypeOnly />
-        <File.Import name={['useQueryClient']} path={reactQueryImportPath} />
-        <File.Import name={['HookOptions']} root={file.path} path={path.resolve(root, './index.ts')} />
-        <File.Source name={file.name} isExportable isIndexable>
-          <Function name="getCustomHookOptions" params="{ queryClient }: { queryClient: QueryClient }" returnType="Partial<HookOptions>">
-            {`return {
-              // TODO: Define custom hook options here
-              // Example:
-              // useUpdatePetHook: {
-              //   onSuccess: () => {
-              //     void queryClient.invalidateQueries({ queryKey: ['pet'] })
-              //   }
-              // }
-            }`}
-          </Function>
-          <Function
-            name={name}
-            generics="T extends keyof HookOptions"
-            params="{ hookName, operationId }: { hookName: T, operationId: string }"
-            returnType="HookOptions[T]"
-            export
-          >
-            {`const queryClient = useQueryClient()
-            const customOptions = getCustomHookOptions({ queryClient })
-            return customOptions[hookName] ?? {}`}
-          </Function>
-        </File.Source>
-      </File>
-    )
-  },
-})