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:
Julian Tabel
2026-02-05 15:09:14 +01:00
parent 13e90eb308
commit 7c65775c8b
15 changed files with 371 additions and 19 deletions

View File

@@ -0,0 +1,31 @@
import { useQuery } from '@tanstack/react-query'
import { getGames, getGame, getGameRoutes, getRoutePokemon } from '../api/games'
export function useGames() {
return useQuery({
queryKey: ['games'],
queryFn: getGames,
})
}
export function useGame(id: number) {
return useQuery({
queryKey: ['games', id],
queryFn: () => getGame(id),
})
}
export function useGameRoutes(gameId: number) {
return useQuery({
queryKey: ['games', gameId, 'routes'],
queryFn: () => getGameRoutes(gameId),
})
}
export function useRoutePokemon(routeId: number | null) {
return useQuery({
queryKey: ['routes', routeId, 'pokemon'],
queryFn: () => getRoutePokemon(routeId!),
enabled: routeId !== null,
})
}