import { useServerMutation, useServerSuspenseQuery } from "@/lib/tanstack-query/hooks";
import { getMatchReactions, toggleMatchReaction } from "@/features/matches/server";
import { useQueryClient } from "@tanstack/react-query";

export const reactionKeys = {
  match: (matchId: string) => ['reactions', 'match', matchId] as const,
};

export const reactionQueries = {
  match: (matchId: string) => ({
    queryKey: reactionKeys.match(matchId),
    queryFn: () => getMatchReactions({ data: matchId }),
  }),
};

export const useMatchReactions = (matchId: string) =>
  useServerSuspenseQuery(reactionQueries.match(matchId));

export const useToggleMatchReaction = (matchId: string) => {
  const queryClient = useQueryClient();

  return useServerMutation({
    mutationFn: toggleMatchReaction,
    onSuccess: () => {
      queryClient.invalidateQueries({
        queryKey: reactionKeys.match(matchId)
      });
    },
  });
};
