website refactor

apps/website/app/teams/TeamsPageClient.tsx

@@ -1,77 +1,36 @@
 'use client';
 
-import type { TeamsViewData } from '@/lib/view-data/TeamsViewData';
-import { TeamsTemplate } from '@/templates/TeamsTemplate';
+import React from 'react';
 import { useRouter } from 'next/navigation';
-import { useState } from 'react';
+import { TeamsTemplate } from '@/templates/TeamsTemplate';
+import type { TeamsViewData } from '@/lib/view-data/TeamsViewData';
+import { routes } from '@/lib/routing/RouteConfig';
 
-interface TeamsPageClientProps extends TeamsViewData {
-  searchQuery?: string;
-  showCreateForm?: boolean;
-  onSearchChange?: (query: string) => void;
-  onShowCreateForm?: () => void;
-  onHideCreateForm?: () => void;
-  onTeamClick?: (teamId: string) => void;
-  onCreateSuccess?: (teamId: string) => void;
-  onBrowseTeams?: () => void;
-  onSkillLevelClick?: (level: string) => void;
+interface TeamsPageClientProps {
+  viewData: TeamsViewData;
 }
 
-export function TeamsPageClient({ teams }: TeamsPageClientProps) {
+export function TeamsPageClient({ viewData }: TeamsPageClientProps) {
   const router = useRouter();
   
-  // UI state only (no business logic)
-  const [searchQuery, setSearchQuery] = useState('');
-  const [showCreateForm, setShowCreateForm] = useState(false);
-  
-  // Event handlers
-  const handleSearchChange = (query: string) => {
-    setSearchQuery(query);
-  };
-  
-  const handleShowCreateForm = () => {
-    setShowCreateForm(true);
-  };
-  
-  const handleHideCreateForm = () => {
-    setShowCreateForm(false);
-  };
-  
   const handleTeamClick = (teamId: string) => {
     router.push(`/teams/${teamId}`);
   };
   
-  const handleCreateSuccess = (teamId: string) => {
-    setShowCreateForm(false);
-    router.push(`/teams/${teamId}`);
+  const handleViewFullLeaderboard = () => {
+    router.push(routes.team.leaderboard);
   };
-  
-  const handleBrowseTeams = () => {
-    const element = document.getElementById('teams-list');
-    if (element) {
-      element.scrollIntoView({ behavior: 'smooth' });
-    }
-  };
-  
-  const handleSkillLevelClick = (level: string) => {
-    const element = document.getElementById(`level-${level}`);
-    if (element) {
-      element.scrollIntoView({ behavior: 'smooth' });
-    }
+
+  const handleCreateTeam = () => {
+    router.push(routes.team.detail('create'));
   };
   
   return (
     <TeamsTemplate
-      teams={teams}
-      searchQuery={searchQuery}
-      showCreateForm={showCreateForm}
-      onSearchChange={handleSearchChange}
-      onShowCreateForm={handleShowCreateForm}
-      onHideCreateForm={handleHideCreateForm}
+      viewData={viewData}
       onTeamClick={handleTeamClick}
-      onCreateSuccess={handleCreateSuccess}
-      onBrowseTeams={handleBrowseTeams}
-      onSkillLevelClick={handleSkillLevelClick}
+      onViewFullLeaderboard={handleViewFullLeaderboard}
+      onCreateTeam={handleCreateTeam}
     />
   );
 }