import type { PillTab } from '~/components/ui/pill-tabs';
import { PillTabs } from '~/components/ui/pill-tabs';

export type SpoonDetailSegment =
  | 'overview'
  | 'upstream'
  | 'fork'
  | 'prs'
  | 'threads'
  | 'settings';

const tabs: PillTab<SpoonDetailSegment>[] = [
  { label: 'Overview', value: 'overview' },
  { label: 'Upstream', value: 'upstream' },
  { label: 'Fork', value: 'fork' },
  { label: 'PRs', value: 'prs' },
  { label: 'Threads', value: 'threads' },
  { label: 'Settings', value: 'settings' },
];

export const SegmentControl = ({
  onChange,
  value,
}: {
  onChange: (value: SpoonDetailSegment) => void;
  value: SpoonDetailSegment;
}) => <PillTabs onChange={onChange} tabs={tabs} value={value} />;
