import Link from "next/link";
import { listActiveNotifications } from "@/lib/notifications/queries";

const toneClass: Record<string, string> = {
  info: "bg-[var(--color-blue)] text-white",
  warning: "bg-amber-500 text-[var(--color-ink)]",
  success: "bg-emerald-600 text-white",
};

export async function NotificationBanner() {
  let rows: Awaited<ReturnType<typeof listActiveNotifications>> = [];
  try {
    rows = await listActiveNotifications();
  } catch {
    return null;
  }
  if (rows.length === 0) return null;
  const n = rows[0];
  const cls = toneClass[n.level] ?? toneClass.info;

  const content = (
    <div className="flex flex-wrap items-center justify-center gap-3 px-4 py-2 text-sm">
      <span className="font-semibold">{n.title}</span>
      {n.body && <span className="opacity-90">{n.body}</span>}
    </div>
  );

  return (
    <div className={cls}>
      {n.href ? (
        <Link href={n.href} className="block hover:opacity-90">
          {content}
        </Link>
      ) : (
        content
      )}
    </div>
  );
}
