Files
nuzlocke-tracker/frontend/src/hooks/useEncounters.ts
Julian Tabel 7c65775c8b 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>
2026-02-05 15:09:14 +01:00

44 lines
1.1 KiB
TypeScript

import { useMutation, useQueryClient } from '@tanstack/react-query'
import {
createEncounter,
updateEncounter,
deleteEncounter,
} from '../api/encounters'
import type { CreateEncounterInput, UpdateEncounterInput } from '../types/game'
export function useCreateEncounter(runId: number) {
const queryClient = useQueryClient()
return useMutation({
mutationFn: (data: CreateEncounterInput) => createEncounter(runId, data),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['runs', runId] })
},
})
}
export function useUpdateEncounter(runId: number) {
const queryClient = useQueryClient()
return useMutation({
mutationFn: ({
id,
data,
}: {
id: number
data: UpdateEncounterInput
}) => updateEncounter(id, data),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['runs', runId] })
},
})
}
export function useDeleteEncounter(runId: number) {
const queryClient = useQueryClient()
return useMutation({
mutationFn: (id: number) => deleteEncounter(id),
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ['runs', runId] })
},
})
}