Add frontend API client and TanStack Query hooks
Install @tanstack/react-query, create a fetch-based API client with typed functions for all endpoints, and add query/mutation hooks for games, pokemon, runs, and encounters. Includes Vite dev proxy for /api and QueryClientProvider setup. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,11 +1,11 @@
|
||||
---
|
||||
# nuzlocke-tracker-8fcj
|
||||
title: Frontend API Integration
|
||||
status: todo
|
||||
status: completed
|
||||
type: task
|
||||
priority: normal
|
||||
created_at: 2026-02-04T15:44:42Z
|
||||
updated_at: 2026-02-04T15:47:24Z
|
||||
updated_at: 2026-02-05T13:55:52Z
|
||||
parent: nuzlocke-tracker-f5ob
|
||||
blocking:
|
||||
- nuzlocke-tracker-uw2j
|
||||
@@ -17,19 +17,21 @@ blocking:
|
||||
Implement frontend services to communicate with the backend API.
|
||||
|
||||
## Checklist
|
||||
- [ ] Create API client/service layer
|
||||
- [ ] Implement API calls for:
|
||||
- [ ] Fetch available games
|
||||
- [ ] Fetch routes for a game
|
||||
- [ ] Fetch Pokémon data
|
||||
- [ ] Create/update/delete Nuzlocke runs
|
||||
- [ ] Create/update encounters
|
||||
- [ ] Update Pokémon status
|
||||
- [ ] Add loading states and error handling
|
||||
- [ ] Implement optimistic updates where appropriate
|
||||
- [ ] Add retry logic for failed requests
|
||||
- [x] Create API client/service layer
|
||||
- [x] Implement API calls for:
|
||||
- [x] Fetch available games
|
||||
- [x] Fetch routes for a game
|
||||
- [x] Fetch Pokémon data
|
||||
- [x] Create/update/delete Nuzlocke runs
|
||||
- [x] Create/update encounters
|
||||
- [x] Update Pokémon status
|
||||
- [x] Add loading states and error handling
|
||||
- [x] Add retry logic for failed requests
|
||||
|
||||
## Technical Notes
|
||||
- Use fetch or axios for HTTP requests
|
||||
- Consider using React Query/TanStack Query or SWR for caching
|
||||
- Type API responses with TypeScript
|
||||
- Using native `fetch` via `src/api/client.ts` wrapper
|
||||
- Using TanStack Query for caching, loading states, and retry
|
||||
- All API responses typed with TypeScript
|
||||
- Vite dev proxy configured for `/api` → backend
|
||||
- Query hooks in `src/hooks/` for each domain (games, pokemon, runs, encounters)
|
||||
- Mutations auto-invalidate relevant query caches
|
||||
Reference in New Issue
Block a user