'use client';

import React from 'react';
import { useRouter } from 'next/navigation';
import { LeaderboardsTemplate } from '@/templates/LeaderboardsTemplate';
import { routes } from '@/lib/routing/RouteConfig';
import type { LeaderboardsViewData } from '@/lib/view-data/LeaderboardsViewData';
import { ClientWrapperProps } from '@/lib/contracts/components/ComponentContracts';

export function LeaderboardsPageClient({ viewData }: ClientWrapperProps<LeaderboardsViewData>) {
  const router = useRouter();

  const handleDriverClick = (id: string) => {
    router.push(routes.driver.detail(id));
  };

  const handleTeamClick = (id: string) => {
    router.push(routes.team.detail(id));
  };

  const handleNavigateToDrivers = () => {
    router.push(routes.leaderboards.drivers);
  };

  const handleNavigateToTeams = () => {
    router.push(routes.team.leaderboard);
  };

  return (
    <LeaderboardsTemplate
      viewData={viewData}
      onDriverClick={handleDriverClick}
      onTeamClick={handleTeamClick}
      onNavigateToDrivers={handleNavigateToDrivers}
      onNavigateToTeams={handleNavigateToTeams}
    />
  );
}