import Link from 'next/link';

export function ListingsAttentionWidget({ count }: { count: number }) {
  if (count === 0) {
    return (
      <div className="rounded-md border border-forest/10 bg-white p-4 text-sm text-forest/60">
        All listings look good — no drafts or stale items.
      </div>
    );
  }

  const noun = count === 1 ? 'listing needs attention' : 'listings need attention';

  return (
    <Link
      href="/seller/listings?filter=needs-attention"
      className="flex items-center justify-between rounded-md border border-terracotta/20 bg-white p-4 text-sm hover:bg-terracotta/5"
    >
      <span className="font-medium text-ink">
        {count} {noun}
      </span>
      <span className="text-xs font-semibold text-terracotta">Review →</span>
    </Link>
  );
}