Breakdown of jobs by state

.formatter.exs

@@ -1,4 +1,6 @@
 # Used by "mix format"
 [
-  inputs: ["{mix,.formatter}.exs", "{config,lib,test}/**/*.{ex,exs}"]
+  inputs: ["{mix,.formatter}.exs", "{config,lib,test}/**/*.{ex,exs}"],
+  # Need to increase it because of <.label_value_list /> that does a <pre> tag, which will look broken with extra whitespace.
+  heex_line_length: 300
 ]

lib/oban/live_dashboard.ex

@@ -4,43 +4,44 @@ defmodule Oban.LiveDashboard do
   import Phoenix.LiveDashboard.Helpers, only: [format_value: 2]
   import Ecto.Query
 
-  @impl true
-  def menu_link(_, _) do
-    {:ok, "Oban"}
-  end
+  @per_page_limits [20, 50, 100]
+
+  @oban_sorted_job_states [
+    "executing",
+    "available",
+    "scheduled",
+    "retryable",
+    "cancelled",
+    "discarded",
+    "completed"
+  ]
 
   @impl true
   def render(assigns) do
     ~H"""
-    <.live_table
-      id="oban_jobs"
-      dom_id="oban-jobs"
-      page={@page}
-      row_attrs={&row_attrs/1}
-      row_fetcher={&fetch_jobs/2}
-      title="Oban Jobs"
-      search={false}
-    >
-      <:col field={:id} header="ID" sortable={:desc} />
-      <:col field={:state} sortable={:desc} />
-      <:col field={:queue} sortable={:desc} />
-      <:col field={:worker} sortable={:desc} />
-      <:col :let={job} field={:attempt} header="Attempts" sortable={:desc}>
-        <%= job.attempt %>/<%= job.max_attempts %>
-      </:col>
-      <:col :let={job} field={:inserted_at} sortable={:desc}>
-        <%= format_value(job.inserted_at) %>
-      </:col>
-      <:col :let={job} field={:scheduled_at} sortable={:desc}>
-        <%= format_value(job.scheduled_at) %>
-      </:col>
-    </.live_table>
-    <.live_modal
-      :if={@job != nil}
-      id="modal"
-      title="Job"
-      return_to={live_dashboard_path(@socket, @page, params: %{})}
-    >
+    <h1 class="mb-3">Oban</h1>
+
+    <p>Filter jobs by state:</p>
+
+    <.live_nav_bar id="oban_states" page={@page} nav_param="job_state" style={:bar} extra_params={["nav"]}>
+      <:item :for={{job_state, count} <- @job_state_counts} name={job_state} label={job_state_label(job_state, count)} method="navigate">
+        <.live_table id="oban_jobs" limit={per_page_limits()} dom_id={"oban-jobs-#{job_state}"} page={@page} row_attrs={&row_attrs/1} row_fetcher={&fetch_jobs(&1, &2, job_state)} default_sort_by={@timestamp_field} title="" search={false}>
+          <:col :let={job} field={:worker} sortable={:desc}>
+            <p class="font-weight-bold"><%= job.worker %></p>
+            <pre class="font-weight-lighter text-muted"><%= truncate(inspect(job.args)) %></pre>
+          </:col>
+          <:col :let={job} field={:attempt} header="Attempt" sortable={:desc}>
+            <%= job.attempt %>/<%= job.max_attempts %>
+          </:col>
+          <:col field={:queue} header="Queue" sortable={:desc} />
+          <:col :let={job} field={@timestamp_field} sortable={:desc}>
+            <%= format_value(timestamp(job, @timestamp_field)) %>
+          </:col>
+        </.live_table>
+      </:item>
+    </.live_nav_bar>
+
+    <.live_modal :if={@job != nil} id="job-modal" title={"Job - #{@job.id}"} return_to={live_dashboard_path(@socket, @page, params: %{})}>
       <.label_value_list>
         <:elem label="ID"><%= @job.id %></:elem>
         <:elem label="State"><%= @job.state %></:elem>
@@ -53,24 +54,39 @@ defmodule Oban.LiveDashboard do
         <:elem label="Attempts"><%= @job.attempt %>/<%= @job.max_attempts %></:elem>
         <:elem label="Priority"><%= @job.priority %></:elem>
         <:elem label="Attempted at"><%= format_value(@job.attempted_at) %></:elem>
-        <:elem :if={@job.cancelled_at} label="Cancelled at">
-          <%= format_value(@job.cancelled_at) %>
-        </:elem>
-        <:elem :if={@job.completed_at} label="Completed at">
-          <%= format_value(@job.completed_at) %>
-        </:elem>
-        <:elem :if={@job.discarded_at} label="Discarded at">
-          <%= format_value(@job.discarded_at) %>
-        </:elem>
+        <:elem :if={@job.cancelled_at} label="Cancelled at"><%= format_value(@job.cancelled_at) %></:elem>
+        <:elem :if={@job.completed_at} label="Completed at"><%= format_value(@job.completed_at) %></:elem>
+        <:elem :if={@job.discarded_at} label="Discarded at"><%= format_value(@job.discarded_at) %></:elem>
         <:elem label="Inserted at"><%= format_value(@job.inserted_at) %></:elem>
         <:elem label="Scheduled at"><%= format_value(@job.scheduled_at) %></:elem>
       </.label_value_list>
     </.live_modal>
     """
   end
 
+  @impl true
+  def mount(params, _, socket) do
+    socket =
+      socket
+      |> assign(job_state: Map.get(params, "job_state", "executing"))
+      |> assign(sort_by: Map.get(params, "job_state"))
+
+    {:ok, socket}
+  end
+
+  @impl true
+  def menu_link(_, _) do
+    {:ok, "Oban"}
+  end
+
   @impl true
   def handle_params(%{"params" => %{"job" => job_id}}, _url, socket) do
+    socket =
+      socket
+      |> assign(job: nil)
+      |> assign_job_state_counts()
+      |> assign_timestamp_field()
+
     case fetch_job(job_id) do
       {:ok, job} ->
         {:noreply, assign(socket, job: job)}
@@ -81,8 +97,14 @@ defmodule Oban.LiveDashboard do
     end
   end
 
-  def handle_params(_params, _url, socket) do
-    {:noreply, assign(socket, job: nil)}
+  def handle_params(_params, _uri, socket) do
+    socket =
+      socket
+      |> assign(job: nil)
+      |> assign_job_state_counts()
+      |> assign_timestamp_field()
+
+    {:noreply, socket}
   end
 
   @impl true
@@ -91,28 +113,81 @@ defmodule Oban.LiveDashboard do
     {:noreply, push_patch(socket, to: to)}
   end
 
-  defp fetch_jobs(params, _node) do
-    total_jobs = Oban.Repo.aggregate(Oban.config(), Oban.Job, :count)
-    jobs = Oban.Repo.all(Oban.config(), jobs_query(params)) |> Enum.map(&Map.from_struct/1)
+  @impl true
+  def handle_refresh(socket) do
+    socket =
+      socket
+      |> assign_job_state_counts()
+
+    {:noreply, socket}
+  end
+
+  defp assign_job_state_counts(socket) do
+    job_state_counts_in_db =
+      Oban.Repo.all(
+        Oban.config(),
+        Oban.Job
+        |> group_by([j], [j.state])
+        |> order_by([j], [j.state])
+        |> select([j], {j.state, count(j.id)})
+      )
+      |> Enum.into(%{})
+
+    job_state_counts =
+      for job_state <- @oban_sorted_job_states,
+          do: {job_state, Map.get(job_state_counts_in_db, job_state, 0)}
+
+    total_count = Keyword.values(job_state_counts) |> Enum.sum()
+    job_state_counts = [{"all", total_count} | job_state_counts]
+
+    assign(socket, job_state_counts: job_state_counts)
+  end
+
+  defp job_state_label(job_state, count) do
+    "#{job_state} - (#{count})"
+  end
+
+  defp fetch_jobs(params, _node, job_state) do
+    total_jobs = Oban.Repo.aggregate(Oban.config(), jobs_count_query(job_state), :count)
+
+    jobs =
+      Oban.Repo.all(Oban.config(), jobs_query(params, job_state)) |> Enum.map(&Map.from_struct/1)
+
     {jobs, total_jobs}
   end
 
   defp fetch_job(id) do
     case Oban.Repo.get(Oban.config(), Oban.Job, id) do
-      nil ->
-        :error
-
-      job ->
+      %Oban.Job{} = job ->
         {:ok, job}
+
+      _ ->
+        :error
     end
   end
 
-  defp jobs_query(%{sort_by: sort_by, sort_dir: sort_dir, limit: l}) do
+  defp jobs_query(%{sort_by: sort_by, sort_dir: sort_dir, limit: limit}, "all" = _job_state) do
     Oban.Job
-    |> limit(^l)
+    |> limit(^limit)
     |> order_by({^sort_dir, ^sort_by})
   end
 
+  defp jobs_query(%{sort_by: sort_by, sort_dir: sort_dir, limit: limit}, job_state) do
+    Oban.Job
+    |> limit(^limit)
+    |> where([job], job.state == ^job_state)
+    |> order_by({^sort_dir, ^sort_by})
+  end
+
+  defp jobs_count_query("all" = _job_state) do
+    Oban.Job
+  end
+
+  defp jobs_count_query(job_state) do
+    Oban.Job
+    |> where([job], job.state == ^job_state)
+  end
+
   defp row_attrs(job) do
     [
       {"phx-click", "show_job"},
@@ -125,9 +200,39 @@ defmodule Oban.LiveDashboard do
     Enum.map(errors, &Map.get(&1, "error"))
   end
 
-  def format_value(%DateTime{} = datetime) do
-    DateTime.to_string(datetime)
+  defp format_value(%DateTime{} = datetime) do
+    Calendar.strftime(datetime, "%Y-%m-%d %H:%M:%S")
+  end
+
+  defp format_value(value), do: value
+
+  defp timestamp(job, timestamp_field) do
+    Map.get(job, timestamp_field)
+  end
+
+  defp assign_timestamp_field(%{assigns: %{job_state: job_state}} = socket) do
+    timestamp_field =
+      case job_state do
+        "available" -> :scheduled_at
+        "cancelled" -> :cancelled_at
+        "completed" -> :completed_at
+        "discarded" -> :discarded_at
+        "executing" -> :attempted_at
+        "retryable" -> :scheduled_at
+        "scheduled" -> :scheduled_at
+        _ -> :inserted_at
+      end
+
+    assign(socket, timestamp_field: timestamp_field)
+  end
+
+  defp truncate(string, max_length \\ 50) do
+    if String.length(string) > max_length do
+      String.slice(string, 0, max_length) <> "…"
+    else
+      string
+    end
   end
 
-  def format_value(nil), do: nil
+  defp per_page_limits, do: @per_page_limits
 end

mix.lock

@@ -12,10 +12,10 @@
   "exqlite": {:hex, :exqlite, "0.27.0", "2ef6021862e74c6253d1fb1f5701bd47e4e779b035d34daf2a13ec83945a05ba", [:make, :mix], [{:cc_precompiler, "~> 0.1", [hex: :cc_precompiler, repo: "hexpm", optional: false]}, {:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:elixir_make, "~> 0.8", [hex: :elixir_make, repo: "hexpm", optional: false]}, {:table, "~> 0.1.0", [hex: :table, repo: "hexpm", optional: true]}], "hexpm", "b947b9db15bb7aad11da6cd18a0d8b78f7fcce89508a27a5b9be18350fe12c59"},
   "floki": {:hex, :floki, "0.36.3", "1102f93b16a55bc5383b85ae3ec470f82dee056eaeff9195e8afdf0ef2a43c30", [:mix], [], "hexpm", "fe0158bff509e407735f6d40b3ee0d7deb47f3f3ee7c6c182ad28599f9f6b27a"},
   "jason": {:hex, :jason, "1.4.4", "b9226785a9aa77b6857ca22832cffa5d5011a667207eb2a0ad56adb5db443b8a", [:mix], [{:decimal, "~> 1.0 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "c5eb0cab91f094599f94d55bc63409236a8ec69a21a67814529e8d5f6cc90b3b"},
-  "makeup": {:hex, :makeup, "1.1.2", "9ba8837913bdf757787e71c1581c21f9d2455f4dd04cfca785c70bbfff1a76a3", [:mix], [{:nimble_parsec, "~> 1.2.2 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "cce1566b81fbcbd21eca8ffe808f33b221f9eee2cbc7a1706fc3da9ff18e6cac"},
-  "makeup_elixir": {:hex, :makeup_elixir, "0.16.2", "627e84b8e8bf22e60a2579dad15067c755531fea049ae26ef1020cad58fe9578", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}, {:nimble_parsec, "~> 1.2.3 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "41193978704763f6bbe6cc2758b84909e62984c7752b3784bd3c218bb341706b"},
-  "makeup_erlang": {:hex, :makeup_erlang, "1.0.0", "6f0eff9c9c489f26b69b61440bf1b238d95badae49adac77973cbacae87e3c2e", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}], "hexpm", "ea7a9307de9d1548d2a72d299058d1fd2339e3d398560a0e46c27dab4891e4d2"},
-  "mime": {:hex, :mime, "2.0.5", "dc34c8efd439abe6ae0343edbb8556f4d63f178594894720607772a041b04b02", [:mix], [], "hexpm", "da0d64a365c45bc9935cc5c8a7fc5e49a0e0f9932a761c55d6c52b142780a05c"},
+  "makeup": {:hex, :makeup, "1.2.1", "e90ac1c65589ef354378def3ba19d401e739ee7ee06fb47f94c687016e3713d1", [:mix], [{:nimble_parsec, "~> 1.4", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "d36484867b0bae0fea568d10131197a4c2e47056a6fbe84922bf6ba71c8d17ce"},
+  "makeup_elixir": {:hex, :makeup_elixir, "1.0.0", "74bb8348c9b3a51d5c589bf5aebb0466a84b33274150e3b6ece1da45584afc82", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}, {:nimble_parsec, "~> 1.2.3 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "49159b7d7d999e836bedaf09dcf35ca18b312230cf901b725a64f3f42e407983"},
+  "makeup_erlang": {:hex, :makeup_erlang, "1.0.1", "c7f58c120b2b5aa5fd80d540a89fdf866ed42f1f3994e4fe189abebeab610839", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}], "hexpm", "8a89a1eeccc2d798d6ea15496a6e4870b75e014d1af514b1b71fa33134f57814"},
+  "mime": {:hex, :mime, "2.0.6", "8f18486773d9b15f95f4f4f1e39b710045fa1de891fada4516559967276e4dc2", [:mix], [], "hexpm", "c9945363a6b26d747389aac3643f8e0e09d30499a138ad64fe8fd1d13d9b153e"},
   "nimble_parsec": {:hex, :nimble_parsec, "1.4.0", "51f9b613ea62cfa97b25ccc2c1b4216e81df970acd8e16e8d1bdc58fef21370d", [:mix], [], "hexpm", "9c565862810fb383e9838c1dd2d7d2c437b3d13b267414ba6af33e50d2d1cf28"},
   "oban": {:hex, :oban, "2.18.3", "1608c04f8856c108555c379f2f56bc0759149d35fa9d3b825cb8a6769f8ae926", [:mix], [{:ecto_sql, "~> 3.10", [hex: :ecto_sql, repo: "hexpm", optional: false]}, {:ecto_sqlite3, "~> 0.9", [hex: :ecto_sqlite3, repo: "hexpm", optional: true]}, {:jason, "~> 1.1", [hex: :jason, repo: "hexpm", optional: false]}, {:postgrex, "~> 0.16", [hex: :postgrex, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "36ca6ca84ef6518f9c2c759ea88efd438a3c81d667ba23b02b062a0aa785475e"},
   "phoenix": {:hex, :phoenix, "1.7.14", "a7d0b3f1bc95987044ddada111e77bd7f75646a08518942c72a8440278ae7825", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.1", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.7", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2 or ~> 2.0", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}, {:websock_adapter, "~> 0.5.3", [hex: :websock_adapter, repo: "hexpm", optional: false]}], "hexpm", "c7859bc56cc5dfef19ecfc240775dae358cbaa530231118a9e014df392ace61a"},
@@ -29,5 +29,5 @@
   "telemetry": {:hex, :telemetry, "1.3.0", "fedebbae410d715cf8e7062c96a1ef32ec22e764197f70cda73d82778d61e7a2", [:rebar3], [], "hexpm", "7015fc8919dbe63764f4b4b87a95b7c0996bd539e0d499be6ec9d7f3875b79e6"},
   "telemetry_metrics": {:hex, :telemetry_metrics, "1.0.0", "29f5f84991ca98b8eb02fc208b2e6de7c95f8bb2294ef244a176675adc7775df", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "f23713b3847286a534e005126d4c959ebcca68ae9582118ce436b521d1d47d5d"},
   "websock": {:hex, :websock, "0.5.3", "2f69a6ebe810328555b6fe5c831a851f485e303a7c8ce6c5f675abeb20ebdadc", [:mix], [], "hexpm", "6105453d7fac22c712ad66fab1d45abdf049868f253cf719b625151460b8b453"},
-  "websock_adapter": {:hex, :websock_adapter, "0.5.6", "0437fe56e093fd4ac422de33bf8fc89f7bc1416a3f2d732d8b2c8fd54792fe60", [:mix], [{:bandit, ">= 0.6.0", [hex: :bandit, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.6", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:websock, "~> 0.5", [hex: :websock, repo: "hexpm", optional: false]}], "hexpm", "e04378d26b0af627817ae84c92083b7e97aca3121196679b73c73b99d0d133ea"},
+  "websock_adapter": {:hex, :websock_adapter, "0.5.7", "65fa74042530064ef0570b75b43f5c49bb8b235d6515671b3d250022cb8a1f9e", [:mix], [{:bandit, ">= 0.6.0", [hex: :bandit, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.6", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:websock, "~> 0.5", [hex: :websock, repo: "hexpm", optional: false]}], "hexpm", "d0f478ee64deddfec64b800673fd6e0c8888b079d9f3444dd96d2a98383bdbd1"},
 }

test/oban/live_dashboard_test.exs

@@ -14,23 +14,34 @@ defmodule Oban.LiveDashboardTest do
   test "shows jobs with limit" do
     for _ <- 1..110, do: job_fixture()
     {:ok, live, rendered} = live(build_conn(), "/dashboard/oban")
-    assert rendered |> :binary.matches("<td class=\"oban-jobs-id\"") |> length() <= 100
+
+    assert rendered |> :binary.matches("<td class=\"oban-jobs-all-worker\"") |> length() ==
+             20
 
     rendered = render_patch(live, "/dashboard/oban?limit=100")
-    assert rendered |> :binary.matches("<td class=\"oban-jobs-id\"") |> length() == 100
+
+    assert rendered |> :binary.matches("<td class=\"oban-jobs-all-worker\"") |> length() ==
+             100
   end
 
   test "shows job info modal" do
     job = job_fixture(%{something: "foobar"})
-    {:ok, live, rendered} = live(build_conn(), "/dashboard/oban?params[job]=#{job.id}")
+    {:ok, live, _rendered} = live(build_conn(), "/dashboard/oban?params[job]=#{job.id}")
     rendered = render(live)
     assert rendered =~ "modal-content"
     assert rendered =~ "%{&quot;something&quot; =&gt; &quot;foobar&quot;}"
     refute live |> element("#modal-close") |> render_click() =~ "modal"
   end
 
   defp job_fixture(args \\ %{}) do
-    {:ok, job} = Oban.Job.new(args, worker: "FakeWorker") |> Oban.insert()
+    {:ok, job} =
+      Oban.Job.new(args,
+        worker: "FakeWorker",
+        state: "executing",
+        attempted_at: DateTime.utc_now()
+      )
+      |> Oban.insert()
+
     job
   end
 end