helix-engage/src/components/leads/alerts-widget.tsx

import { daysAgoFromNow } from '@/lib/format';
import type { Lead } from '@/types/entities';

interface AlertsWidgetProps {
    leads: Lead[];
}

export const AlertsWidget = ({ leads }: AlertsWidgetProps) => {
    const agingCount = leads.filter(
        (l) =>
            l.leadStatus === 'NEW' &&
            l.createdAt !== null &&
            daysAgoFromNow(l.createdAt) > 5,
    ).length;

    if (agingCount === 0) {
        return null;
    }

    return (
        <div className="rounded-xl border border-error-subtle bg-error-primary p-4">
            <p className="text-xs font-bold text-error-primary">
                {agingCount} leads aging &gt; 5 days
            </p>
            <p className="mt-1 text-xs text-error-primary opacity-80">
                These leads haven&apos;t been contacted and are at risk of going cold.
            </p>
        </div>
    );
};