Skip to content

Commit

Permalink
Dashboard's tables update (#834)
Browse files Browse the repository at this point in the history 
* Fix batches/jobs table (missing /div, add item label for small screen)

* Update batches table

* Standardise Jobs table with label for small screen

* Update cron index table with label for small screen

* Remove ms-auto for table's cta

* Fix Attempts typo

---------

Co-authored-by: Ben Sheldon [he/him] <[email protected]>
  • Loading branch information
@Ajmal @bensheldon
Ajmal and bensheldon authored Feb 9, 2023
1 parent 3f1613d commit f7e2889
Show file tree
Hide file tree
Showing 5 changed files with 115 additions and 107 deletions.
26 changes: 13 additions & 13 deletions app/views/good_job/batches/_jobs.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
<header class="list-group-item bg-light">
<div class="row small text-muted text-uppercase align-items-center">
<div class="col-4">Jobs</div>
<div class="d-none d-md-block col-md-1">Queue</div>
<div class="d-none d-md-block col-md-1">Priority</div>
<div class="d-none d-md-block col-md-1 text-end">Attempts</div>
<div class="d-none d-lg-block col-lg-1 text-lg-center">Queue</div>
<div class="d-none d-lg-block col-lg-1 text-lg-end">Priority</div>
<div class="d-none d-lg-block col-lg-1 text-lg-end">Attempts</div>
<div class="col text-end">
<%= tag.button type: "button", class: "btn btn-sm text-muted", role: "button",
data: { bs_toggle: "collapse", bs_target: ".job-params" },
Expand All @@ -21,18 +21,20 @@
<% jobs.each do |job| %>
<div role="row" class="list-group-item list-group-item-action py-3">
<div class="row align-items-center">
<div class="col-md-4">
<div class="col-lg-4">
<%= tag.code link_to(job.id, job_path(job), class: "small text-muted text-decoration-none") %>
<%= tag.h5 tag.code(link_to(job.job_class, job_path(job), class: "text-reset text-decoration-none")), class: "text-reset mb-0" %>
</div>
<div class="col-md-1">
<div class="col-4 col-lg-1 text-lg-center">
<div class="d-lg-none small text-muted mt-1">Queue</div>
<span class="badge bg-primary bg-opacity-25 text-dark font-monospace"><%= job.queue_name %></span>
</div>
<div class="col-md-1 small text-md-center">
<div class="col-4 col-lg-1 text-lg-end">
<div class="d-lg-none small text-muted mt-1">Priority</div>
<span class="font-monospace fw-bold"><%= job.priority %></span>
<span class="d-md-none">Priority</span>
</div>
<div class="col-md-1 text-md-center">
<div class="col-4 col-lg-1 text-lg-end">
<div class="d-lg-none small text-muted mt-1">Attempts</div>
<% if job.executions_count > 0 && job.status != :finished %>
<%= tag.span job.executions_count, class: "badge rounded-pill bg-danger", data: {
bs_toggle: "popover",
Expand All @@ -43,13 +45,11 @@
<% else %>
<span class="badge bg-secondary bg-opacity-50 rounded-pill"><%= job.executions_count %></span>
<% end %>
<span class="d-md-none small">Attemp</span>
</div>
<div class="col d-flex gap-3 align-items-center justify-content-end">
<div class="mt-3 mt-lg-0 col d-flex gap-3 align-items-center justify-content-end">
<%= tag.span relative_time(job.last_status_at), class: "small" %>
<%= status_badge job.status %>
</div>
<div class="col-auto">

<div class="dropdown float-end">
<button class="d-flex align-items-center btn btn-sm" type="button" id="<%= dom_id(job, :actions) %>" data-bs-toggle="dropdown" aria-expanded="false">
<%= render "good_job/shared/icons/dots" %>
Expand Down Expand Up @@ -106,5 +106,5 @@
No jobs found.
</div>
<% end %>
</>
</div>
</div>
34 changes: 17 additions & 17 deletions app/views/good_job/batches/_table.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,11 @@
<header class="list-group-item bg-light">
<div class="row small text-muted text-uppercase align-items-center">
<div class="col-4">Name</div>
<div class="col-md-1 d-none d-md-block">Created</div>
<div class="col-md-1 d-none d-md-block">Enqueued</div>
<div class="col-md-1 d-none d-md-block">Discarded</div>
<div class="col-md-1 d-none d-md-block">Finished</div>
<div class="col-md-1 d-none d-md-block">Jobs</div>
<div class="col-lg-1 d-none d-lg-block">Created</div>
<div class="col-lg-1 d-none d-lg-block">Enqueued</div>
<div class="col-lg-1 d-none d-lg-block">Discarded</div>
<div class="col-lg-1 d-none d-lg-block">Finished</div>
<div class="col-lg-1 d-none d-lg-block">Jobs</div>
<div class="col text-end">
<%= tag.button type: "button", class: "btn btn-sm text-muted", role: "button",
data: { bs_toggle: "collapse", bs_target: ".batch-properties" },
Expand All @@ -23,7 +23,7 @@
<% batches.each do |batch| %>
<div id="<%= dom_id(batch) %>" class="list-group-item py-3" role="row">
<div class="row align-items-center">
<div class="col-4">
<div class="col-12 col-lg-4">
<%= link_to batch_path(batch), class: "text-decoration-none" do %>
<code class="small text-muted">
<%= batch.id %>
Expand All @@ -32,34 +32,34 @@
<div class="text-muted"><%= batch.description %></div>
<% end %>
</div>
<div class="col-md-1 text-wrap">
<div class="d-md-none small text-muted mt-1">Created at</div>
<div class="col-6 col-lg-1 text-wrap">
<div class="d-lg-none small text-muted mt-1">Created at</div>
<%= relative_time(batch.created_at) %>
</div>
<div class="col-md-1 text-wrap">
<div class="col-6 col-lg-1 text-wrap">
<% if batch.enqueued_at %>
<div class="d-md-none small text-muted mt-1">Enqueued at</div>
<div class="d-lg-none small text-muted mt-1">Enqueued at</div>
<%= relative_time(batch.enqueued_at) %>
<% end %>
</div>
<div class="col-md-1 text-wrap">
<div class="col-6 col-lg-1 text-wrap">
<% if batch.discarded_at %>
<div class="d-md-none small text-muted mt-1">Discarded at</div>
<div class="d-lg-none small text-muted mt-1">Discarded at</div>
<%= relative_time(batch.discarded_at) %>
<% end %>
</div>
<div class="col-md-1 text-wrap">
<div class="col-6 col-lg-1 text-wrap">
<% if batch.finished_at %>
<div class="d-md-none small text-muted mt-1">Finished at</div>
<div class="d-lg-none small text-muted mt-1">Finished at</div>
<%= relative_time(batch.finished_at) %>
<% end %>
</div>
<div class="col">
<div class="d-md-none small text-muted mt-1">Jobs</div>
<div class="col-6 col-lg-1">
<div class="d-lg-none small text-muted mt-1">Jobs</div>
<%= batch.jobs.count %>
</div>
<div class="col text-end">
<%= tag.button type: "button", class: "btn btn-sm text-muted ms-auto", role: "button",
<%= tag.button type: "button", class: "btn btn-sm text-muted", role: "button",
title: "Inspect",
data: { bs_toggle: "collapse", bs_target: "##{dom_id(batch, 'properties')}" },
aria: { expanded: false, controls: dom_id(batch, "state") } do %>
Expand Down
29 changes: 18 additions & 11 deletions app/views/good_job/cron_entries/index.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
<div class="list-group list-group-flush text-nowrap" role="table">
<header class="list-group-item bg-light">
<div class="row small text-muted text-uppercase align-items-center">
<div class="col"></div>
<div class="col">Class</div>
<div class="col">Schedule</div>
<div class="col">Next scheduled</div>
<div class="col">Last run</div>
<div class="col-12 col-lg-2"></div>
<div class="col-6 col-lg-2 d-none d-lg-block">Class</div>
<div class="col-6 col-lg-2 d-none d-lg-block">Schedule</div>
<div class="col-6 col-lg-2 d-none d-lg-block">Next scheduled</div>
<div class="col-6 col-lg-2 d-none d-lg-block">Last run</div>
<div class="col text-end">
<%= tag.button type: "button", class: "btn btn-sm text-muted", role: "button",
data: { bs_toggle: "collapse", bs_target: ".cron-entry-properties" },
Expand All @@ -24,15 +24,22 @@
<% @cron_entries.each do |cron_entry| %>
<div id="<%= dom_id(cron_entry) %>" class="list-group-item py-3" role="row">
<div class="row align-items-center">
<div class="col">
<div class="col-12 col-lg-2">
<div class="small font-monospace"><%= cron_entry.key %></div>
<div class="small text-muted"><%= cron_entry.description %></div>
<div class="small text-muted text-wrap"><%= cron_entry.description %></div>
</div>
<div class="col"><%= tag.span tag.code(cron_entry.job_class), class: "fs-5 mb-0" %></div>
<div class="col font-monospace fw-bold"><%= cron_entry.schedule %></div>
<div class="col small"><%= relative_time cron_entry.next_at %></div>
<div class="col small">
<div class="col-12 col-lg-2 text-wrap"><%= tag.span tag.code(cron_entry.job_class), class: "fs-5 mb-0" %></div>
<div class="col-6 col-lg-2 text-wrap">
<div class="d-lg-none small text-muted mt-1">Schedule</div>
<span class="font-monospace fw-bold"><%= cron_entry.schedule %></span>
</div>
<div class="col-6 col-lg-2 text-wrap small">
<div class="d-lg-none small text-muted mt-1">Next scheduled</div>
<%= relative_time cron_entry.next_at %>
</div>
<div class="col-6 col-lg-2 text-wrap small">
<% if cron_entry.last_job.present? %>
<div class="d-lg-none small text-muted mt-1">Last run</div>
<%= link_to relative_time(cron_entry.last_at), cron_entry_path(cron_entry), title: "Job #{cron_entry.last_job.id}" %>
<% end %>
</div>
Expand Down
2 changes: 1 addition & 1 deletion app/views/good_job/jobs/_executions.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
<%= tag.span relative_time(execution.last_status_at, include_seconds: true), class: "small" %>
<%= status_badge execution.status %>
<%= tag.button type: "button", class: "btn btn-sm text-muted ms-auto", role: "button",
<%= tag.button type: "button", class: "btn btn-sm text-muted", role: "button",
title: "Inspect",
data: { bs_toggle: "collapse", bs_target: "##{dom_id(execution, 'params')}" },
aria: { expanded: false, controls: dom_id(execution, "params") } do %>
Expand Down
Loading

0 comments on commit f7e2889

Please sign in to comment.