import { cx } from '@/utils/cx';
import { daysAgoFromNow, getAgeBracket } from '@/lib/format';

const ageBracketColorMap = {
    fresh: 'text-success-primary',
    warm: 'text-warning-primary',
    cold: 'text-error-primary',
};

interface AgeIndicatorProps {
    dateStr: string;
}

export const AgeIndicator = ({ dateStr }: AgeIndicatorProps) => {
    const days = daysAgoFromNow(dateStr);
    const bracket = getAgeBracket(days);
    const colorClass = ageBracketColorMap[bracket];

    return (
        <span className={cx('text-sm font-semibold', colorClass)}>
            {days}d
        </span>
    );
};
