defmodule TarakanWeb.ModelAnalyticsLive do
  @moduledoc """
  What each model finds and misses, measured against the public record.

  Selecting a model loads its blind spots: confirmed findings on repositories
  that model scanned and did not report.
  """
  use TarakanWeb, :live_view

  alias Tarakan.ModelAnalytics
  alias TarakanWeb.RepositoryPaths

  @impl true
  def mount(_params, _session, socket) do
    scoreboard = ModelAnalytics.cached_model_scoreboard()

    {:ok,
     socket
     |> assign(:page_title, "Models")
     |> assign(
       :meta_description,
       "Detection accuracy and blind spots per model, measured against Tarakan's verified findings."
     )
     |> assign(:canonical_path, ~p"/models")
     |> assign(:scoreboard, scoreboard)
     |> assign(:total_findings, sum(scoreboard, :findings))
     |> assign(:total_confirmed, sum(scoreboard, :confirmed))
     |> assign(:total_disputed, sum(scoreboard, :disputed))
     |> assign(:disagreements, ModelAnalytics.cached_disagreement_patterns(limit: 15))
     |> select_model(default_model(scoreboard))}
  end

  defp sum(rows, key), do: Enum.reduce(rows, 0, &(&2 + Map.fetch!(&1, key)))

  @impl true
  def handle_event("select_model", %{"model" => model}, socket) do
    {:noreply, select_model(socket, model)}
  end

  defp default_model([]), do: nil
  defp default_model([%{model: model} | _rest]), do: model

  defp select_model(socket, nil) do
    socket
    |> assign(:selected_model, nil)
    |> assign(:blind_spots, [])
    |> assign(:selected_repositories, 0)
  end

  defp select_model(socket, model) do
    # The repo count is what makes a miss meaningful: it is the opportunity the
    # model actually had.
    repositories =
      socket.assigns.scoreboard
      |> Enum.find(%{}, &(&1.model == model))
      |> Map.get(:repositories, 0)

    socket
    |> assign(:selected_model, model)
    |> assign(:blind_spots, ModelAnalytics.cached_blind_spots(model, limit: 20))
    |> assign(:selected_repositories, repositories)
  end

  defp precision_label(nil), do: "-"
  defp precision_label(precision), do: "#{precision}%"

  @impl true
  def render(assigns) do
    ~H"""
    <Layouts.app flash={@flash} current_scope={@current_scope} current_path={assigns[:current_path]}>
      <Layouts.page>
        <.breadcrumbs id="models-breadcrumb">
          <:crumb navigate={~p"/"}>registry</:crumb>
          <:crumb>models</:crumb>
        </.breadcrumbs>

        <div class="flex flex-wrap items-end justify-between gap-x-6 gap-y-3 border-b-2 border-strong pb-5">
          <h1 class="font-display text-3xl font-medium uppercase tracking-[0.02em] text-ink sm:text-4xl">
            Models
          </h1>
          <dl
            :if={@scoreboard != []}
            class="flex flex-wrap gap-x-6 gap-y-2 font-mono text-[11px] uppercase tracking-[0.12em]"
          >
            <div>
              <dt class="text-ink-faint">Ranked</dt>
              <dd class="mt-0.5 font-display text-lg tabular-nums text-ink">
                {length(@scoreboard)}
              </dd>
            </div>
            <div>
              <dt class="text-ink-faint">Findings</dt>
              <dd class="mt-0.5 font-display text-lg tabular-nums text-ink">{@total_findings}</dd>
            </div>
            <div>
              <dt class="text-ink-faint">Confirmed</dt>
              <dd class="mt-0.5 font-display text-lg tabular-nums text-phosphor">
                {@total_confirmed}
              </dd>
            </div>
            <div>
              <dt class="text-ink-faint">Disputed</dt>
              <dd class="mt-0.5 font-display text-lg tabular-nums text-ink-muted">
                {@total_disputed}
              </dd>
            </div>
          </dl>
        </div>

        <p
          :if={@scoreboard == []}
          id="models-empty"
          class="mt-8 font-mono text-xs text-ink-faint"
        >
          No model has reported enough findings yet.
        </p>

        <section :if={@scoreboard != []} id="model-scoreboard" class="mt-8">
          <div class="overflow-x-auto border-2 border-strong bg-ground">
            <table class="w-full min-w-[40rem] border-collapse text-left">
              <thead>
                <tr class="border-b border-rule font-mono text-[10px] uppercase tracking-[0.12em] text-ink-faint">
                  <th class="px-3 py-2 font-normal sm:px-4">Model</th>
                  <th class="w-20 px-2 py-2 text-right font-normal">Findings</th>
                  <th class="w-20 px-2 py-2 text-right font-normal">Confirmed</th>
                  <th class="w-20 px-2 py-2 text-right font-normal">Disputed</th>
                  <th class="w-24 px-2 py-2 text-right font-normal">Precision</th>
                  <th class="hidden w-20 px-3 py-2 text-right font-normal sm:table-cell sm:px-4">
                    Repos
                  </th>
                </tr>
              </thead>
              <tbody class="divide-y divide-rule">
                <tr
                  :for={row <- @scoreboard}
                  id={"model-row-#{row.model}"}
                  phx-click="select_model"
                  phx-value-model={row.model}
                  aria-selected={to_string(@selected_model == row.model)}
                  class={[
                    "cursor-pointer transition-colors hover:bg-panel",
                    @selected_model == row.model && "bg-panel"
                  ]}
                >
                  <td class="min-w-0 px-3 py-2.5 sm:px-4">
                    <span class="block truncate font-mono text-xs font-semibold text-ink">
                      {row.model}
                    </span>
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-ink">
                    {row.findings}
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-phosphor">
                    {row.confirmed}
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-ink-muted">
                    {row.disputed}
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-ink">
                    {precision_label(row.precision)}
                  </td>
                  <td class="hidden px-3 py-2.5 text-right font-mono text-xs tabular-nums text-ink-faint sm:table-cell sm:px-4">
                    {row.repositories}
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </section>

        <section :if={@selected_model} id="model-blind-spots" class="mt-10">
          <div class="mb-3 flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1">
            <h2 class="font-display text-lg uppercase tracking-[0.02em] text-ink">
              Blind spots · {@selected_model}
            </h2>
            <span class="font-mono text-[11px] uppercase tracking-[0.12em] text-ink-faint">
              {length(@blind_spots)} missed · {@selected_repositories} repos scanned
            </span>
          </div>

          <p :if={@blind_spots == []} class="font-mono text-xs text-ink-faint">
            None recorded.
          </p>

          <ul
            :if={@blind_spots != []}
            class="divide-y divide-rule border-2 border-strong bg-ground"
          >
            <li
              :for={finding <- @blind_spots}
              id={"blind-spot-#{finding.id}"}
              class="flex flex-wrap items-baseline gap-x-3 gap-y-1 px-4 py-3"
            >
              <.link
                navigate={~p"/findings/#{finding.public_id}"}
                class="min-w-0 flex-1 truncate text-sm text-ink hover:text-signal hover:underline"
              >
                {finding.title}
              </.link>
              <.link
                navigate={RepositoryPaths.repository_path(finding.repository)}
                class="shrink-0 font-mono text-[10px] uppercase tracking-[0.12em] text-ink-faint hover:text-signal"
              >
                {finding.repository.owner}/{finding.repository.name}
              </.link>
              <span class="shrink-0 font-mono text-[10px] uppercase tracking-[0.12em] text-ink-faint">
                {finding.detections_count} detections
              </span>
            </li>
          </ul>
        </section>

        <section :if={@disagreements != []} id="model-disagreements" class="mt-10">
          <div class="mb-3 flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1">
            <h2 class="font-display text-lg uppercase tracking-[0.02em] text-ink">
              Contested classes
            </h2>
            <span class="font-mono text-[11px] uppercase tracking-[0.12em] text-ink-faint">
              {length(@disagreements)} reported by 2+ models
            </span>
          </div>

          <div class="overflow-x-auto border-2 border-strong bg-ground">
            <table class="w-full min-w-[36rem] border-collapse text-left">
              <thead>
                <tr class="border-b border-rule font-mono text-[10px] uppercase tracking-[0.12em] text-ink-faint">
                  <th class="px-3 py-2 font-normal sm:px-4">Class</th>
                  <th class="w-20 px-2 py-2 text-right font-normal">Models</th>
                  <th class="w-24 px-2 py-2 text-right font-normal">Confirmed</th>
                  <th class="w-24 px-3 py-2 text-right font-normal sm:px-4">Disputed</th>
                </tr>
              </thead>
              <tbody class="divide-y divide-rule">
                <tr
                  :for={row <- @disagreements}
                  id={"disagreement-#{row.pattern_key}"}
                  class="transition-colors hover:bg-panel"
                >
                  <td class="min-w-0 px-3 py-2.5 sm:px-4">
                    <.link
                      navigate={~p"/infestations/#{row.pattern_key}"}
                      class="block truncate text-sm text-ink hover:text-signal hover:underline"
                    >
                      {row.title}
                    </.link>
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-ink">
                    {row.models}
                  </td>
                  <td class="px-2 py-2.5 text-right font-mono text-xs tabular-nums text-phosphor">
                    {row.confirmed}
                  </td>
                  <td class="px-3 py-2.5 text-right font-mono text-xs tabular-nums text-ink-muted sm:px-4">
                    {row.disputed}
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </section>
      </Layouts.page>
    </Layouts.app>
    """
  end
end