'use client';

import { useTranslations } from 'next-intl';

const STATUS_CLASS = {
  OPEN:     'bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-400',
  CLAIMED:  'bg-blue-100   text-blue-700   dark:bg-blue-900/30   dark:text-blue-400',
  RESOLVED: 'bg-green-100  text-green-700  dark:bg-green-900/30  dark:text-green-400',
} as const;

type Status = keyof typeof STATUS_CLASS;

export function StatusBadge({ status }: { status: Status }) {
  const t = useTranslations('common');
  return (
    <span className={`shrink-0 rounded-full px-2.5 py-0.5 text-xs font-medium ${STATUS_CLASS[status]}`}>
      {t(`status.${status.toLowerCase() as 'open' | 'claimed' | 'resolved'}`)}
    </span>
  );
}