40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import React, { useState } from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import { TeamRankingsTemplate } from '@/templates/TeamRankingsTemplate';
|
|
import { routes } from '@/lib/routing/RouteConfig';
|
|
import type { TeamRankingsViewData } from '@/lib/view-data/TeamRankingsViewData';
|
|
import { ClientWrapperProps } from '@/lib/contracts/components/ComponentContracts';
|
|
|
|
export function TeamRankingsPageClient({ viewData }: ClientWrapperProps<TeamRankingsViewData>) {
|
|
const router = useRouter();
|
|
const [searchQuery, setSearchQuery] = useState('');
|
|
|
|
const handleTeamClick = (id: string) => {
|
|
router.push(routes.team.detail(id));
|
|
};
|
|
|
|
const handleBackToLeaderboards = () => {
|
|
router.push(routes.leaderboards.root);
|
|
};
|
|
|
|
const filteredTeams = viewData.teams.filter(team =>
|
|
team.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
|
|
team.tag.toLowerCase().includes(searchQuery.toLowerCase())
|
|
);
|
|
|
|
return (
|
|
<TeamRankingsTemplate
|
|
viewData={{
|
|
...viewData,
|
|
teams: filteredTeams
|
|
}}
|
|
searchQuery={searchQuery}
|
|
onSearchChange={setSearchQuery}
|
|
onTeamClick={handleTeamClick}
|
|
onBackToLeaderboards={handleBackToLeaderboards}
|
|
/>
|
|
);
|
|
}
|