import { createFileRoute, redirect } from "@tanstack/react-router";
import { tournamentQueries } from "@/features/tournaments/queries";
import ManageTournament from "@/features/tournaments/components/manage-tournament";
import { ensureServerQueryData } from "@/lib/tanstack-query/utils/ensure";

export const Route = createFileRoute("/_authed/admin/tournaments/$id")({
  beforeLoad: async ({ context, params }) => {
    const { queryClient } = context;
    const tournament = await ensureServerQueryData(
      queryClient,
      tournamentQueries.details(params.id)
    );
    if (!tournament) throw redirect({ to: "/admin/tournaments" });
    return {
      tournament,
    };
  },
  loader: ({ context }) => ({
    header: {
      withBackButton: true,
      title: `Manage ${context.tournament.name}`,
    },
    withPadding: false,
  }),
  component: RouteComponent,
});

function RouteComponent() {
  const { id } = Route.useParams();
  return <ManageTournament tournamentId={id} />;
}