@kubb/plugin-react-query
Version:
React Query hooks generator plugin for Kubb, creating type-safe API client hooks from OpenAPI specifications for React applications.
593 lines (590 loc) • 26.9 kB
JavaScript
'use strict';
var chunk7VVTPMRL_cjs = require('./chunk-7VVTPMRL.cjs');
var pluginClient = require('@kubb/plugin-client');
var components = require('@kubb/plugin-client/components');
var pluginOas = require('@kubb/plugin-oas');
var hooks = require('@kubb/plugin-oas/hooks');
var utils = require('@kubb/plugin-oas/utils');
var pluginTs = require('@kubb/plugin-ts');
var pluginZod = require('@kubb/plugin-zod');
var react = require('@kubb/react');
var remeda = require('remeda');
var jsxRuntime = require('@kubb/react/jsx-runtime');
var queryGenerator = pluginOas.createReactGenerator({
name: "react-query",
Operation({ options, operation }) {
const {
plugin: {
options: { output }
},
pluginManager
} = react.useApp();
const oas = hooks.useOas();
const { getSchemas, getName, getFile } = hooks.useOperationManager();
const isQuery = typeof options.query === "boolean" ? true : options.query?.methods.some((method) => operation.method === method);
const isMutation = remeda.difference(options.mutation ? options.mutation.methods : [], options.query ? options.query.methods : []).some(
(method) => operation.method === method
);
const importPath = options.query ? options.query.importPath : "@tanstack/react-query";
const query = {
name: getName(operation, { type: "function", prefix: "use" }),
typeName: getName(operation, { type: "type" }),
file: getFile(operation, { prefix: "use" })
};
const hasClientPlugin = !!pluginManager.getPluginByKey([pluginClient.pluginClientName]);
const client = {
name: hasClientPlugin ? getName(operation, {
type: "function",
pluginKey: [pluginClient.pluginClientName]
}) : getName(operation, {
type: "function"
}),
file: getFile(operation, { pluginKey: [pluginClient.pluginClientName] })
};
const queryOptions = {
name: getName(operation, { type: "function", suffix: "QueryOptions" })
};
const queryKey = {
name: getName(operation, { type: "const", suffix: "QueryKey" }),
typeName: getName(operation, { type: "type", suffix: "QueryKey" })
};
const type = {
file: getFile(operation, { pluginKey: [pluginTs.pluginTsName] }),
//todo remove type?
schemas: getSchemas(operation, { pluginKey: [pluginTs.pluginTsName], type: "type" })
};
const zod = {
// grouping is coming from react-query instead of zod option, we need to pass the options of zod instead
file: getFile(operation, { pluginKey: [pluginZod.pluginZodName] }),
schemas: getSchemas(operation, { pluginKey: [pluginZod.pluginZodName], type: "function" })
};
if (!isQuery || isMutation) {
return null;
}
return /* @__PURE__ */ jsxRuntime.jsxs(
react.File,
{
baseName: query.file.baseName,
path: query.file.path,
meta: query.file.meta,
banner: utils.getBanner({ oas, output, config: pluginManager.config }),
footer: utils.getFooter({ oas, output }),
children: [
options.parser === "zod" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [zod.schemas.response.name, zod.schemas.request?.name].filter(Boolean), root: query.file.path, path: zod.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: "fetch", path: options.client.importPath }),
hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [client.name], root: query.file.path, path: client.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["RequestConfig", "ResponseErrorConfig"], path: options.client.importPath, isTypeOnly: true }),
options.client.dataReturnType === "full" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["ResponseConfig"], path: options.client.importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
react.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: true
}
),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.QueryKey,
{
name: queryKey.name,
typeName: queryKey.typeName,
operation,
pathParamsType: options.pathParamsType,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
transformer: options.queryKey
}
),
!hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(
components.Client,
{
name: client.name,
baseURL: options.client.baseURL,
operation,
typeSchemas: type.schemas,
zodSchemas: zod.schemas,
dataReturnType: options.client.dataReturnType,
paramsType: options.paramsType,
paramsCasing: options.paramsCasing,
pathParamsType: options.pathParamsType,
parser: options.parser
}
),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["queryOptions"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.QueryOptions,
{
name: queryOptions.name,
clientName: client.name,
queryKeyName: queryKey.name,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
dataReturnType: options.client.dataReturnType
}
),
options.query && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["useQuery"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["QueryKey", "QueryClient", "QueryObserverOptions", "UseQueryResult", "QueryClient"], path: importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.Query,
{
name: query.name,
queryOptionsName: queryOptions.name,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
operation,
dataReturnType: options.client.dataReturnType,
queryKeyName: queryKey.name,
queryKeyTypeName: queryKey.typeName
}
)
] })
]
}
);
}
});
var mutationGenerator = pluginOas.createReactGenerator({
name: "react-query",
Operation({ options, operation }) {
const {
plugin: {
options: { output }
},
pluginManager
} = react.useApp();
const oas = hooks.useOas();
const { getSchemas, getName, getFile } = hooks.useOperationManager();
const isQuery = !!options.query && options.query?.methods.some((method) => operation.method === method);
const isMutation = !isQuery && remeda.difference(options.mutation ? options.mutation.methods : [], options.query ? options.query.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: [pluginTs.pluginTsName] }),
//todo remove type?
schemas: getSchemas(operation, { pluginKey: [pluginTs.pluginTsName], type: "type" })
};
const zod = {
file: getFile(operation, { pluginKey: [pluginZod.pluginZodName] }),
schemas: getSchemas(operation, { pluginKey: [pluginZod.pluginZodName], type: "function" })
};
const hasClientPlugin = !!pluginManager.getPluginByKey([pluginClient.pluginClientName]);
const client = {
name: hasClientPlugin ? getName(operation, {
type: "function",
pluginKey: [pluginClient.pluginClientName]
}) : getName(operation, {
type: "function"
}),
file: getFile(operation, { pluginKey: [pluginClient.pluginClientName] })
};
const mutationKey = {
name: getName(operation, { type: "const", suffix: "MutationKey" }),
typeName: getName(operation, { type: "type", suffix: "MutationKey" })
};
if (!isMutation) {
return null;
}
return /* @__PURE__ */ jsxRuntime.jsxs(
react.File,
{
baseName: mutation.file.baseName,
path: mutation.file.path,
meta: mutation.file.meta,
banner: utils.getBanner({ oas, output, config: pluginManager.config }),
footer: utils.getFooter({ oas, output }),
children: [
options.parser === "zod" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [zod.schemas.response.name, zod.schemas.request?.name].filter(Boolean), root: mutation.file.path, path: zod.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: "fetch", path: options.client.importPath }),
!!hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [client.name], root: mutation.file.path, path: client.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["RequestConfig", "ResponseConfig", "ResponseErrorConfig"], path: options.client.importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
react.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: true
}
),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.MutationKey,
{
name: mutationKey.name,
typeName: mutationKey.typeName,
operation,
pathParamsType: options.pathParamsType,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
transformer: options.mutationKey
}
),
!hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(
components.Client,
{
name: client.name,
baseURL: options.client.baseURL,
operation,
typeSchemas: type.schemas,
zodSchemas: zod.schemas,
dataReturnType: options.client.dataReturnType,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
parser: options.parser
}
),
options.mutation && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["useMutation"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["UseMutationOptions", "QueryClient"], path: importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.Mutation,
{
name: mutation.name,
clientName: client.name,
typeName: mutation.typeName,
typeSchemas: type.schemas,
operation,
dataReturnType: options.client.dataReturnType,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
mutationKeyName: mutationKey.name
}
)
] })
]
}
);
}
});
var infiniteQueryGenerator = pluginOas.createReactGenerator({
name: "react-infinite-query",
Operation({ options, operation }) {
const {
plugin: {
options: { output }
},
pluginManager
} = react.useApp();
const oas = hooks.useOas();
const { getSchemas, getName, getFile } = hooks.useOperationManager();
const isQuery = typeof options.query === "boolean" ? true : options.query?.methods.some((method) => operation.method === method);
const isMutation = remeda.difference(options.mutation ? options.mutation.methods : [], options.query ? options.query.methods : []).some(
(method) => operation.method === method
);
const isInfinite = !!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 hasClientPlugin = !!pluginManager.getPluginByKey([pluginClient.pluginClientName]);
const client = {
name: hasClientPlugin ? getName(operation, {
type: "function",
pluginKey: [pluginClient.pluginClientName]
}) : getName(operation, {
type: "function",
suffix: "infinite"
}),
file: getFile(operation, { pluginKey: [pluginClient.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: [pluginTs.pluginTsName] }),
//todo remove type?
schemas: getSchemas(operation, { pluginKey: [pluginTs.pluginTsName], type: "type" })
};
const zod = {
file: getFile(operation, { pluginKey: [pluginZod.pluginZodName] }),
schemas: getSchemas(operation, { pluginKey: [pluginZod.pluginZodName], type: "function" })
};
if (!isQuery || isMutation || !isInfinite) {
return null;
}
return /* @__PURE__ */ jsxRuntime.jsxs(
react.File,
{
baseName: query.file.baseName,
path: query.file.path,
meta: query.file.meta,
banner: utils.getBanner({ oas, output, config: pluginManager.config }),
footer: utils.getFooter({ oas, output }),
children: [
options.parser === "zod" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [zod.schemas.response.name, zod.schemas.request?.name].filter(Boolean), root: query.file.path, path: zod.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: "fetch", path: options.client.importPath }),
hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [client.name], root: query.file.path, path: client.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["RequestConfig", "ResponseErrorConfig"], path: options.client.importPath, isTypeOnly: true }),
options.client.dataReturnType === "full" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["ResponseConfig"], path: options.client.importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
react.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: true
}
),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.QueryKey,
{
name: queryKey.name,
typeName: queryKey.typeName,
operation,
paramsCasing: options.paramsCasing,
pathParamsType: options.pathParamsType,
typeSchemas: type.schemas,
transformer: options.queryKey
}
),
!hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(
components.Client,
{
name: client.name,
baseURL: options.client.baseURL,
operation,
typeSchemas: type.schemas,
zodSchemas: zod.schemas,
dataReturnType: options.client.dataReturnType,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
parser: options.parser
}
),
options.infinite && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["InfiniteData"], isTypeOnly: true, path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["infiniteQueryOptions"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.InfiniteQueryOptions,
{
name: queryOptions.name,
clientName: client.name,
queryKeyName: queryKey.name,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
dataReturnType: options.client.dataReturnType,
cursorParam: options.infinite.cursorParam,
initialPageParam: options.infinite.initialPageParam,
queryParam: options.infinite.queryParam
}
)
] }),
options.infinite && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["useInfiniteQuery"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["QueryKey", "QueryClient", "InfiniteQueryObserverOptions", "UseInfiniteQueryResult"], path: importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.InfiniteQuery,
{
name: query.name,
queryOptionsName: queryOptions.name,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
operation,
dataReturnType: options.client.dataReturnType,
queryKeyName: queryKey.name,
queryKeyTypeName: queryKey.typeName
}
)
] })
]
}
);
}
});
var suspenseQueryGenerator = pluginOas.createReactGenerator({
name: "react-suspense-query",
Operation({ options, operation }) {
const {
plugin: {
options: { output }
},
pluginManager
} = react.useApp();
const oas = hooks.useOas();
const { getSchemas, getName, getFile } = hooks.useOperationManager();
const isQuery = typeof options.query === "boolean" ? true : options.query?.methods.some((method) => operation.method === method);
const isMutation = remeda.difference(options.mutation ? options.mutation.methods : [], options.query ? options.query.methods : []).some(
(method) => operation.method === method
);
const isSuspense = !!options.suspense;
const importPath = options.query ? options.query.importPath : "@tanstack/react-query";
const query = {
name: getName(operation, { type: "function", prefix: "use", suffix: "suspense" }),
typeName: getName(operation, { type: "type" }),
file: getFile(operation, { prefix: "use", suffix: "suspense" })
};
const hasClientPlugin = !!pluginManager.getPluginByKey([pluginClient.pluginClientName]);
const client = {
name: hasClientPlugin ? getName(operation, {
type: "function",
pluginKey: [pluginClient.pluginClientName]
}) : getName(operation, {
type: "function",
suffix: "suspense"
}),
file: getFile(operation, { pluginKey: [pluginClient.pluginClientName] })
};
const queryOptions = {
name: getName(operation, { type: "function", suffix: "SuspenseQueryOptions" })
};
const queryKey = {
name: getName(operation, { type: "const", suffix: "SuspenseQueryKey" }),
typeName: getName(operation, { type: "type", suffix: "SuspenseQueryKey" })
};
const type = {
file: getFile(operation, { pluginKey: [pluginTs.pluginTsName] }),
//todo remove type?
schemas: getSchemas(operation, { pluginKey: [pluginTs.pluginTsName], type: "type" })
};
const zod = {
file: getFile(operation, { pluginKey: [pluginZod.pluginZodName] }),
schemas: getSchemas(operation, { pluginKey: [pluginZod.pluginZodName], type: "function" })
};
if (!isQuery || isMutation || !isSuspense) {
return null;
}
return /* @__PURE__ */ jsxRuntime.jsxs(
react.File,
{
baseName: query.file.baseName,
path: query.file.path,
meta: query.file.meta,
banner: utils.getBanner({ oas, output, config: pluginManager.config }),
footer: utils.getFooter({ oas, output }),
children: [
options.parser === "zod" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [zod.schemas.response.name, zod.schemas.request?.name].filter(Boolean), root: query.file.path, path: zod.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: "fetch", path: options.client.importPath }),
hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: [client.name], root: query.file.path, path: client.file.path }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["RequestConfig", "ResponseErrorConfig"], path: options.client.importPath, isTypeOnly: true }),
options.client.dataReturnType === "full" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["ResponseConfig"], path: options.client.importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
react.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: true
}
),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.QueryKey,
{
name: queryKey.name,
typeName: queryKey.typeName,
operation,
paramsCasing: options.paramsCasing,
pathParamsType: options.pathParamsType,
typeSchemas: type.schemas,
transformer: options.queryKey
}
),
!hasClientPlugin && /* @__PURE__ */ jsxRuntime.jsx(
components.Client,
{
name: client.name,
baseURL: options.client.baseURL,
operation,
typeSchemas: type.schemas,
zodSchemas: zod.schemas,
dataReturnType: options.client.dataReturnType,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
parser: options.parser
}
),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["queryOptions"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.QueryOptions,
{
name: queryOptions.name,
clientName: client.name,
queryKeyName: queryKey.name,
typeSchemas: type.schemas,
paramsCasing: options.paramsCasing,
paramsType: options.paramsType,
pathParamsType: options.pathParamsType,
dataReturnType: options.client.dataReturnType
}
),
options.suspense && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["useSuspenseQuery"], path: importPath }),
/* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["QueryKey", "QueryClient", "UseSuspenseQueryOptions", "UseSuspenseQueryResult"], path: importPath, isTypeOnly: true }),
options.client.dataReturnType === "full" && /* @__PURE__ */ jsxRuntime.jsx(react.File.Import, { name: ["ResponseConfig"], path: options.client.importPath, isTypeOnly: true }),
/* @__PURE__ */ jsxRuntime.jsx(
chunk7VVTPMRL_cjs.SuspenseQuery,
{
name: query.name,
queryOptionsName: queryOptions.name,
typeSchemas: type.schemas,
paramsType: options.paramsType,
paramsCasing: options.paramsCasing,
pathParamsType: options.pathParamsType,
operation,
dataReturnType: options.client.dataReturnType,
queryKeyName: queryKey.name,
queryKeyTypeName: queryKey.typeName
}
)
] })
]
}
);
}
});
exports.infiniteQueryGenerator = infiniteQueryGenerator;
exports.mutationGenerator = mutationGenerator;
exports.queryGenerator = queryGenerator;
exports.suspenseQueryGenerator = suspenseQueryGenerator;
//# sourceMappingURL=chunk-PIAL3C5M.cjs.map
//# sourceMappingURL=chunk-PIAL3C5M.cjs.map