import { useQueryClient } from "@tanstack/react-query"; import { useLingui } from "@lingui/react/macro"; import { useServerMutation, useServerSuspenseQuery, } from "@/lib/tanstack-query/hooks"; import { getMyPrediction, getPlayerPrediction, getPredictionsLeaderboard, submitPrediction, } from "./server"; export const predictionKeys = { tournament: (tournamentId: string) => ['predictions', tournamentId] as const, mine: (tournamentId: string) => ['predictions', tournamentId, 'mine'] as const, leaderboard: (tournamentId: string) => ['predictions', tournamentId, 'leaderboard'] as const, player: (tournamentId: string, playerId: string) => ['predictions', tournamentId, 'player', playerId] as const, }; export const predictionQueries = { mine: (tournamentId: string) => ({ queryKey: predictionKeys.mine(tournamentId), queryFn: () => getMyPrediction({ data: tournamentId }), }), leaderboard: (tournamentId: string) => ({ queryKey: predictionKeys.leaderboard(tournamentId), queryFn: () => getPredictionsLeaderboard({ data: tournamentId }), }), player: (tournamentId: string, playerId: string) => ({ queryKey: predictionKeys.player(tournamentId, playerId), queryFn: () => getPlayerPrediction({ data: { tournamentId, playerId } }), }), }; export const useMyPrediction = (tournamentId: string) => useServerSuspenseQuery(predictionQueries.mine(tournamentId)); export const usePredictionsLeaderboard = (tournamentId: string) => useServerSuspenseQuery(predictionQueries.leaderboard(tournamentId)); export const usePlayerPrediction = (tournamentId: string, playerId: string) => useServerSuspenseQuery(predictionQueries.player(tournamentId, playerId)); export const useSubmitPrediction = (tournamentId: string) => { const queryClient = useQueryClient(); const { t } = useLingui(); return useServerMutation({ mutationFn: submitPrediction, successMessage: t`Prediction saved!`, onSuccess: () => { queryClient.invalidateQueries({ queryKey: predictionKeys.tournament(tournamentId), }); }, }); };