defmodule AmmopricesWeb.HomeLive do
  @moduledoc false
  use AmmopricesWeb, :live_view

  import AmmopricesWeb.PriceComponents

  alias Ammoprices.Catalog
  alias Ammoprices.Prices

  @categories [
    %{id: "handgun", label: "Handgun"},
    %{id: "rifle", label: "Rifle"},
    %{id: "rimfire", label: "Rimfire"},
    %{id: "shotgun", label: "Shotgun"}
  ]

  @impl true
  def mount(_params, _session, socket) do
    if connected?(socket) do
      Phoenix.PubSub.subscribe(Ammoprices.PubSub, "prices:updated")
    end

    calibers = Catalog.list_calibers()

    grouped =
      calibers
      |> Enum.group_by(& &1.category)
      |> Map.new(fn {cat, cals} ->
        {cat, Enum.sort_by(cals, & &1.name)}
      end)

    {:ok,
     socket
     |> assign(
       page_title: "AmmoCPR",
       categories: @categories,
       calibers_by_category: grouped
     )
     |> assign_cheapest_map()}
  end

  @impl true
  def handle_info({:prices_updated, _caliber_ids}, socket) do
    {:noreply, assign_cheapest_map(socket)}
  end

  defp assign_cheapest_map(socket) do
    cheapest_map =
      Map.new(Prices.cheapest_per_caliber(), fn r -> {r.caliber_id, r.min_ppr} end)

    assign(socket, :cheapest_map, cheapest_map)
  end

  @impl true
  def render(assigns) do
    ~H"""
    <Layouts.app flash={@flash}>
      <div class="space-y-8">
        <%!-- Hero --%>
        <div class="text-center space-y-3">
          <h1 class="text-3xl sm:text-4xl font-black tracking-tight text-base-content">
            AmmoCPR
          </h1>
          <p class="text-base-content/60 text-sm max-w-md mx-auto">
            Real-time ammunition prices from top retailers. Find the cheapest rounds, track price history.
          </p>
        </div>

        <%!-- Category grid --%>
        <div class="space-y-6">
          <div :for={cat <- @categories} id={"category-#{cat.id}"} class="space-y-3">
            <h2 class="text-lg font-bold tracking-tight text-base-content">
              {cat.label}
            </h2>

            <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-2">
              <.link
                :for={cal <- Map.get(@calibers_by_category, cat.id, [])}
                navigate={~p"/calibers/#{cal.slug}"}
                id={"caliber-#{cal.slug}"}
                class="group flex items-center justify-between gap-2 px-3 py-2.5 rounded-lg border border-base-300 bg-base-100 hover:border-primary/40 hover:bg-primary/5 transition-all duration-150"
              >
                <span class="text-sm font-semibold text-base-content group-hover:text-primary transition-colors">
                  {cal.name}
                </span>
                <span
                  :if={Map.has_key?(@cheapest_map, cal.id)}
                  class="text-xs font-mono tabular-nums text-success font-semibold"
                >
                  <.price_per_round cents={@cheapest_map[cal.id]} />
                </span>
              </.link>
            </div>
          </div>
        </div>
      </div>
    </Layouts.app>
    """
  end
end