@7nohe/openapi-react-query-codegen 1.6.1 → 1.6.2

package/README.md

@@ -7,6 +7,7 @@
 ## Features
 
 - Generates custom react hooks that use React Query's `useQuery`, `useSuspenseQuery`, `useMutation` and `useInfiniteQuery` hooks
+- Generates custom functions that use React Query's `ensureQueryData` and `prefetchQuery` functions
 - Generates query keys and functions for query caching
 - Generates pure TypeScript clients generated by [@hey-api/openapi-ts](https://github.com/hey-api/openapi-ts)
 
@@ -79,9 +80,10 @@ $ openapi-rq -i ./petstore.yaml
   - queries
     - index.ts <- main file that exports common types, variables, and queries. Does not export suspense or prefetch hooks
     - common.ts <- common types
+    - ensureQueryData.ts <- generated ensureQueryData functions
     - queries.ts <- generated query hooks
     - suspenses.ts <- generated suspense hooks
-    - prefetch.ts <- generated prefetch hooks learn more about prefetching in in link below
+    - prefetch.ts <- generated prefetch functions learn more about prefetching in in link below
   - requests <- output code generated by @hey-api/openapi-ts
 ```
 

package/dist/cli.mjs

@@ -36,7 +36,7 @@ async function setupProgram() {
         .addOption(new Option("--schemaType <value>", "Type of JSON schema [Default: 'json']").choices(["form", "json"]))
         .option("--pageParam <value>", "Name of the query parameter used for pagination", "page")
         .option("--nextPageParam <value>", "Name of the response parameter used for next page", "nextPage")
-        .option("--initialPageParam <value>", "Initial page value to query", "initialPageParam")
+        .option("--initialPageParam <value>", "Initial page value to query", "1")
         .parse();
     const options = program.opts();
     await generate(options, version);

package/dist/constants.mjs

@@ -10,4 +10,5 @@ export const OpenApiRqFiles = {
     suspense: "suspense",
     index: "index",
     prefetch: "prefetch",
+    ensureQueryData: "ensureQueryData",
 };

package/dist/createExports.mjs

@@ -1,4 +1,4 @@
-import { createPrefetch } from "./createPrefetch.mjs";
+import { createPrefetchOrEnsure } from "./createPrefetchOrEnsure.mjs";
 import { createUseMutation } from "./createUseMutation.mjs";
 import { createUseQuery } from "./createUseQuery.mjs";
 export const createExports = (service, pageParam, nextPageParam, initialPageParam) => {
@@ -10,7 +10,8 @@ export const createExports = (service, pageParam, nextPageParam, initialPagePara
     const allPatch = methods.filter((m) => m.httpMethodName.toUpperCase().includes("PATCH"));
     const allDelete = methods.filter((m) => m.httpMethodName.toUpperCase().includes("DELETE"));
     const allGetQueries = allGet.map((m) => createUseQuery(m, pageParam, nextPageParam, initialPageParam));
-    const allPrefetchQueries = allGet.map((m) => createPrefetch(m));
+    const allPrefetchQueries = allGet.map((m) => createPrefetchOrEnsure({ ...m, functionType: "prefetch" }));
+    const allEnsureQueries = allGet.map((m) => createPrefetchOrEnsure({ ...m, functionType: "ensure" }));
     const allPostMutations = allPost.map((m) => createUseMutation(m));
     const allPutMutations = allPut.map((m) => createUseMutation(m));
     const allPatchMutations = allPatch.map((m) => createUseMutation(m));
@@ -44,9 +45,8 @@ export const createExports = (service, pageParam, nextPageParam, initialPagePara
         suspenseQueryHook,
     ]);
     const suspenseExports = [...suspenseQueries];
-    const allPrefetches = allPrefetchQueries.flatMap(({ prefetchHook }) => [
-        prefetchHook,
-    ]);
+    const allPrefetches = allPrefetchQueries.flatMap(({ hook }) => [hook]);
+    const allEnsures = allEnsureQueries.flatMap(({ hook }) => [hook]);
     const allPrefetchExports = [...allPrefetches];
     return {
         /**
@@ -69,5 +69,9 @@ export const createExports = (service, pageParam, nextPageParam, initialPagePara
          * Prefetch exports are the hooks that are used in the prefetch components
          */
         allPrefetchExports,
+        /**
+         * Ensure exports are the hooks that are used in the loader components
+         */
+        allEnsures,
     };
 };

package/dist/{createPrefetch.mjs → createPrefetchOrEnsure.mjs}

@@ -3,12 +3,15 @@ import { BuildCommonTypeName, extractPropertiesFromObjectParam, getNameFromMetho
 import { createQueryKeyFromMethod, getQueryKeyFnName, getRequestParamFromMethod, hookNameFromMethod, } from "./createUseQuery.mjs";
 import { addJSDocToNode } from "./util.mjs";
 /**
- * Creates a prefetch function for a query
+ * Creates a prefetch/ensure function for a query
  */
-function createPrefetchHook({ requestParams, method, className, }) {
+function createPrefetchOrEnsureHook({ requestParams, method, className, functionType, }) {
     const methodName = getNameFromMethod(method);
     const queryName = hookNameFromMethod({ method, className });
-    const customHookName = `prefetch${queryName.charAt(0).toUpperCase() + queryName.slice(1)}`;
+    let customHookName = `prefetch${queryName.charAt(0).toUpperCase() + queryName.slice(1)}`;
+    if (functionType === "ensure") {
+        customHookName = `ensure${queryName.charAt(0).toUpperCase() + queryName.slice(1)}Data`;
+    }
     const queryKey = createQueryKeyFromMethod({ method, className });
     // const
     const hookExport = ts.factory.createVariableStatement(
@@ -17,7 +20,7 @@ function createPrefetchHook({ requestParams, method, className, }) {
         ts.factory.createVariableDeclaration(ts.factory.createIdentifier(customHookName), undefined, undefined, ts.factory.createArrowFunction(undefined, undefined, [
             ts.factory.createParameterDeclaration(undefined, undefined, "queryClient", undefined, ts.factory.createTypeReferenceNode(ts.factory.createIdentifier("QueryClient"))),
             ...requestParams,
-        ], undefined, ts.factory.createToken(ts.SyntaxKind.EqualsGreaterThanToken), ts.factory.createCallExpression(ts.factory.createIdentifier("queryClient.prefetchQuery"), undefined, [
+        ], undefined, ts.factory.createToken(ts.SyntaxKind.EqualsGreaterThanToken), ts.factory.createCallExpression(ts.factory.createIdentifier(`queryClient.${functionType === "prefetch" ? "prefetchQuery" : "ensureQueryData"}`), undefined, [
             ts.factory.createObjectLiteralExpression([
                 ts.factory.createPropertyAssignment(ts.factory.createIdentifier("queryKey"), ts.factory.createCallExpression(BuildCommonTypeName(getQueryKeyFnName(queryKey)), undefined, method.getParameters().length
                     ? [
@@ -38,16 +41,17 @@ function createPrefetchHook({ requestParams, method, className, }) {
     ], ts.NodeFlags.Const));
     return hookExport;
 }
-export const createPrefetch = ({ className, method, jsDoc, }) => {
+export const createPrefetchOrEnsure = ({ className, method, jsDoc, functionType, }) => {
     const requestParam = getRequestParamFromMethod(method);
     const requestParams = requestParam ? [requestParam] : [];
-    const prefetchHook = createPrefetchHook({
+    const prefetchOrEnsureHook = createPrefetchOrEnsureHook({
         requestParams,
         method,
         className,
+        functionType,
     });
-    const hookWithJsDoc = addJSDocToNode(prefetchHook, jsDoc);
+    const hookWithJsDoc = addJSDocToNode(prefetchOrEnsureHook, jsDoc);
     return {
-        prefetchHook: hookWithJsDoc,
+        hook: hookWithJsDoc,
     };
 };

package/dist/createSource.mjs

@@ -30,6 +30,7 @@ const createSourceFile = async (outputPath, serviceEndName, pageParam, nextPageP
     const suspenseSource = ts.factory.createSourceFile([commonImport, ...imports, ...exports.suspenseExports], ts.factory.createToken(ts.SyntaxKind.EndOfFileToken), ts.NodeFlags.None);
     const indexSource = ts.factory.createSourceFile([commonExport, queriesExport], ts.factory.createToken(ts.SyntaxKind.EndOfFileToken), ts.NodeFlags.None);
     const prefetchSource = ts.factory.createSourceFile([commonImport, ...imports, ...exports.allPrefetchExports], ts.factory.createToken(ts.SyntaxKind.EndOfFileToken), ts.NodeFlags.None);
+    const ensureSource = ts.factory.createSourceFile([commonImport, ...imports, ...exports.allEnsures], ts.factory.createToken(ts.SyntaxKind.EndOfFileToken), ts.NodeFlags.None);
     return {
         commonSource,
         infiniteQueriesSource,
@@ -37,6 +38,7 @@ const createSourceFile = async (outputPath, serviceEndName, pageParam, nextPageP
         suspenseSource,
         indexSource,
         prefetchSource,
+        ensureSource,
     };
 };
 export const createSource = async ({ outputPath, version, serviceEndName, pageParam, nextPageParam, initialPageParam, }) => {
@@ -46,11 +48,12 @@ export const createSource = async ({ outputPath, version, serviceEndName, pagePa
     const suspenseFile = ts.createSourceFile(`${OpenApiRqFiles.suspense}.ts`, "", ts.ScriptTarget.Latest, false, ts.ScriptKind.TS);
     const indexFile = ts.createSourceFile(`${OpenApiRqFiles.index}.ts`, "", ts.ScriptTarget.Latest, false, ts.ScriptKind.TS);
     const prefetchFile = ts.createSourceFile(`${OpenApiRqFiles.prefetch}.ts`, "", ts.ScriptTarget.Latest, false, ts.ScriptKind.TS);
+    const ensureQueryDataFile = ts.createSourceFile(`${OpenApiRqFiles.ensureQueryData}.ts`, "", ts.ScriptTarget.Latest, false, ts.ScriptKind.TS);
     const printer = ts.createPrinter({
         newLine: ts.NewLineKind.LineFeed,
         removeComments: false,
     });
-    const { commonSource, mainSource, infiniteQueriesSource, suspenseSource, indexSource, prefetchSource, } = await createSourceFile(outputPath, serviceEndName, pageParam, nextPageParam, initialPageParam);
+    const { commonSource, mainSource, infiniteQueriesSource, suspenseSource, indexSource, prefetchSource, ensureSource, } = await createSourceFile(outputPath, serviceEndName, pageParam, nextPageParam, initialPageParam);
     const comment = `// generated with @7nohe/openapi-react-query-codegen@${version} \n\n`;
     const commonResult = comment +
         printer.printNode(ts.EmitHint.Unspecified, commonSource, commonFile);
@@ -64,6 +67,8 @@ export const createSource = async ({ outputPath, version, serviceEndName, pagePa
         printer.printNode(ts.EmitHint.Unspecified, indexSource, indexFile);
     const prefetchResult = comment +
         printer.printNode(ts.EmitHint.Unspecified, prefetchSource, prefetchFile);
+    const enqureResult = comment +
+        printer.printNode(ts.EmitHint.Unspecified, ensureSource, ensureQueryDataFile);
     return [
         {
             name: `${OpenApiRqFiles.index}.ts`,
@@ -89,5 +94,9 @@ export const createSource = async ({ outputPath, version, serviceEndName, pagePa
             name: `${OpenApiRqFiles.prefetch}.ts`,
             content: prefetchResult,
         },
+        {
+            name: `${OpenApiRqFiles.ensureQueryData}.ts`,
+            content: enqureResult,
+        },
     ];
 };

package/dist/createUseQuery.mjs

@@ -85,6 +85,30 @@ export function createQueryKeyFromMethod({ method, className, }) {
     const queryKey = `${customHookName}Key`;
     return queryKey;
 }
+/**
+ * Extracts the type of the next page parameter from the given properties.
+ *
+ * @param properties The properties to search through.
+ * @param nextPageParam The name of the next page parameter.
+ * @returns The type of the next page parameter, if found.
+ */
+function findNextPageParamType(properties, nextPageParam) {
+    if (!properties)
+        return undefined;
+    for (const property of properties) {
+        if (property.getName() === nextPageParam) {
+            return property?.getDeclarations()?.at(0)?.getType()?.getText();
+        }
+        const type = property.getDeclarations().at(0)?.getType();
+        const nestedProperties = type?.getProperties();
+        if (!type?.isObject() || type.isArray())
+            continue;
+        const result = findNextPageParamType(nestedProperties, nextPageParam);
+        if (result)
+            return result;
+    }
+    return undefined;
+}
 /**
  * Creates a custom hook for a query
  * @param queryString The type of query to use from react-query
@@ -101,6 +125,11 @@ export function createQueryHook({ queryString, suffix, responseDataType, request
     const isInfiniteQuery = queryString === "useInfiniteQuery";
     const responseDataTypeRef = responseDataType.default;
     const responseDataTypeIdentifier = responseDataTypeRef.typeName;
+    const arg = method.getReturnType().getTypeArguments().at(0);
+    const nextPageParamTypePropetires = arg?.getProperties();
+    const nextPageParamType = arg?.isObject() && nextPageParam
+        ? findNextPageParamType(nextPageParamTypePropetires, nextPageParam.split(".").at(-1) ?? "")
+        : undefined;
     const hookExport = ts.factory.createVariableStatement([ts.factory.createModifier(ts.SyntaxKind.ExportKeyword)], ts.factory.createVariableDeclarationList([
         ts.factory.createVariableDeclaration(ts.factory.createIdentifier(`${customHookName}${suffix}`), undefined, undefined, ts.factory.createArrowFunction(undefined, ts.factory.createNodeArray([
             isInfiniteQuery
@@ -151,11 +180,15 @@ export function createQueryHook({ queryString, suffix, responseDataType, request
                         ts.factory.createObjectLiteralExpression(method
                             .getParameters()
                             .flatMap((param) => extractPropertiesFromObjectParam(param).map((p) => p.name === pageParam
-                            ? ts.factory.createPropertyAssignment(ts.factory.createIdentifier(p.name), ts.factory.createAsExpression(ts.factory.createIdentifier("pageParam"), ts.factory.createKeywordTypeNode(ts.SyntaxKind.NumberKeyword)))
+                            ? ts.factory.createPropertyAssignment(ts.factory.createIdentifier(p.name), ts.factory.createAsExpression(ts.factory.createIdentifier("pageParam"), ts.factory.createKeywordTypeNode(p.type?.getText() === "number"
+                                ? ts.SyntaxKind
+                                    .NumberKeyword
+                                : ts.SyntaxKind
+                                    .StringKeyword)))
                             : ts.factory.createShorthandPropertyAssignment(ts.factory.createIdentifier(p.name))))),
                     ]
                     : undefined), ts.factory.createTypeReferenceNode(TData)))),
-                ...createInfiniteQueryParams(pageParam, nextPageParam, initialPageParam),
+                ...createInfiniteQueryParams(pageParam, nextPageParam, initialPageParam, nextPageParamType),
                 ts.factory.createSpreadAssignment(ts.factory.createIdentifier("options")),
             ]),
         ]))),
@@ -258,7 +291,7 @@ function queryKeyFn(queryKey, method) {
             : ts.factory.createArrayLiteralExpression([])))),
     ], false);
 }
-function createInfiniteQueryParams(pageParam, nextPageParam, initialPageParam = "1") {
+function createInfiniteQueryParams(pageParam, nextPageParam, initialPageParam = "1", type) {
     if (pageParam === undefined || nextPageParam === undefined) {
         return [];
     }
@@ -272,6 +305,8 @@ function createInfiniteQueryParams(pageParam, nextPageParam, initialPageParam =
             return ts.factory.createTypeLiteralNode([
                 ts.factory.createPropertySignature(undefined, ts.factory.createIdentifier(segment), undefined, acc),
             ]);
-        }, ts.factory.createKeywordTypeNode(ts.SyntaxKind.NumberKeyword)))), ts.factory.createIdentifier(nextPageParam)))),
+        }, ts.factory.createKeywordTypeNode(type === "number"
+            ? ts.SyntaxKind.NumberKeyword
+            : ts.SyntaxKind.StringKeyword)))), ts.factory.createIdentifier(nextPageParam)))),
     ];
 }

package/dist/generate.mjs

@@ -27,6 +27,7 @@ export async function generate(options, version) {
             export: true,
             response: formattedOptions.serviceResponse,
             asClass: true,
+            operationId: formattedOptions.operationId ?? false,
         },
         types: {
             dates: formattedOptions.useDateType,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@7nohe/openapi-react-query-codegen",
-  "version": "1.6.1",
+  "version": "1.6.2",
   "description": "OpenAPI React Query Codegen",
   "keywords": [
     "codegen",
@@ -61,7 +61,7 @@
     "lint": "biome check .",
     "lint:fix": "biome check --write .",
     "preview": "npm run build && npm -C examples/react-app run generate:api",
-    "release": "npx git-ensure -a && npx bumpp --commit --tag --push",
+    "release": "npx git-ensure -a -b v1 && npx bumpp --commit --tag --push",
     "snapshot": "vitest --update",
     "test": "vitest --coverage.enabled true"
   }