import Link from "next/link"
import { TriangleAlertIcon } from "lucide-react"
import type { AlertTargetIssue } from "@mmapp/contracts/alerts"
import { Alert, AlertTitle, AlertDescription } from "@/components/reui/alert"

const kinds = { server: "Доступность сервера", traffic: "Трафик", probe: "Ping-проба" }
const reasons = {
  ambiguous: "Несколько включённых объектов имеют эту подпись. События не подтверждаются.",
  "disabled-object": "Объект или его сервер выключен. Опрос не выполняется.",
  "disabled-source": "Сбор данных этого типа выключен.",
}
export function AlertsTargetIssues({ issues }: { issues: AlertTargetIssue[] | undefined }) {
  if (!issues?.length) return null
  const grouped = new Map<string, { target: string; reason: AlertTargetIssue["reason"]; kinds: string[] }>()
  for (const issue of issues) {
    const key = `${issue.reason}\0${issue.target}`
    const group = grouped.get(key) ?? { target: issue.target, reason: issue.reason, kinds: [] }
    if (!group.kinds.includes(kinds[issue.kind])) group.kinds.push(kinds[issue.kind])
    grouped.set(key, group)
  }
  return <Alert role="status" variant="warning" aria-label="Проблемы целей оповещений">
    <TriangleAlertIcon />
    <AlertTitle>Некоторые цели оповещений требуют проверки</AlertTitle>
    <AlertDescription>
      <details open={grouped.size <= 5}>
        <summary className="cursor-pointer">Проверить цели: {grouped.size}</summary>
        <ul className="mt-2 space-y-2">
          {[...grouped].map(([key, group]) => <li key={key} className="[overflow-wrap:anywhere]">
            <strong>{group.target}</strong> · {group.kinds.join(" / ")} — {reasons[group.reason]}
          </li>)}
        </ul>
      </details>
      {issues.some(i => i.reason === "ambiguous") && <p>Задайте разные имена объектов, затем обновите цели существующих правил.</p>}
      <p className="mt-2 flex flex-wrap gap-x-4 gap-y-1">
        <Link className="underline underline-offset-4" href="/servers">Проверить серверы</Link>
        {issues.some(i => i.kind === "probe") && <Link className="underline underline-offset-4" href="/uptime">Проверить пробы</Link>}
        {issues.some(i => i.reason === "disabled-source") && <Link className="underline underline-offset-4" href="/data-collection">Проверить сбор данных</Link>}
      </p>
    </AlertDescription>
  </Alert>
}