import type { Metadata } from 'next';
import TeamHub from './TeamHub';

/**
 * /team/[abbr] (Session 51) — Team Hub. Thin server wrapper so we get proper
 * page metadata; the interactive roster lives in the TeamHub client component.
 */
export async function generateMetadata({ params }: { params: Promise<{ abbr: string }> }): Promise<Metadata> {
  const { abbr } = await params;
  const a = String(abbr || '').toUpperCase();
  return {
    title: `${a} — Team Hub`,
    description: `${a} roster, player archetypes, season stats, and tonight's graded props on VYNDR.`,
  };
}

export default async function TeamPage({
  params,
  searchParams,
}: {
  params: Promise<{ abbr: string }>;
  searchParams: Promise<{ sport?: string }>;
}) {
  const { abbr } = await params;
  const { sport } = await searchParams;
  return <TeamHub abbr={abbr} sport={(sport || 'mlb').toLowerCase()} />;
}
