import type { PlanTier } from '@/entities/plan';
import { copy } from '@/shared/i18n';
import { cn } from '@/shared/lib/cn';

interface PlanPillProps {
  plan: PlanTier;
  onClick: () => void;
}

export const PlanPill = ({ plan, onClick }: PlanPillProps) => {
  const isPro = plan === 'pro';

  return (
    <button
      type="button"
      onClick={onClick}
      className={cn(
        'inline-flex items-center rounded-full border px-2.5 py-1 text-[11px] font-medium tracking-[0.08em] uppercase transition-colors',
        isPro
          ? 'border-amber-200/46 bg-amber-200/14 text-amber-100 hover:bg-amber-200/24'
          : 'border-white/20 bg-white/8 text-white/82 hover:bg-white/14',
      )}
    >
      {isPro ? copy.space.toolsDock.planPro : copy.space.toolsDock.planNormal}
    </button>
  );
};