From 0dac93ec0bbbb50981dfebaaaad02804b09d6033 Mon Sep 17 00:00:00 2001
From: jamey <jamey@server.jamey.stream>
Date: Thu, 12 Feb 2026 14:17:38 +0000
Subject: [PATCH] add admin dashboard with setup checklist and stats

Dashboard at /admin shows setup progress (when not live), stat cards
(orders, revenue, products), and recent paid orders table. Replaces
the old AdminController redirect. Add Dashboard to sidebar nav as
first item, update admin bar and theme editor links to /admin.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 PROGRESS.md                                   |  15 +-
 lib/simpleshop_theme/orders.ex                |  10 +
 .../components/layouts.ex                     |   4 +
 .../components/layouts/admin.html.heex        |  10 +-
 .../components/layouts/shop.html.heex         |   2 +-
 .../live/admin/dashboard.ex                   | 207 ++++++++++++++++++
 .../live/admin/theme/index.html.heex          |   2 +-
 lib/simpleshop_theme_web/router.ex            |   8 +-
 .../live/admin/dashboard_test.exs             |  70 ++++++
 .../live/admin/layout_test.exs                |  14 +-
 10 files changed, 321 insertions(+), 21 deletions(-)
 create mode 100644 lib/simpleshop_theme_web/live/admin/dashboard.ex
 create mode 100644 test/simpleshop_theme_web/live/admin/dashboard_test.exs

diff --git a/PROGRESS.md b/PROGRESS.md
index 68483c8..ab81ec8 100644
--- a/PROGRESS.md
+++ b/PROGRESS.md
@@ -37,15 +37,14 @@ Plans: [admin-redesign.md](docs/plans/admin-redesign.md) | [setup-wizard.md](doc
 | ~~9~~ | ~~`Setup.setup_status/0` helper~~ | 2, 3 | 30m | done |
 | ~~10~~ | ~~ThemeHook gate (redirect to coming soon)~~ | 2, 8 | 30m | done |
 | ~~14~~ | ~~Go live / take offline toggle (on settings page)~~ | 2 | 30m | done |
-| | **Admin shell chain (priority)** | | | |
-| 1 | Filesystem restructure (consolidate live/ directories) | — | 2h | |
-| 6 | Admin shell component (sidebar nav, header) | 1 | 2-3h | |
-| 7 | Admin root + child layout templates | 1 | 1h | |
-| 11 | Theme editor back-to-admin link | 6 | 30m | |
-| 12 | Consolidate settings page | 6, 7 | 2-3h | |
+| ~~1~~ | ~~Filesystem restructure (consolidate live/ directories)~~ | — | 2h | done |
+| ~~6~~ | ~~Admin shell component (sidebar nav, header)~~ | 1 | 2-3h | done |
+| ~~7~~ | ~~Admin root + child layout templates~~ | 1 | 1h | done |
+| ~~11~~ | ~~Theme editor back-to-admin link~~ | 6 | 30m | done |
+| ~~4~~ | ~~Admin bar on shop pages~~ | — | 1h | done |
+| ~~12~~ | ~~Consolidate settings page~~ | 6, 7 | 2-3h | done |
+| | **Next up** | | | |
 | 13 | Admin dashboard (+ setup checklist) | 6, 7, 9 | 2h | |
-| | **Independent** | | | |
-| 4 | Admin bar on shop pages | — | 1h | |
 | 5 | Search (functional search with results) | — | 3-4h | |
 | | **Needs admin stable** | | | |
 | 15 | Setup wizard + admin tests | 13 | 1.5h | |
diff --git a/lib/simpleshop_theme/orders.ex b/lib/simpleshop_theme/orders.ex
index 1375f60..6a51673 100644
--- a/lib/simpleshop_theme/orders.ex
+++ b/lib/simpleshop_theme/orders.ex
@@ -50,6 +50,16 @@ defmodule SimpleshopTheme.Orders do
     |> Map.new()
   end
 
+  @doc """
+  Returns total revenue (in minor units) from paid orders.
+  """
+  def total_revenue do
+    Order
+    |> where(payment_status: "paid")
+    |> select([o], sum(o.total))
+    |> Repo.one() || 0
+  end
+
   @doc """
   Creates an order with line items from hydrated cart data.
 
diff --git a/lib/simpleshop_theme_web/components/layouts.ex b/lib/simpleshop_theme_web/components/layouts.ex
index e350040..ae0c816 100644
--- a/lib/simpleshop_theme_web/components/layouts.ex
+++ b/lib/simpleshop_theme_web/components/layouts.ex
@@ -46,6 +46,10 @@ defmodule SimpleshopThemeWeb.Layouts do
   end
 
   @doc false
+  def admin_nav_active?(current_path, "/admin") do
+    if current_path == "/admin", do: "active", else: nil
+  end
+
   def admin_nav_active?(current_path, link_path) do
     if String.starts_with?(current_path, link_path), do: "active", else: nil
   end
diff --git a/lib/simpleshop_theme_web/components/layouts/admin.html.heex b/lib/simpleshop_theme_web/components/layouts/admin.html.heex
index c4230db..a1811dd 100644
--- a/lib/simpleshop_theme_web/components/layouts/admin.html.heex
+++ b/lib/simpleshop_theme_web/components/layouts/admin.html.heex
@@ -34,7 +34,7 @@
     <aside class="bg-base-200 w-64 min-h-full flex flex-col">
       <%!-- sidebar header --%>
       <div class="p-4 border-b border-base-300">
-        <.link navigate={~p"/admin/orders"} class="text-lg font-bold tracking-tight">
+        <.link navigate={~p"/admin"} class="text-lg font-bold tracking-tight">
           SimpleShop
         </.link>
         <p class="text-xs text-base-content/60 mt-0.5 truncate">
@@ -45,6 +45,14 @@
       <%!-- nav links --%>
       <nav class="flex-1 p-2" aria-label="Admin navigation">
         <ul class="menu gap-0.5">
+          <li>
+            <.link
+              navigate={~p"/admin"}
+              class={admin_nav_active?(@current_path, "/admin")}
+            >
+              <.icon name="hero-home" class="size-5" /> Dashboard
+            </.link>
+          </li>
           <li>
             <.link
               navigate={~p"/admin/orders"}
diff --git a/lib/simpleshop_theme_web/components/layouts/shop.html.heex b/lib/simpleshop_theme_web/components/layouts/shop.html.heex
index 1422873..f96c5b7 100644
--- a/lib/simpleshop_theme_web/components/layouts/shop.html.heex
+++ b/lib/simpleshop_theme_web/components/layouts/shop.html.heex
@@ -3,7 +3,7 @@
   style="background-color: var(--t-surface-raised, #f5f5f5); border-bottom: 1px solid var(--t-border-default, #e5e5e5); padding: 0.25rem 1rem; font-size: 0.75rem; text-align: right;"
 >
   <.link
-    href={~p"/admin/orders"}
+    href={~p"/admin"}
     style="color: var(--t-text-secondary, #666); text-decoration: none;"
   >
     Admin
diff --git a/lib/simpleshop_theme_web/live/admin/dashboard.ex b/lib/simpleshop_theme_web/live/admin/dashboard.ex
new file mode 100644
index 0000000..82a0472
--- /dev/null
+++ b/lib/simpleshop_theme_web/live/admin/dashboard.ex
@@ -0,0 +1,207 @@
+defmodule SimpleshopThemeWeb.Admin.Dashboard do
+  use SimpleshopThemeWeb, :live_view
+
+  alias SimpleshopTheme.{Cart, Orders, Setup}
+
+  @impl true
+  def mount(_params, _session, socket) do
+    status = 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, status)
+     |> assign(:paid_count, paid_count)
+     |> assign(:revenue, Orders.total_revenue())
+     |> assign(:recent_orders, recent_orders)}
+  end
+
+  @impl true
+  def render(assigns) do
+    ~H"""
+    <.header>
+      Dashboard
+    </.header>
+
+    <%!-- Setup checklist (when not fully set up) --%>
+    <.setup_checklist :if={!@setup.site_live} setup={@setup} />
+
+    <%!-- Stats --%>
+    <div class="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-6">
+      <.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={@setup.product_count}
+        icon="hero-cube"
+        href={~p"/admin/settings"}
+      />
+    </div>
+
+    <%!-- Recent orders --%>
+    <section class="mt-8">
+      <div class="flex items-center justify-between mb-4">
+        <h2 class="text-lg font-semibold">Recent orders</h2>
+        <.link navigate={~p"/admin/orders"} class="text-sm text-zinc-500 hover:text-zinc-700">
+          View all &rarr;
+        </.link>
+      </div>
+
+      <%= if @recent_orders == [] do %>
+        <div class="rounded-lg border border-zinc-200 p-8 text-center text-zinc-500">
+          <.icon name="hero-inbox" class="size-10 mx-auto mb-3 text-zinc-300" />
+          <p class="font-medium">No orders yet</p>
+          <p class="text-sm mt-1">Orders will appear here once customers check out.</p>
+        </div>
+      <% else %>
+        <div class="overflow-x-auto">
+          <table class="w-full text-sm">
+            <thead>
+              <tr class="border-b border-zinc-200 text-left text-zinc-500">
+                <th class="pb-2 font-medium">Order</th>
+                <th class="pb-2 font-medium">Date</th>
+                <th class="pb-2 font-medium">Customer</th>
+                <th class="pb-2 font-medium text-right">Total</th>
+                <th class="pb-2 font-medium">Fulfilment</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr
+                :for={order <- @recent_orders}
+                class="border-b border-zinc-100 hover:bg-zinc-50 cursor-pointer"
+                phx-click={JS.navigate(~p"/admin/orders/#{order}")}
+              >
+                <td class="py-2.5 font-medium">{order.order_number}</td>
+                <td class="py-2.5 text-zinc-600">{format_date(order.inserted_at)}</td>
+                <td class="py-2.5 text-zinc-600">{order.customer_email || "—"}</td>
+                <td class="py-2.5 text-right">{Cart.format_price(order.total)}</td>
+                <td class="py-2.5"><.fulfilment_pill status={order.fulfilment_status} /></td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      <% end %>
+    </section>
+    """
+  end
+
+  # -- Function components --
+
+  attr :setup, :map, required: true
+
+  defp setup_checklist(assigns) do
+    steps = [
+      %{done: assigns.setup.admin_created, label: "Create admin account", href: nil},
+      %{
+        done: assigns.setup.printify_connected,
+        label: "Connect to Printify",
+        href: ~p"/admin/providers/new"
+      },
+      %{done: assigns.setup.products_synced, label: "Sync products", href: nil},
+      %{done: assigns.setup.stripe_connected, label: "Connect Stripe", href: ~p"/admin/settings"},
+      %{done: assigns.setup.site_live, label: "Go live", href: ~p"/admin/settings"}
+    ]
+
+    done_count = Enum.count(steps, & &1.done)
+    assigns = assign(assigns, steps: steps, done_count: done_count, total: length(steps))
+
+    ~H"""
+    <div class="mt-6 rounded-lg border border-zinc-200 p-5">
+      <div class="flex items-center justify-between mb-3">
+        <h2 class="font-semibold">Setup progress</h2>
+        <span class="text-sm text-zinc-500">{@done_count}/{@total}</span>
+      </div>
+      <div class="w-full bg-zinc-100 rounded-full h-2 mb-4">
+        <div
+          class="bg-green-500 h-2 rounded-full transition-all"
+          style={"width: #{@done_count / @total * 100}%"}
+        >
+        </div>
+      </div>
+      <ul class="space-y-2">
+        <li :for={step <- @steps} class="flex items-center gap-2 text-sm">
+          <%= if step.done do %>
+            <.icon name="hero-check-circle" class="size-5 text-green-500 shrink-0" />
+            <span class="text-zinc-500 line-through">{step.label}</span>
+          <% else %>
+            <.icon name="hero-circle-stack" class="size-5 text-zinc-300 shrink-0" />
+            <%= if step.href do %>
+              <.link navigate={step.href} class="text-zinc-700 hover:underline">{step.label}</.link>
+            <% else %>
+              <span class="text-zinc-700">{step.label}</span>
+            <% end %>
+          <% end %>
+        </li>
+      </ul>
+    </div>
+    """
+  end
+
+  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="rounded-lg border border-zinc-200 p-4 hover:border-zinc-300 transition-colors"
+    >
+      <div class="flex items-center gap-3">
+        <div class="rounded-lg bg-zinc-100 p-2">
+          <.icon name={@icon} class="size-5 text-zinc-600" />
+        </div>
+        <div>
+          <p class="text-2xl font-bold">{@value}</p>
+          <p class="text-sm text-zinc-500">{@label}</p>
+        </div>
+      </div>
+    </.link>
+    """
+  end
+
+  defp fulfilment_pill(assigns) do
+    {color, label} =
+      case assigns.status do
+        "unfulfilled" -> {"bg-zinc-100 text-zinc-600", "unfulfilled"}
+        "submitted" -> {"bg-blue-50 text-blue-700", "submitted"}
+        "processing" -> {"bg-amber-50 text-amber-700", "processing"}
+        "shipped" -> {"bg-purple-50 text-purple-700", "shipped"}
+        "delivered" -> {"bg-green-50 text-green-700", "delivered"}
+        "failed" -> {"bg-red-50 text-red-700", "failed"}
+        _ -> {"bg-zinc-100 text-zinc-600", assigns.status || "—"}
+      end
+
+    assigns = assign(assigns, color: color, label: label)
+
+    ~H"""
+    <span class={["inline-flex rounded-full px-2 py-0.5 text-xs font-medium", @color]}>
+      {@label}
+    </span>
+    """
+  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
diff --git a/lib/simpleshop_theme_web/live/admin/theme/index.html.heex b/lib/simpleshop_theme_web/live/admin/theme/index.html.heex
index 0c55772..3e40f76 100644
--- a/lib/simpleshop_theme_web/live/admin/theme/index.html.heex
+++ b/lib/simpleshop_theme_web/live/admin/theme/index.html.heex
@@ -36,7 +36,7 @@
         </div>
       <% else %>
         <.link
-          href={~p"/admin/orders"}
+          href={~p"/admin"}
           class="inline-flex items-center gap-1 text-sm text-base-content/60 hover:text-base-content mb-4"
         >
           <.icon name="hero-arrow-left-mini" class="size-4" /> Admin
diff --git a/lib/simpleshop_theme_web/router.ex b/lib/simpleshop_theme_web/router.ex
index 3a77b25..d0769be 100644
--- a/lib/simpleshop_theme_web/router.ex
+++ b/lib/simpleshop_theme_web/router.ex
@@ -128,13 +128,6 @@ defmodule SimpleshopThemeWeb.Router do
 
   ## Authentication routes
 
-  # /admin index redirect
-  scope "/admin", SimpleshopThemeWeb do
-    pipe_through [:browser, :require_authenticated_user]
-
-    get "/", AdminController, :index
-  end
-
   # Admin pages with sidebar layout
   scope "/admin", SimpleshopThemeWeb do
     pipe_through [:browser, :require_authenticated_user, :admin]
@@ -145,6 +138,7 @@ defmodule SimpleshopThemeWeb.Router do
         {SimpleshopThemeWeb.UserAuth, :require_authenticated},
         {SimpleshopThemeWeb.AdminLayoutHook, :assign_current_path}
       ] do
+      live "/", Admin.Dashboard, :index
       live "/orders", Admin.Orders, :index
       live "/orders/:id", Admin.OrderShow, :show
       live "/providers", Admin.Providers.Index, :index
diff --git a/test/simpleshop_theme_web/live/admin/dashboard_test.exs b/test/simpleshop_theme_web/live/admin/dashboard_test.exs
new file mode 100644
index 0000000..48590d3
--- /dev/null
+++ b/test/simpleshop_theme_web/live/admin/dashboard_test.exs
@@ -0,0 +1,70 @@
+defmodule SimpleshopThemeWeb.Admin.DashboardTest do
+  use SimpleshopThemeWeb.ConnCase, async: false
+
+  import Phoenix.LiveViewTest
+  import SimpleshopTheme.AccountsFixtures
+  import SimpleshopTheme.OrdersFixtures
+
+  setup do
+    user = user_fixture()
+    %{user: user}
+  end
+
+  describe "unauthenticated" do
+    test "redirects to login", %{conn: conn} do
+      {:error, redirect} = live(conn, ~p"/admin")
+      assert {:redirect, %{to: path}} = redirect
+      assert path == ~p"/users/log-in"
+    end
+  end
+
+  describe "setup checklist" do
+    setup %{conn: conn, user: user} do
+      %{conn: log_in_user(conn, user)}
+    end
+
+    test "shows setup progress when shop is offline", %{conn: conn} do
+      {:ok, _view, html} = live(conn, ~p"/admin")
+
+      assert html =~ "Setup progress"
+      assert html =~ "Create admin account"
+      assert html =~ "Connect to Printify"
+      assert html =~ "Connect Stripe"
+      assert html =~ "Go live"
+    end
+
+    test "hides setup checklist when shop is live", %{conn: conn} do
+      {:ok, _} = SimpleshopTheme.Settings.set_site_live(true)
+      {:ok, _view, html} = live(conn, ~p"/admin")
+
+      refute html =~ "Setup progress"
+    end
+  end
+
+  describe "stats" do
+    setup %{conn: conn, user: user} do
+      %{conn: log_in_user(conn, user)}
+    end
+
+    test "shows stats cards", %{conn: conn} do
+      {:ok, view, _html} = live(conn, ~p"/admin")
+
+      assert has_element?(view, "a[href='/admin/orders']", "Orders")
+      assert has_element?(view, "a[href='/admin/settings']", "Products")
+    end
+
+    test "shows zero state for orders", %{conn: conn} do
+      {:ok, _view, html} = live(conn, ~p"/admin")
+
+      assert html =~ "No orders yet"
+    end
+
+    test "shows recent orders when they exist", %{conn: conn} do
+      order = order_fixture(%{payment_status: "paid"})
+      {:ok, _view, html} = live(conn, ~p"/admin")
+
+      assert html =~ order.order_number
+      assert html =~ "Recent orders"
+    end
+  end
+end
diff --git a/test/simpleshop_theme_web/live/admin/layout_test.exs b/test/simpleshop_theme_web/live/admin/layout_test.exs
index 4607d9d..892ce37 100644
--- a/test/simpleshop_theme_web/live/admin/layout_test.exs
+++ b/test/simpleshop_theme_web/live/admin/layout_test.exs
@@ -17,6 +17,7 @@ defmodule SimpleshopThemeWeb.Admin.LayoutTest do
     test "renders sidebar nav links on admin pages", %{conn: conn} do
       {:ok, view, _html} = live(conn, ~p"/admin/orders")
 
+      assert has_element?(view, ~s(a[href="/admin"]), "Dashboard")
       assert has_element?(view, ~s(a[href="/admin/orders"]), "Orders")
       assert has_element?(view, ~s(a[href="/admin/theme"]), "Theme")
       assert has_element?(view, ~s(a[href="/admin/settings"]), "Settings")
@@ -29,6 +30,13 @@ defmodule SimpleshopThemeWeb.Admin.LayoutTest do
       refute has_element?(view, ~s(a.active[href="/admin/settings"]))
     end
 
+    test "highlights dashboard on dashboard page", %{conn: conn} do
+      {:ok, view, _html} = live(conn, ~p"/admin")
+
+      assert has_element?(view, ~s(a.active[href="/admin"]))
+      refute has_element?(view, ~s(a.active[href="/admin/orders"]))
+    end
+
     test "highlights correct link on different pages", %{conn: conn} do
       {:ok, view, _html} = live(conn, ~p"/admin/settings")
 
@@ -64,7 +72,7 @@ defmodule SimpleshopThemeWeb.Admin.LayoutTest do
     test "shows back link to admin", %{conn: conn} do
       {:ok, view, _html} = live(conn, ~p"/admin/theme")
 
-      assert has_element?(view, ~s(a[href="/admin/orders"]), "Admin")
+      assert has_element?(view, ~s(a[href="/admin"]), "Admin")
     end
   end
 
@@ -78,13 +86,13 @@ defmodule SimpleshopThemeWeb.Admin.LayoutTest do
       conn = log_in_user(conn, user)
       {:ok, _view, html} = live(conn, ~p"/")
 
-      assert html =~ ~s(href="/admin/orders")
+      assert html =~ ~s(href="/admin")
     end
 
     test "does not show admin link when logged out", %{conn: conn} do
       {:ok, _view, html} = live(conn, ~p"/")
 
-      refute html =~ ~s(href="/admin/orders")
+      refute html =~ ~s(href="/admin")
     end
   end
 end