feat: integrate TeamsSection component into tournament detail page

Update tournament detail page to use new TeamsSection component:
- Import TeamsSection component
- Replace static teams display with interactive configuration
- Pass tournament ID, teams, and participants to component

Refs #22

src/app/admin/tournaments/[id]/page.tsx

@@ -6,6 +6,7 @@ import { notFound, redirect } from "next/navigation"
 import { canManageTournament, canDeleteTournament } from "@/lib/permissions"
 import { getTournamentStatus } from "@/lib/tournamentUtils"
 import { DeleteTournamentButton } from "@/components/DeleteTournamentButton"
+import TeamsSection from "@/components/TeamsSection"
 
 interface PageProps {
   params: {
@@ -284,31 +285,18 @@ export default async function TournamentDetailPage({ params }: PageProps) {
             </div>
 
             {/* Teams Section */}
-            <div className="bg-white shadow rounded-lg p-6 mb-6">
+            <TeamsSection
-              <h2 className="text-lg font-medium text-gray-900 mb-4">
+              tournamentId={tournament.id}
-                Teams ({tournament.teams.length})
+              teams={tournament.teams}
-              </h2>
+              participants={tournament.participants.map(p => ({
-              
+                id: p.player.id,
-              {tournament.teams.length > 0 ? (
+                name: p.player.name,
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
+                currentElo: p.player.currentElo,
-                  {tournament.teams.map((team) => (
+              }))}
-                    <div
+              teamDurability={tournament.teamDurability || "permanent"}
-                      key={team.id}
+              partnerRotation={tournament.partnerRotation || "none"}
-                      className="bg-gray-50 rounded p-3 flex justify-between items-center"
+              allowByes={tournament.allowByes ?? true}
-                    >
+            />
-                      <div>
-                        <p className="font-medium text-gray-900">
-                          {team.player1.name} + {team.player2.name}
-                        </p>
-                        <p className="text-sm text-gray-500">{team.teamName}</p>
-                      </div>
-                    </div>
-                  ))}
-                </div>
-              ) : (
-                <p className="text-gray-500">No teams created yet.</p>
-              )}
-            </div>
 
             {/* Recent Matches Section */}
             <div className="bg-white shadow rounded-lg p-6">