import { Text } from 'react-native';

export const Badge = ({
  label,
  tone = 'neutral',
}: {
  label: string;
  tone?: 'neutral' | 'primary' | 'success' | 'warning' | 'danger';
}) => {
  const toneClass =
    tone === 'primary'
      ? 'bg-primary/10 text-primary'
      : tone === 'success'
        ? 'bg-emerald-500/10 text-emerald-700 dark:text-emerald-300'
        : tone === 'warning'
          ? 'bg-amber-500/10 text-amber-700 dark:text-amber-300'
          : tone === 'danger'
            ? 'bg-red-500/10 text-red-700 dark:text-red-300'
            : 'bg-muted text-muted-foreground';
  return (
    <Text
      className={`self-start rounded-md px-2 py-1 text-xs font-semibold capitalize ${toneClass}`}
    >
      {label}
    </Text>
  );
};
