'use client';

import { Link } from '@/ui/Link';
import { Stack } from '@/ui/primitives/Stack';
import { Text } from '@/ui/Text';

interface Tab {
  label: string;
  href: string;
  exact?: boolean;
}

interface LeagueTabsProps {
  tabs: Tab[];
}

export function LeagueTabs({ tabs }: LeagueTabsProps) {
  return (
    <Stack borderBottom borderColor="border-charcoal-outline">
      <Stack direction="row" gap={6} overflow="auto">
        {tabs.map((tab) => (
          <Link
            key={tab.href}
            href={tab.href}
            variant="ghost"
          >
            <Stack pb={3} px={1}>
              <Text weight="medium" 
                // eslint-disable-next-line gridpilot-rules/component-classification
                className="whitespace-nowrap"
              >
                {tab.label}
              </Text>
            </Stack>
          </Link>
        ))}
      </Stack>
    </Stack>
  );
}