berrypod/lib/berrypod_web/live/admin/dashboard.ex

defmodule BerrypodWeb.Admin.Dashboard do
  use BerrypodWeb, :live_view

  alias Berrypod.{Cart, Orders, Products, Settings}

  @checklist_items [
    %{key: :products_synced, label: "Sync your products", href: "/admin/providers"},
    %{key: :theme_customised, label: "Customise your theme", href: "/admin/theme"},
    %{key: :has_orders, label: "Place a test order", href: "/"},
    %{key: :site_live, label: "Go live", href: nil}
  ]

  @impl true
  def mount(_params, _session, socket) do
    setup = Berrypod.Setup.setup_status()
    status_counts = Orders.count_orders_by_status()
    paid_count = Map.get(status_counts, "paid", 0)
    recent_orders = Orders.list_orders(status: "paid") |> Enum.take(5)

    {:ok,
     socket
     |> assign(:page_title, "Dashboard")
     |> assign(:setup, setup)
     |> assign(:show_checklist, show_checklist?(setup))
     |> assign(:just_went_live, false)
     |> assign(:paid_count, paid_count)
     |> assign(:revenue, Orders.total_revenue())
     |> assign(:product_count, Products.count_products())
     |> assign(:recent_orders, recent_orders)}
  end

  # ── Events ──

  @impl true
  def handle_event("go_live", _params, socket) do
    {:ok, _} = Settings.set_site_live(true)
    setup = %{socket.assigns.setup | site_live: true}

    {:noreply,
     socket
     |> assign(:setup, setup)
     |> assign(:just_went_live, true)}
  end

  def handle_event("dismiss_checklist", _params, socket) do
    {:ok, _} = Settings.put_setting("checklist_dismissed", true, "boolean")
    setup = %{socket.assigns.setup | checklist_dismissed: true}

    {:noreply,
     socket
     |> assign(:setup, setup)
     |> assign(:show_checklist, false)}
  end

  # ── Render ──

  @impl true
  def render(assigns) do
    ~H"""
    <.header>
      Dashboard
    </.header>

    <%!-- Celebration after go-live --%>
    <div :if={@just_went_live} class="setup-complete" style="margin-top: 1.5rem;">
      <.icon name="hero-check-badge" class="setup-complete-icon" />
      <h2>Your shop is live!</h2>
      <p>Customers can now browse and buy from your shop.</p>
      <div style="display: flex; gap: 0.5rem; justify-content: center; flex-wrap: wrap;">
        <.link href={~p"/"} class="admin-btn admin-btn-primary">
          <.icon name="hero-arrow-top-right-on-square-mini" class="size-4" /> View your shop
        </.link>
        <.link navigate={~p"/admin/theme"} class="admin-btn admin-btn-secondary">
          <.icon name="hero-paint-brush-mini" class="size-4" /> Customise theme
        </.link>
      </div>
    </div>

    <%!-- Launch checklist --%>
    <.launch_checklist :if={@show_checklist and !@just_went_live} setup={@setup} />

    <%!-- Stats --%>
    <div class="admin-stats-grid">
      <.stat_card
        label="Orders"
        value={@paid_count}
        icon="hero-shopping-bag"
        href={~p"/admin/orders"}
      />
      <.stat_card
        label="Revenue"
        value={format_revenue(@revenue)}
        icon="hero-banknotes"
        href={~p"/admin/orders"}
      />
      <.stat_card
        label="Products"
        value={@product_count}
        icon="hero-cube"
        href={~p"/admin/products"}
      />
    </div>

    <%!-- Recent orders --%>
    <section style="margin-top: 2rem;">
      <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem;">
        <h2 style="font-size: 1.125rem; font-weight: 600;">Recent orders</h2>
        <.link
          navigate={~p"/admin/orders"}
          style="font-size: 0.875rem; color: color-mix(in oklch, var(--color-base-content) 60%, transparent);"
        >
          View all &rarr;
        </.link>
      </div>

      <%= if @recent_orders == [] do %>
        <div style="border: 1px solid var(--color-base-200, #e5e5e5); border-radius: 0.5rem; padding: 2rem; text-align: center; color: color-mix(in oklch, var(--color-base-content) 60%, transparent);">
          <div style="margin: 0 auto 0.75rem; width: 2.5rem; opacity: 0.3;">
            <.icon name="hero-inbox" class="size-10" />
          </div>
          <p style="font-weight: 500;">No orders yet</p>
          <p style="font-size: 0.875rem; margin-top: 0.25rem;">
            Orders will appear here once customers check out.
          </p>
        </div>
      <% else %>
        <div style="overflow-x: auto;">
          <table class="admin-table">
            <thead>
              <tr>
                <th>Order</th>
                <th>Date</th>
                <th>Customer</th>
                <th style="text-align: right;">Total</th>
                <th>Fulfilment</th>
              </tr>
            </thead>
            <tbody>
              <tr
                :for={order <- @recent_orders}
                phx-click={JS.navigate(~p"/admin/orders/#{order}")}
                style="cursor: pointer;"
              >
                <td style="font-weight: 500;">{order.order_number}</td>
                <td>{format_date(order.inserted_at)}</td>
                <td>{order.customer_email || "—"}</td>
                <td style="text-align: right;">{Cart.format_price(order.total)}</td>
                <td><.fulfilment_pill status={order.fulfilment_status} /></td>
              </tr>
            </tbody>
          </table>
        </div>
      <% end %>
    </section>
    """
  end

  # ==========================================================================
  # Launch checklist component
  # ==========================================================================

  attr :setup, :map, required: true

  defp launch_checklist(assigns) do
    items =
      Enum.map(@checklist_items, fn item ->
        Map.put(item, :done, Map.get(assigns.setup, item.key, false))
      end)

    done_count = Enum.count(items, & &1.done)
    total = length(items)
    progress_pct = round(done_count / total * 100)

    can_go_live =
      assigns.setup.provider_connected and assigns.setup.products_synced and
        assigns.setup.stripe_connected

    assigns =
      assigns
      |> assign(:items, items)
      |> assign(:done_count, done_count)
      |> assign(:total, total)
      |> assign(:progress_pct, progress_pct)
      |> assign(:can_go_live, can_go_live)

    ~H"""
    <div class="admin-checklist" style="margin-top: 1.5rem;">
      <div class="admin-checklist-header">
        <h2 class="admin-checklist-title">Launch checklist</h2>
        <div class="admin-checklist-progress">
          <span>{@done_count} of {@total}</span>
          <div class="admin-checklist-bar">
            <div class="admin-checklist-bar-fill" style={"width: #{@progress_pct}%"} />
          </div>
        </div>
      </div>

      <ul class="admin-checklist-items">
        <li :for={item <- @items} class="admin-checklist-item">
          <span class={["admin-checklist-check", item.done && "admin-checklist-check-done"]}>
            <.icon :if={item.done} name="hero-check-mini" class="size-3" />
          </span>

          <span class={["admin-checklist-label", item.done && "admin-checklist-label-done"]}>
            {item.label}
          </span>

          <span class="admin-checklist-action">
            <%= if item.key == :site_live do %>
              <button
                phx-click="go_live"
                disabled={!@can_go_live}
                class="admin-btn admin-btn-primary admin-btn-sm"
              >
                <.icon name="hero-rocket-launch-mini" class="size-4" /> Go live
              </button>
            <% else %>
              <.link
                :if={!item.done}
                navigate={item.href}
                class="admin-btn admin-btn-secondary admin-btn-sm"
              >
                {if item.done, do: "View", else: "Start"} &rarr;
              </.link>
            <% end %>
          </span>
        </li>
      </ul>

      <div class="admin-checklist-footer">
        <button
          type="button"
          phx-click="dismiss_checklist"
          class="admin-btn admin-btn-ghost admin-btn-sm"
        >
          Dismiss
        </button>
      </div>
    </div>
    """
  end

  # ==========================================================================
  # Components
  # ==========================================================================

  attr :label, :string, required: true
  attr :value, :any, required: true
  attr :icon, :string, required: true
  attr :href, :string, required: true

  defp stat_card(assigns) do
    ~H"""
    <.link
      navigate={@href}
      class="admin-card"
      style="display: block; text-decoration: none;"
    >
      <div style="display: flex; align-items: center; gap: 0.75rem; padding: 1rem;">
        <div style="background: var(--color-base-200, #e5e5e5); border-radius: 0.5rem; padding: 0.5rem;">
          <.icon name={@icon} class="size-5" />
        </div>
        <div>
          <p style="font-size: 1.5rem; font-weight: 700;">{@value}</p>
          <p style="font-size: 0.875rem; color: color-mix(in oklch, var(--color-base-content) 60%, transparent);">
            {@label}
          </p>
        </div>
      </div>
    </.link>
    """
  end

  defp fulfilment_pill(assigns) do
    {color, label} =
      case assigns.status do
        "unfulfilled" -> {"var(--color-base-200, #e5e5e5)", "unfulfilled"}
        "submitted" -> {"#dbeafe", "submitted"}
        "processing" -> {"#fef3c7", "processing"}
        "shipped" -> {"#f3e8ff", "shipped"}
        "delivered" -> {"#dcfce7", "delivered"}
        "failed" -> {"#fee2e2", "failed"}
        _ -> {"var(--color-base-200, #e5e5e5)", assigns.status || "—"}
      end

    assigns = assign(assigns, color: color, label: label)

    ~H"""
    <span style={"display: inline-flex; border-radius: 9999px; padding: 0.125rem 0.5rem; font-size: 0.75rem; font-weight: 500; background: #{@color};"}>
      {@label}
    </span>
    """
  end

  # ==========================================================================
  # Helpers
  # ==========================================================================

  defp show_checklist?(setup) do
    not setup.site_live and not setup.checklist_dismissed
  end

  defp format_revenue(amount_pence) when is_integer(amount_pence) do
    Cart.format_price(amount_pence)
  end

  defp format_revenue(_), do: "£0.00"

  defp format_date(datetime) do
    Calendar.strftime(datetime, "%d %b %Y")
  end
end