adding client support

Author: seriouslag

.github/workflows/comment-release.yml

@@ -53,7 +53,10 @@ jobs:
  github-token: ${{ secrets.GITHUB_TOKEN }}
  script: |
  const { issue: { number: issue_number }, repo: { owner, repo }, payload } = context;
- const { name: packageName, version } = require(`${process.env.GITHUB_WORKSPACE}/package.json`);
+ const fs = require('fs')
+ const jsonString = fs.readFileSync(`${process.env.GITHUB_WORKSPACE}/package.json`)
+ var packageJson = JSON.parse(jsonString)
+ const { name: packageName, version } = packageJson;
 
  const body = [
  `npm package published to pre tag.`,

README.md

@@ -21,15 +21,15 @@ Register the command to the `scripts` property in your package.json file.
 ```json
 {
  "scripts": {
- "codegen": "openapi-rq -i ./petstore.yaml -c axios"
+ "codegen": "openapi-rq -i ./petstore.yaml -c @hey-api/client-fetch"
  }
 }
 ```
 
 You can also run the command without installing it in your project using the npx command.
 
 ```bash
-$ npx --package @7nohe/openapi-react-query-codegen openapi-rq -i ./petstore.yaml -c axios
+$ npx --package @7nohe/openapi-react-query-codegen openapi-rq -i ./petstore.yaml -c @hey-api/client-fetch
 ```
 
 ## Usage
@@ -45,7 +45,7 @@ Options:
  -V, --version output the version number
  -i, --input <value> OpenAPI specification, can be a path, url or string content (required)
  -o, --output <value> Output directory (default: "openapi")
- -c, --client <value> HTTP client to generate [fetch, xhr, node, axios, angular] (default: "fetch")
+ -c, --client <value> HTTP client to generate [@hey-api/client-fetch, @hey-api/client-axios] (default: "@hey-api/client-fetch")
  --request <value> Path to custom request file
  --format <value> Process output folder with formatter? ['biome', 'prettier']
  --lint <value> Process output folder with linter? ['eslint', 'biome']

biome.json

@@ -5,6 +5,7 @@
  },
  "files": {
  "ignore": [
+ ".vscode",
  "dist",
  "examples/react-app/openapi",
  "coverage",

examples/nextjs-app/app/page.tsx

@@ -1,17 +1,18 @@
-import { prefetchUseDefaultServiceFindPets } from "@/openapi/queries/prefetch";
 import {
  HydrationBoundary,
  QueryClient,
  dehydrate,
 } from "@tanstack/react-query";
+import { prefetchUseFindPets } from "../openapi/queries/prefetch";
 import Pets from "./pets";
+import { client } from "./providers";
 
 export default async function Home() {
  const queryClient = new QueryClient();
 
- await prefetchUseDefaultServiceFindPets(queryClient, {
- limit: 10,
- tags: [],
+ await prefetchUseFindPets(queryClient, {
+ query: { tags: [], limit: 10 },
+ client: client,
  });
 
  return (

examples/nextjs-app/app/pets.tsx

@@ -1,12 +1,11 @@
 "use client";
 
-import { useDefaultServiceFindPets } from "@/openapi/queries";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import { useFindPets } from "../openapi/queries";
 
 export default function Pets() {
- const { data } = useDefaultServiceFindPets({
- limit: 10,
- tags: [],
+ const { data } = useFindPets({
+ query: { tags: [], limit: 10 },
  });
 
  return (

examples/nextjs-app/app/providers.tsx

@@ -1,9 +1,9 @@
 "use client";
 
+import { createClient } from "@hey-api/client-fetch";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 // We can not useState or useRef in a server component, which is why we are
-// extracting this part out into it's own file with 'use client' on top
-import { useState } from "react";
+// extracting this part out into
 
 function makeQueryClient() {
  return new QueryClient({
@@ -32,6 +32,10 @@ function getQueryClient() {
  return browserQueryClient;
 }
 
+export const client = createClient({
+ baseUrl: "http://localhost:4010",
+});
+
 export default function Providers({ children }: { children: React.ReactNode }) {
  // NOTE: Avoid useState when initializing the query client if you don't
  // have a suspense boundary between this and the code that may

examples/nextjs-app/package.json

@@ -9,7 +9,7 @@
  "build": "next build",
  "start": "next start",
  "lint": "next lint",
- "generate:api": "rimraf ./openapi && node ../../dist/cli.mjs -i ../petstore.yaml -c axios --request ./request.ts --format=biome --lint=biome"
+ "generate:api": "rimraf ./openapi && node ../../dist/cli.mjs -i ../petstore.yaml --request ./request.ts --format=biome --lint=biome --base http://localhost:4010"
  },
  "dependencies": {
  "@tanstack/react-query": "^5.32.1",

examples/react-app/package.json

@@ -9,7 +9,7 @@
  "dev:mock": "prism mock ../petstore.yaml --dynamic",
  "build": "tsc && vite build",
  "preview": "vite preview",
- "generate:api": "rimraf ./openapi && node ../../dist/cli.mjs -i ../petstore.yaml -c @hey-api/client-fetch --format=biome --lint=biome",
+ "generate:api": "rimraf ./openapi && node ../../dist/cli.mjs -i ../petstore.yaml --format=biome --lint=biome",
  "test:generated": "tsc -p ./tsconfig.openapi.json --noEmit"
  },
  "dependencies": {

package.json

@@ -1,5 +1,5 @@
 {
- "name": "openapi-react-query-codegen",
+ "name": "@7nohe/openapi-react-query-codegen",
  "version": "2.0.0",
  "description": "OpenAPI React Query Codegen",
  "bin": {
@@ -45,7 +45,8 @@
  "author": "Daiki Urata (@7nohe)",
  "license": "MIT",
  "dependencies": {
- "@hey-api/openapi-ts": "0.46.3",
+ "@hey-api/client-fetch": "0.1.10",
+ "@hey-api/openapi-ts": "0.49.0",
  "@types/cross-spawn": "^6.0.6",
  "cross-spawn": "^7.0.3"
  },
@@ -57,15 +58,15 @@
  "glob": "^10.3.10",
  "lefthook": "^1.6.10",
  "rimraf": "^5.0.5",
- "ts-morph": "^22.0.0",
+ "ts-morph": "^23.0.0",
  "ts-node": "^10.9.2",
- "typescript": "^5.3.3",
+ "typescript": "^5.5.3",
  "vitest": "^1.5.0"
  },
  "peerDependencies": {
  "commander": "12.x",
  "glob": "10.x",
- "ts-morph": "22.x",
+ "ts-morph": "23.x",
  "typescript": "5.x"
  },
  "engines": {