From df8711647fc2506abf006efdda2256abf25a0e23 Mon Sep 17 00:00:00 2001
From: Landon Gavin <hi@landongavin.com>
Date: Tue, 30 Apr 2024 13:08:17 -0400
Subject: [PATCH] Update README.md

Clean up readme, add link to NPMJS page with badge
---
 README.md | 26 ++++++++++++++------------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/README.md b/README.md
index d9ea44c..5721e7b 100644
--- a/README.md
+++ b/README.md
@@ -2,13 +2,15 @@
 
 > Node.js library that generates [React Query (also called TanStack Query)](https://tanstack.com/query) hooks based on an OpenAPI specification file.
 
+[![npm version](https://badge.fury.io/js/%407nohe%2Fopenapi-react-query-codegen.svg)](https://badge.fury.io/js/%407nohe%2Fopenapi-react-query-codegen)
+
 ## Features
 
-- Supports generation of custom react hooks that use React Query's `useQuery` and `useMutation` hooks
-- Supports generation of query keys for query caching
-- Supports the option to use pure TypeScript clients generated by [@hey-api/openapi-ts](https://github.com/hey-api/openapi-ts)
+- Generates custom react hooks that use React Query's `useQuery`, `useSuspenseQuery` and `useMutation` hooks
+- 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)
 
-## Install
+## Installation
 
 ```
 $ npm install -D @7nohe/openapi-react-query-codegen
@@ -58,15 +60,15 @@ Options:
   -h, --help                 display help for command
 ```
 
-## Example Usage
+### Example Usage
 
-### Command
+#### Command
 
 ```
 $ openapi-rq -i ./petstore.yaml
 ```
 
-### Output directory structure
+#### Output directory structure
 
 ```
 - openapi
@@ -81,9 +83,9 @@ $ openapi-rq -i ./petstore.yaml
 
 - [Prefetching docs](https://tanstack.com/query/latest/docs/framework/react/guides/advanced-ssr#prefetching-and-dehydrating-data)
 
-### In your app
+#### In your app
 
-#### Using the generated hooks
+##### Using the generated hooks
 
 ```tsx
 // App.tsx
@@ -102,7 +104,7 @@ function App() {
 export default App;
 ```
 
-#### Using the generated typescript client
+##### Using the generated typescript client
 
 ```tsx
 import { useQuery } from "@tanstack/react-query";
@@ -125,7 +127,7 @@ function App() {
 export default App;
 ```
 
-#### Using Suspense Hooks
+##### Using Suspense Hooks
 
 ```tsx
 // App.tsx
@@ -158,7 +160,7 @@ function App() {
 export default App;
 ```
 
-#### Runtime Configuration
+##### Runtime Configuration
 
 You can modify the default values used by the generated service calls by modifying the OpenAPI configuration singleton object.