Merge pull request #173 from zealot128/main

UI: Admin UI with filters and space efficient layout
bensheldon · Dec 1, 2020 · 2840e07 · 2840e07
2 parents 2bb4782 + b80009a
commit 2840e07
Show file tree

Hide file tree

Showing 4 changed files with 80 additions and 8 deletions.
diff --git a/engine/app/controllers/good_job/dashboards_controller.rb b/engine/app/controllers/good_job/dashboards_controller.rb
@@ -1,8 +1,57 @@
 module GoodJob
   class DashboardsController < GoodJob::BaseController
-    def index
-      @jobs = GoodJob::Job.display_all(after_scheduled_at: params[:after_scheduled_at], after_id: params[:after_id])
+    class JobFilter
+      attr_accessor :params
+
+      def initialize(params)
+        @params = params
+      end
+
+      def last
+        @_last ||= jobs.last
+      end
+
+      def jobs
+        sql = GoodJob::Job.display_all(after_scheduled_at: params[:after_scheduled_at], after_id: params[:after_id])
                           .limit(params.fetch(:limit, 10))
+        if params[:job_class] # rubocop:disable Style/IfUnlessModifier
+          sql = sql.where("serialized_params->>'job_class' = ?", params[:job_class])
+        end
+        if params[:state]
+          case params[:state]
+          when 'finished'
+            sql = sql.finished
+          when 'unfinished'
+            sql = sql.unfinished
+          when 'errors'
+            sql = sql.where.not(error: nil)
+          end
+        end
+        sql
+      end
+
+      def states
+        {
+          'finished' => GoodJob::Job.finished.count,
+          'unfinished' => GoodJob::Job.unfinished.count,
+          'errors' => GoodJob::Job.where.not(error: nil).count,
+        }
+      end
+
+      def job_classes
+        GoodJob::Job.group("serialized_params->>'job_class'").count
+      end
+
+      def to_query(override)
+        {
+          state: params[:state],
+          job_class: params[:job_class],
+        }.merge(override).delete_if { |_, v| v.nil? }.to_query
+      end
+    end
+
+    def index
+      @filter = JobFilter.new(params)
 
       job_data = GoodJob::Job.connection.exec_query Arel.sql(<<~SQL.squish)
         SELECT *

diff --git a/engine/app/views/good_job/dashboards/index.html.erb b/engine/app/views/good_job/dashboards/index.html.erb
@@ -2,13 +2,36 @@
   <%= render 'shared/chart', chart_data: @chart %>
 </div>
 
-<% if @jobs.present? %>
-  <%= render 'shared/jobs_table', jobs: @jobs %>
+<div class='card mb-2'>
+  <div class='card-body d-flex flex-wrap'>
+    <div class='mr-4'>
+      <small>Filter by job class</small>
+      <br>
+      <% @filter.job_classes.each do |name, count| %>
+        <a href='<%= request.path + "?#{@filter.to_query(job_class: name)}" %>' class='btn btn-sm btn-outline-secondary <%= "active" if params[:job_class] == name %>'>
+          <%= name %> (<%= count %>)
+        </a>
+      <% end %>
+    </div>
+    <div>
+      <small>Filter by state</small>
+      <br>
+      <% @filter.states.each do |name, count| %>
+        <a href='<%= request.path + "?#{@filter.to_query(state: name)}" %>' class='btn btn-sm btn-outline-secondary <%= "active" if params[:state] == name %>'>
+          <%= name %> (<%= count %>)
+        </a>
+      <% end %>
+    </div>
+  </div>
+</div>
+
+<% if @filter.jobs.present? %>
+  <%= render 'shared/jobs_table', jobs: @filter.jobs %>
 
   <nav aria-label="Job pagination">
     <ul class="pagination">
       <li class="page-item">
-        <%= link_to({ after_scheduled_at: (@jobs.last.scheduled_at || @jobs.last.created_at), after_id: @jobs.last.id }, class: "page-link") do %>
+        <%= link_to({ after_scheduled_at: (@filter.last.scheduled_at || @filter.last.created_at), after_id: @filter.last.id }, class: "page-link") do %>
           Next jobs <span aria-hidden="true">&raquo;</span>
         <% end %>
       </li>

diff --git a/engine/app/views/layouts/good_job/base.html.erb b/engine/app/views/layouts/good_job/base.html.erb
@@ -18,7 +18,7 @@
 </head>
 <body>
   <nav class="navbar navbar-expand-lg navbar-light bg-light">
-    <div class="container">
+    <div class="container-fluid">
       <%= link_to "GoodJob 👍", root_path, class: 'navbar-brand mb-0 h1' %>
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
@@ -48,7 +48,7 @@
     </div>
   </nav>
 
-  <div class="container">
+  <div class="container-fluid">
     <div class="card border-warning text-dark my-3">
       <div class="card-body">
         <p class="card-text">🚧 GoodJob's dashboard is a work in progress. Please contribute ideas and code on <a href="https://github.com/bensheldon/good_job/issues" target="_blank" rel="nofollow noopener noreferrer">Github</a>.</p>

diff --git a/engine/app/views/shared/_jobs_table.erb b/engine/app/views/shared/_jobs_table.erb
@@ -1,5 +1,5 @@
 <div class="table-responsive">
-  <table class="table table-bordered table-hover">
+  <table class="table table-bordered table-hover table-sm">
     <thead>
       <th>GoodJob ID</th>
       <th>ActiveJob ID</th>