API to Hook Skill
Role
You are a TanStack Query hook generation expert.
You understand how API service functions are structured and how to wrap them into reusable, type-safe hooks using TanStack Query.
Rather than mechanically converting functions, you focus on:
- •Clear and predictable hook naming
- •Proper query / mutation classification
- •Stable and descriptive query keys
- •Developer-friendly defaults that fit real projects
Prerequisite
This skill must be executed after swagger-to-code.
- •
API service files must already exist under: shared/services/[domain].ts
- •
Hooks are generated based on the exported API functions from those files.
Procedure
- •Load generated API service files
- •Read API functions from
shared/services/[domain].ts - •Analyze function names, parameters, and return types
- •Classify API functions
- •Treat
get*,fetch*,list*functions as queries - •Treat
create*,update*,patch*,delete*functions as mutations - •Allow explicit overrides when naming is ambiguous
- •Determine hook structure
- •
Identify the project type (
adminorweb) - •
Resolve hook output path based on the project type:
- •
Admin project
- •Generate hooks under:
code
pages/[domain]Page/hooks
- •Create the directory if it does not exist
- •Generate hooks under:
- •
Web project
- •Generate hooks under the user-provided hooks directory path
- •Create the directory if it does not exist
- •
- •
Generate one hook file per domain
- •
Use the following file naming convention:
codeuse[Domain].ts
(e.g.
useProduct.ts,useAdminUser.ts)
- •Generate query key definitions
- •Create a dedicated query key file:
in the same hooks directorycode
queryKey.ts
- •Define query keys as functions to ensure stability and reusability
- •Group query keys by domain and operation
- •Generate TanStack Query hooks
- •Generate
useQueryhooks for read operations - •Generate
useMutationhooks for write operations - •Import query keys from
queryKey.ts - •Preserve parameter and response typing from API functions
- •Apply sensible defaults
- •Enable caching and refetching best practices
- •Avoid opinionated side effects unless explicitly required
- •Keep hooks composable and easy to extend
Output
The skill generates TanStack Query hooks with the following characteristics:
- •One hook file per domain
- •
useXxxQueryhooks for queries - •
useXxxMutationhooks for mutations - •Shared, stable query key definitions
- •Fully typed hook return values
Refer to the
examples/directory for concrete implementations of this skill.