Update styles and filtering

Author: railspulse

app/assets/stylesheets/rails_pulse/components/tags.css

@@ -26,6 +26,10 @@
   flex-wrap: wrap;
 }
 
+.tag-list span {
+  padding-right: 3px !important;
+}
+
 /* Individual Tag */
 .tag {
   display: inline-flex;
@@ -63,9 +67,10 @@
 }
 
 .tag-remove span {
-  font-size: 1.25rem;
   line-height: 1;
-  font-weight: bold;
+  font-weight: inherit;
+  margin-left: 6px;
+  font-size: 17px;
 }
 
 /* Add Tag Container */

app/controllers/rails_pulse/jobs_controller.rb

@@ -75,7 +75,6 @@ def setup_metric_cards
       return if turbo_frame_request?
 
       # Pass the job to scope the cards to the current job on the show page
-      @total_jobs_metric_card = RailsPulse::Jobs::Cards::TotalJobs.new(job: @job).to_metric_card
       @total_runs_metric_card = RailsPulse::Jobs::Cards::TotalRuns.new(job: @job).to_metric_card
       @failure_rate_metric_card = RailsPulse::Jobs::Cards::FailureRate.new(job: @job).to_metric_card
       @average_duration_metric_card = RailsPulse::Jobs::Cards::AverageDuration.new(job: @job).to_metric_card

app/helpers/rails_pulse/status_helper.rb

@@ -281,5 +281,21 @@ def duration_options(type = :route)
         [ "Critical (≥ #{thresholds[:critical]}ms)", :critical ]
       ]
     end
+
+    def duration_threshold_filter_options(type = :route)
+      thresholds = RailsPulse.configuration.public_send("#{type}_thresholds")
+
+      all_label =
+        case type
+        when :job then "All Job Runs"
+        else "All #{type.to_s.humanize.pluralize}"
+        end
+
+      threshold_options = thresholds.map do |name, value|
+        [ "#{name.to_s.humanize} (≥ #{value}ms)", value ]
+      end.sort_by { |_, value| value }
+
+      [[ all_label, nil ]] + threshold_options
+    end
   end
 end

app/helpers/rails_pulse/tags_helper.rb

@@ -61,7 +61,7 @@ def display_tag_badges(tags)
 
       return content_tag(:span, "-", class: "text-subtle") if tag_array.empty?
 
-      safe_join(tag_array.map { |tag| content_tag(:div, tag, class: "badge") }, " ")
+      safe_join(tag_array.map { |tag| content_tag(:div, tag.humanize, class: "badge") }, " ")
     end
   end
 end

app/views/rails_pulse/components/_active_filters.html.erb

@@ -6,8 +6,8 @@
 <% has_any_filters = has_date_filters || has_performance_filter || has_tag_filters %>
 
 <% if has_any_filters %>
-  <div class="flex items-center gap text-sm">
-    Filtered:
+  <div class="flex items-center gap text-sm card pi-3 pb-2 shadow-xs">
+    Global Filters:
     <% if has_date_filters %>
       <% start_time = Time.parse(global_filters['start_time']) %>
       <% end_time = Time.parse(global_filters['end_time']) %>

app/views/rails_pulse/components/_page_header.html.erb

@@ -13,13 +13,10 @@
   </nav>
 
   <% if (defined?(taggable) && taggable.present?) || (defined?(show_active_filters) && show_active_filters) %>
-    <div class="breadcrumb-tags">
+    <div class="breadcrumb-tags gap">
       <% if defined?(show_active_filters) && show_active_filters %>
         <%= render 'rails_pulse/components/active_filters' %>
       <% end %>
-      <% if defined?(show_active_filters) && show_active_filters && defined?(taggable) && taggable.present? %>
-        <div class="breadcrumb-separator mi-4">|</div>
-      <% end %>
       <% if defined?(taggable) && taggable.present? %>
         <%= render 'rails_pulse/tags/tag_manager', taggable: taggable %>
       <% end %>

app/views/rails_pulse/dashboard/index.html.erb

@@ -1,4 +1,4 @@
-<div class="flex justify-end mb-1">
+<div class="flex justify-end">
   <%= render 'rails_pulse/components/active_filters' %>
 </div>
 

app/views/rails_pulse/jobs/index.html.erb

@@ -2,7 +2,6 @@
 
 <% unless turbo_frame_request? %>
   <div class="row">
-    <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @total_jobs_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @total_runs_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @failure_rate_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @average_duration_metric_card } %>

app/views/rails_pulse/jobs/show.html.erb

@@ -2,7 +2,6 @@
 
 <% unless turbo_frame_request? %>
   <div class="row">
-    <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @total_jobs_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @total_runs_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @failure_rate_metric_card } %>
     <%= render 'rails_pulse/components/metric_card', { class: "grid-item block", data: @average_duration_metric_card } %>
@@ -27,6 +26,12 @@
         { class: "input" }
       %>
 
+      <%= form.select :duration_gteq,
+        duration_threshold_filter_options(:job),
+        { selected: params.dig(:q, :duration_gteq) },
+        { class: "input" }
+      %>
+
       <%= link_to "Reset", job_path(@job), class: "btn btn--borderless show@md" if params.has_key?(:q) %>
       <%= form.submit "Search", class: "btn show@sm" %>
     </div>

app/views/rails_pulse/tags/_tag_manager.html.erb

@@ -7,8 +7,11 @@
 
 <div
   id="tag_manager_<%= taggable_type %>_<%= taggable.id %>"
-  class="tag-manager"
+  class="tag-manager card pi-3 pb-2 text-sm shadow-xs"
 >
+  <% if current_tags.present? %>
+    Tags:
+    <% end %>
   <div class="tag-list">
     <% current_tags.each do |tag| %>
       <%= render_tag_badge(tag, variant: :secondary, removable: true, taggable_type: taggable_type, taggable_id: taggable.id) %>
@@ -52,7 +55,7 @@
                     },
                     style: "cursor: pointer;",
                     role: "menuitem" do %>
-                <%= tag %>
+                <%= tag.humanize %>
               <% end %>
             <% end %>
           </div>