RubyGems - ruby_llm-agents - Versions diffs - 0.2.3 → 0.3.0 - Mend

ruby_llm-agents 0.2.3 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (62) hide show

checksums.yaml +4 -4
data/README.md +273 -0
data/app/channels/ruby_llm/agents/executions_channel.rb +24 -1
data/app/controllers/concerns/ruby_llm/agents/filterable.rb +81 -0
data/app/controllers/concerns/ruby_llm/agents/paginatable.rb +51 -0
data/app/controllers/ruby_llm/agents/agents_controller.rb +228 -59
data/app/controllers/ruby_llm/agents/dashboard_controller.rb +167 -12
data/app/controllers/ruby_llm/agents/executions_controller.rb +189 -31
data/app/controllers/ruby_llm/agents/settings_controller.rb +20 -0
data/app/helpers/ruby_llm/agents/application_helper.rb +307 -7
data/app/models/ruby_llm/agents/execution/analytics.rb +224 -20
data/app/models/ruby_llm/agents/execution/metrics.rb +41 -25
data/app/models/ruby_llm/agents/execution/scopes.rb +234 -14
data/app/models/ruby_llm/agents/execution.rb +259 -16
data/app/services/ruby_llm/agents/agent_registry.rb +49 -12
data/app/views/layouts/rubyllm/agents/application.html.erb +351 -85
data/app/views/rubyllm/agents/agents/_version_comparison.html.erb +186 -0
data/app/views/rubyllm/agents/agents/show.html.erb +233 -10
data/app/views/rubyllm/agents/dashboard/_action_center.html.erb +62 -0
data/app/views/rubyllm/agents/dashboard/_alerts_feed.html.erb +62 -0
data/app/views/rubyllm/agents/dashboard/_breaker_strip.html.erb +47 -0
data/app/views/rubyllm/agents/dashboard/_budgets_bar.html.erb +165 -0
data/app/views/rubyllm/agents/dashboard/_now_strip.html.erb +10 -0
data/app/views/rubyllm/agents/dashboard/_now_strip_values.html.erb +71 -0
data/app/views/rubyllm/agents/dashboard/index.html.erb +215 -109
data/app/views/rubyllm/agents/executions/_filters.html.erb +152 -155
data/app/views/rubyllm/agents/executions/_list.html.erb +103 -12
data/app/views/rubyllm/agents/executions/dry_run.html.erb +149 -0
data/app/views/rubyllm/agents/executions/index.html.erb +17 -72
data/app/views/rubyllm/agents/executions/index.turbo_stream.erb +16 -2
data/app/views/rubyllm/agents/executions/show.html.erb +693 -14
data/app/views/rubyllm/agents/settings/show.html.erb +369 -0
data/app/views/rubyllm/agents/shared/_filter_dropdown.html.erb +121 -0
data/app/views/rubyllm/agents/shared/_select_dropdown.html.erb +85 -0
data/config/routes.rb +7 -0
data/lib/generators/ruby_llm_agents/templates/add_attempts_migration.rb.tt +27 -0
data/lib/generators/ruby_llm_agents/templates/add_caching_migration.rb.tt +23 -0
data/lib/generators/ruby_llm_agents/templates/add_finish_reason_migration.rb.tt +19 -0
data/lib/generators/ruby_llm_agents/templates/add_routing_migration.rb.tt +19 -0
data/lib/generators/ruby_llm_agents/templates/add_streaming_migration.rb.tt +8 -0
data/lib/generators/ruby_llm_agents/templates/add_tracing_migration.rb.tt +34 -0
data/lib/generators/ruby_llm_agents/templates/agent.rb.tt +66 -4
data/lib/generators/ruby_llm_agents/templates/application_agent.rb.tt +53 -6
data/lib/generators/ruby_llm_agents/templates/initializer.rb.tt +139 -8
data/lib/generators/ruby_llm_agents/templates/migration.rb.tt +38 -1
data/lib/generators/ruby_llm_agents/upgrade_generator.rb +78 -0
data/lib/ruby_llm/agents/alert_manager.rb +207 -0
data/lib/ruby_llm/agents/attempt_tracker.rb +295 -0
data/lib/ruby_llm/agents/base.rb +580 -112
data/lib/ruby_llm/agents/budget_tracker.rb +360 -0
data/lib/ruby_llm/agents/circuit_breaker.rb +197 -0
data/lib/ruby_llm/agents/configuration.rb +279 -1
data/lib/ruby_llm/agents/engine.rb +59 -6
data/lib/ruby_llm/agents/execution_logger_job.rb +17 -6
data/lib/ruby_llm/agents/inflections.rb +13 -2
data/lib/ruby_llm/agents/instrumentation.rb +538 -87
data/lib/ruby_llm/agents/redactor.rb +130 -0
data/lib/ruby_llm/agents/reliability.rb +185 -0
data/lib/ruby_llm/agents/version.rb +3 -1
data/lib/ruby_llm/agents.rb +52 -0
metadata +41 -2
data/app/controllers/ruby_llm/agents/application_controller.rb +0 -37

data/app/views/rubyllm/agents/executions/_filters.html.erb CHANGED Viewed

@@ -1,171 +1,168 @@
 <%
-  has_filters = params[:agent_types].present? || params[:statuses].present? || params[:days].present?
+  # Parse filter params
   selected_agents = params[:agent_types].present? ? (params[:agent_types].is_a?(Array) ? params[:agent_types] : params[:agent_types].split(",")) : []
   selected_statuses = params[:statuses].present? ? (params[:statuses].is_a?(Array) ? params[:statuses] : params[:statuses].split(",")) : []
+  selected_models = params[:model_ids].present? ? (params[:model_ids].is_a?(Array) ? params[:model_ids] : params[:model_ids].split(",")) : []
+  has_filters = selected_agents.any? || selected_statuses.any? || params[:days].present? || selected_models.any?
+  active_filter_count = [
+    selected_agents.any? ? 1 : 0,
+    selected_statuses.any? ? 1 : 0,
+    params[:days].present? ? 1 : 0,
+    selected_models.any? ? 1 : 0
+  ].sum
+  status_options = [
+    { value: "success", label: "Success", color: "bg-green-500" },
+    { value: "error", label: "Error", color: "bg-red-500" },
+    { value: "running", label: "Running", color: "bg-blue-500" },
+    { value: "timeout", label: "Timeout", color: "bg-yellow-500" }
+  ]
+  time_options = [
+    { value: "", label: "All Time" },
+    { value: "1", label: "Today" },
+    { value: "7", label: "Last 7 Days" },
+    { value: "30", label: "Last 30 Days" }
+  ]
+  agent_options = agent_types.map { |t| { value: t, label: t.gsub(/Agent$/, '') } }
+  # Build model options - extract short name from model_id
+  model_options = local_assigns[:model_ids]&.map do |m|
+    short_name = m.split("/").last.split(":").first # Handle "provider/model:version" format
+    { value: m, label: short_name }
+  end || []
 %>
-<div class="bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 p-4 mb-6" data-controller="filter-dropdown">
-  <%= form_with url: ruby_llm_agents.executions_path, method: :get, data: { turbo_frame: "executions_content", turbo_action: "advance" }, id: "filters-form" do |f| %>
-    <div class="flex flex-wrap items-center gap-3">
-      <!-- Agent Type Filter (Multi-select) -->
-      <div class="relative filter-dropdown" data-filter="agent_types">
-        <button type="button" onclick="toggleDropdown(this)" class="flex items-center gap-2 px-3 py-2 text-sm bg-gray-50 dark:bg-gray-700 border border-gray-200 dark:border-gray-600 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 transition-colors <%= selected_agents.any? ? 'ring-2 ring-blue-500 ring-offset-1' : '' %>">
-          <svg class="w-4 h-4 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
-          </svg>
-          <span class="dropdown-label text-gray-700 dark:text-gray-200">
-            <% if selected_agents.empty? %>
-              All Agents
-            <% elsif selected_agents.length == 1 %>
-              <%= selected_agents.first.gsub(/Agent$/, '') %>
-            <% else %>
-              <%= selected_agents.length %> Agents
-            <% end %>
+<div id="filters-container" class="bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 p-4 mb-6"
+     x-data="{ mobileOpen: false }">
+  <%= form_with url: ruby_llm_agents.executions_path, method: :get,
+                data: { turbo_stream: true, turbo_action: "advance" },
+                id: "filters-form" do |f| %>
+    <%# Mobile: Toggle button (only shows on small screens) %>
+    <button type="button" @click="mobileOpen = !mobileOpen"
+            class="md:hidden w-full flex items-center justify-between gap-2 px-3 py-2 text-sm
+                   bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-lg
+                   <%= has_filters ? 'ring-2 ring-blue-500 dark:ring-offset-gray-900' : '' %>">
+      <div class="flex items-center gap-2">
+        <svg class="w-4 h-4 text-gray-400 dark:text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z"/>
+        </svg>
+        <span class="text-gray-700 dark:text-gray-200">Filters</span>
+        <% if active_filter_count > 0 %>
+          <span id="mobile-filter-badge" class="inline-flex items-center justify-center w-5 h-5 text-xs font-medium text-white bg-blue-600 rounded-full">
+            <%= active_filter_count %>
           </span>
-          <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
-          </svg>
-        </button>
-        <div class="dropdown-menu hidden absolute z-10 mt-1 w-56 bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 py-1">
-          <div class="px-3 py-2 border-b border-gray-100 dark:border-gray-700">
-            <label class="flex items-center gap-2 cursor-pointer">
-              <input type="checkbox" class="select-all-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="toggleAllOptions(this, 'agent_types')" <%= selected_agents.empty? ? 'checked' : '' %>>
-              <span class="text-sm font-medium text-gray-700 dark:text-gray-200">All Agents</span>
-            </label>
-          </div>
-          <% agent_types.each do |agent_type| %>
-            <label class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer">
-              <input type="checkbox" name="agent_types[]" value="<%= agent_type %>" class="filter-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="updateMultiSelect('agent_types')" <%= selected_agents.include?(agent_type) ? 'checked' : '' %>>
-              <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
-              </svg>
-              <%= agent_type.gsub(/Agent$/, '') %>
-            </label>
-          <% end %>
-        </div>
+        <% end %>
       </div>
+      <svg class="w-4 h-4 text-gray-400 dark:text-gray-500 transition-transform duration-200" :class="{ 'rotate-180': mobileOpen }" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
+      </svg>
+    </button>
-      <!-- Status Filter (Multi-select) -->
-      <div class="relative filter-dropdown" data-filter="statuses">
-        <button type="button" onclick="toggleDropdown(this)" class="flex items-center gap-2 px-3 py-2 text-sm bg-gray-50 dark:bg-gray-700 border border-gray-200 dark:border-gray-600 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 transition-colors <%= selected_statuses.any? ? 'ring-2 ring-blue-500 ring-offset-1' : '' %>">
-          <% if selected_statuses.length == 1
-               status_color = case selected_statuses.first
-                 when 'success' then 'bg-green-500'
-                 when 'error' then 'bg-red-500'
-                 when 'running' then 'bg-blue-500'
-                 when 'timeout' then 'bg-yellow-500'
-                 else 'bg-gray-400'
-               end
-             else
-               status_color = 'bg-gray-400'
-             end %>
-          <span class="w-2 h-2 rounded-full <%= status_color %>"></span>
-          <span class="dropdown-label text-gray-700 dark:text-gray-200">
-            <% if selected_statuses.empty? %>
-              All Statuses
-            <% elsif selected_statuses.length == 1 %>
-              <%= selected_statuses.first.capitalize %>
-            <% else %>
-              <%= selected_statuses.length %> Statuses
-            <% end %>
-          </span>
-          <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
-          </svg>
-        </button>
-        <div class="dropdown-menu hidden absolute z-10 mt-1 w-44 bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 py-1">
-          <div class="px-3 py-2 border-b border-gray-100 dark:border-gray-700">
-            <label class="flex items-center gap-2 cursor-pointer">
-              <input type="checkbox" class="select-all-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="toggleAllOptions(this, 'statuses')" <%= selected_statuses.empty? ? 'checked' : '' %>>
-              <span class="text-sm font-medium text-gray-700 dark:text-gray-200">All Statuses</span>
-            </label>
-          </div>
-          <label class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer">
-            <input type="checkbox" name="statuses[]" value="success" class="filter-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="updateMultiSelect('statuses')" <%= selected_statuses.include?('success') ? 'checked' : '' %>>
-            <span class="w-2 h-2 rounded-full bg-green-500"></span>
-            Success
-          </label>
-          <label class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer">
-            <input type="checkbox" name="statuses[]" value="error" class="filter-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="updateMultiSelect('statuses')" <%= selected_statuses.include?('error') ? 'checked' : '' %>>
-            <span class="w-2 h-2 rounded-full bg-red-500"></span>
-            Error
-          </label>
-          <label class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer">
-            <input type="checkbox" name="statuses[]" value="running" class="filter-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="updateMultiSelect('statuses')" <%= selected_statuses.include?('running') ? 'checked' : '' %>>
-            <span class="w-2 h-2 rounded-full bg-blue-500 animate-pulse"></span>
-            Running
-          </label>
-          <label class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer">
-            <input type="checkbox" name="statuses[]" value="timeout" class="filter-checkbox rounded border-gray-300 dark:border-gray-600 text-blue-600 focus:ring-blue-500 dark:bg-gray-700" onchange="updateMultiSelect('statuses')" <%= selected_statuses.include?('timeout') ? 'checked' : '' %>>
-            <span class="w-2 h-2 rounded-full bg-yellow-500"></span>
-            Timeout
-          </label>
+    <%# Filters container: responsive layout %>
+    <%# Mobile: hidden by default, toggle with Alpine %>
+    <%# Desktop: always visible %>
+    <div x-cloak class="mt-3 md:mt-0"
+         :class="{ 'hidden md:block': !mobileOpen, 'block': mobileOpen }">
+      <%# Responsive flex: column on mobile, row on desktop %>
+      <div class="flex flex-col md:flex-row md:items-center gap-3">
+        <%# Status Filter %>
+        <div class="md:w-auto">
+          <%= render "rubyllm/agents/shared/filter_dropdown",
+              name: "statuses[]",
+              filter_id: "statuses",
+              label: "Status",
+              all_label: "All Statuses",
+              options: status_options,
+              selected: selected_statuses,
+              width: "w-44",
+              full_width: true %>
         </div>
-      </div>
-      <!-- Time Range Filter -->
-      <div class="relative filter-dropdown" data-filter="days">
-        <button type="button" onclick="toggleDropdown(this)" class="flex items-center gap-2 px-3 py-2 text-sm bg-gray-50 dark:bg-gray-700 border border-gray-200 dark:border-gray-600 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 transition-colors <%= params[:days].present? ? 'ring-2 ring-blue-500 ring-offset-1' : '' %>">
-          <svg class="w-4 h-4 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
-          </svg>
-          <span class="dropdown-label text-gray-700 dark:text-gray-200">
-            <% case params[:days]
-               when '1' then %>Today<%
-               when '7' then %>Last 7 Days<%
-               when '30' then %>Last 30 Days<%
-               else %>All Time<%
-               end %>
-          </span>
-          <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
-          </svg>
-        </button>
-        <div class="dropdown-menu hidden absolute z-10 mt-1 w-40 bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 py-1">
-          <a href="#" onclick="selectSingleFilter('days', '', 'All Time'); return false;" class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 <%= params[:days].blank? ? 'bg-blue-50 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300' : '' %>">
-            <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
-            </svg>
-            All Time
-          </a>
-          <a href="#" onclick="selectSingleFilter('days', '1', 'Today'); return false;" class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 <%= params[:days] == '1' ? 'bg-blue-50 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300' : '' %>">
-            <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
-            </svg>
-            Today
-          </a>
-          <a href="#" onclick="selectSingleFilter('days', '7', 'Last 7 Days'); return false;" class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 <%= params[:days] == '7' ? 'bg-blue-50 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300' : '' %>">
-            <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
-            </svg>
-            Last 7 Days
-          </a>
-          <a href="#" onclick="selectSingleFilter('days', '30', 'Last 30 Days'); return false;" class="flex items-center gap-2 px-3 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-50 dark:hover:bg-gray-700 <%= params[:days] == '30' ? 'bg-blue-50 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300' : '' %>">
-            <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
-            </svg>
-            Last 30 Days
-          </a>
+        <%# Time Range Filter %>
+        <div class="md:w-auto">
+          <%= render "rubyllm/agents/shared/select_dropdown",
+              name: "days",
+              filter_id: "days",
+              options: time_options,
+              selected: params[:days],
+              icon: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z",
+              width: "w-40",
+              full_width: true %>
         </div>
-        <%= f.hidden_field :days, value: params[:days], id: "filter_days" %>
-      </div>
-      <!-- Clear Filters -->
-      <% if has_filters %>
-        <%= link_to ruby_llm_agents.executions_path, data: { turbo_frame: "executions_content", turbo_action: "advance" }, class: "flex items-center gap-1 px-3 py-2 text-sm text-red-500 hover:text-red-600 hover:bg-red-50 rounded-lg transition-colors" do %>
-          <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
-          </svg>
-          Clear
+        <%# Model Filter %>
+        <% if model_options.any? %>
+          <div class="md:w-auto">
+            <%= render "rubyllm/agents/shared/filter_dropdown",
+                name: "model_ids[]",
+                filter_id: "model_ids",
+                label: "Model",
+                all_label: "All Models",
+                options: model_options,
+                selected: selected_models,
+                icon: "M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z",
+                full_width: true %>
+          </div>
         <% end %>
-      <% end %>
-      <!-- Stats Summary (right aligned) -->
-      <div class="ml-auto flex items-center gap-4 text-sm text-gray-500 dark:text-gray-400">
-        <span><%= number_to_human_short(filter_stats[:total_count]) %> executions</span>
-        <span class="text-gray-300 dark:text-gray-600">|</span>
-        <span><%= number_to_human_short(filter_stats[:total_cost], prefix: "$", precision: 2) %></span>
-        <span class="text-gray-300 dark:text-gray-600">|</span>
-        <span><%= number_to_human_short(filter_stats[:total_tokens]) %> tokens</span>
+        <%# Agent Types Filter %>
+        <% if agent_types.any? %>
+          <div class="md:w-auto">
+            <%= render "rubyllm/agents/shared/filter_dropdown",
+                name: "agent_types[]",
+                filter_id: "agent_types",
+                label: "Agents",
+                all_label: "All Agents",
+                options: agent_options,
+                selected: selected_agents,
+                icon: "M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z",
+                width: "w-52",
+                full_width: true %>
+          </div>
+        <% end %>
+        <%# Spacer (desktop only) %>
+        <div class="hidden md:block flex-1"></div>
+        <%# Stats %>
+        <div id="filter-stats" class="flex items-center justify-between md:justify-end gap-3 py-2 px-3 md:p-0 bg-gray-50 md:bg-transparent dark:bg-gray-700/50 md:dark:bg-transparent rounded-lg md:rounded-none">
+          <span class="text-xs text-gray-500 dark:text-gray-400 md:hidden">Results</span>
+          <div class="flex items-center gap-3 text-xs text-gray-500 dark:text-gray-400">
+            <span class="tabular-nums"><%= number_to_human_short(filter_stats[:total_count]) %><span class="md:hidden"> executions</span></span>
+            <span class="text-gray-300 dark:text-gray-600">|</span>
+            <span class="tabular-nums"><%= number_to_human_short(filter_stats[:total_cost], prefix: "$", precision: 2) %></span>
+            <span class="hidden md:inline text-gray-300 dark:text-gray-600">|</span>
+            <span class="hidden md:inline tabular-nums"><%= number_to_human_short(filter_stats[:total_tokens]) %>t</span>
+          </div>
+        </div>
+        <%# Actions %>
+        <div class="flex items-center gap-2 md:gap-1">
+          <% if has_filters %>
+            <%= link_to ruby_llm_agents.executions_path,
+                data: { turbo_stream: true, turbo_action: "advance" },
+                class: "flex-1 md:flex-initial flex items-center justify-center gap-2 px-3 py-2 md:p-2 text-sm md:text-base text-red-600 md:text-gray-400 dark:text-red-400 md:dark:text-gray-400 bg-red-50 md:bg-transparent dark:bg-red-900/20 md:dark:bg-transparent hover:text-red-500 hover:bg-red-100 md:hover:bg-red-50 dark:hover:bg-red-900/30 md:dark:hover:bg-red-900/20 rounded-lg transition-colors",
+                title: "Clear filters" do %>
+              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+              </svg>
+              <span class="md:hidden">Clear</span>
+            <% end %>
+          <% end %>
+          <%= link_to ruby_llm_agents.export_executions_path(agent_types: selected_agents.presence, statuses: selected_statuses.presence, days: params[:days].presence, model_ids: selected_models.presence),
+              class: "flex-1 md:flex-initial flex items-center justify-center gap-2 px-3 py-2 md:p-2 text-sm md:text-base text-gray-600 md:text-gray-400 dark:text-gray-300 md:dark:text-gray-400 bg-gray-50 md:bg-transparent dark:bg-gray-700 md:dark:bg-transparent hover:text-gray-600 md:hover:text-gray-600 dark:hover:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-600 md:dark:hover:bg-gray-700 rounded-lg transition-colors",
+              title: "Export CSV",
+              data: { turbo: false } do %>
+            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+            </svg>
+            <span class="md:hidden">Export</span>
+          <% end %>
+        </div>
       </div>
     </div>
   <% end %>

data/app/views/rubyllm/agents/executions/_list.html.erb CHANGED Viewed

@@ -1,4 +1,4 @@
-<div class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
+<div id="executions-list" class="bg-white dark:bg-gray-800 rounded-lg shadow overflow-hidden">
   <% if executions.empty? %>
     <div class="px-6 py-12 text-center text-gray-500 dark:text-gray-400">
       <p class="text-lg">No executions found</p>
@@ -9,6 +9,7 @@
       <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
         <thead class="bg-gray-50 dark:bg-gray-900">
           <tr>
+            <th scope="col" class="px-2 py-3 w-8"></th>
             <th
               scope="col"
               class="
@@ -39,6 +40,16 @@
               Version
             </th>
+            <th
+              scope="col"
+              class="
+                px-4 py-3 text-center text-xs font-medium text-gray-500 dark:text-gray-400
+                uppercase tracking-wider
+              "
+            >
+              Attempts
+            </th>
             <th
               scope="col"
               class="
@@ -83,29 +94,61 @@
         <tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-100 dark:divide-gray-700">
           <% executions.each do |execution| %>
+            <% has_attempts = execution.attempts.present? && execution.attempts.size > 0 %>
             <tr
-              class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors cursor-pointer"
-              onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'"
+              class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors"
+              id="execution-row-<%= execution.id %>"
             >
-              <td class="px-4 py-3 whitespace-nowrap">
+              <!-- Expand/Collapse Button -->
+              <td class="px-2 py-3 whitespace-nowrap">
+                <% if has_attempts %>
+                  <button
+                    type="button"
+                    onclick="toggleAttempts(<%= execution.id %>); event.stopPropagation();"
+                    class="expand-btn p-1 rounded hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors"
+                    data-execution-id="<%= execution.id %>"
+                    aria-expanded="false"
+                    aria-label="Toggle attempts"
+                  >
+                    <svg class="w-4 h-4 text-gray-500 dark:text-gray-400 transform transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                  </button>
+                <% end %>
+              </td>
+              <td class="px-4 py-3 whitespace-nowrap cursor-pointer" onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'">
                 <span class="text-sm font-medium text-gray-900 dark:text-gray-100">
                   <%= execution.agent_type.gsub(/Agent$/, '') %>
                 </span>
               </td>
-              <td class="px-4 py-3 whitespace-nowrap">
+              <td class="px-4 py-3 whitespace-nowrap cursor-pointer" onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'">
                 <%= render "rubyllm/agents/shared/status_badge", status: execution.status %>
               </td>
-              <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400">
+              <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400 cursor-pointer" onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'">
                 v<%= execution.agent_version %>
               </td>
+              <!-- Attempts Count -->
+              <td class="px-4 py-3 whitespace-nowrap text-sm text-center cursor-pointer" onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'">
+                <% attempts_count = execution.attempts_count || (execution.attempts&.size || 1) %>
+                <% if attempts_count > 1 %>
+                  <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200">
+                    <%= attempts_count %> attempts
+                  </span>
+                <% else %>
+                  <span class="text-gray-400 dark:text-gray-500">1</span>
+                <% end %>
+              </td>
               <td
                 class="
                   px-4 py-3 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100
-                  text-right font-medium
+                  text-right font-medium cursor-pointer
                 "
+                onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'"
               >
                 <%= number_to_human_short(execution.total_tokens || 0) %>
               </td>
@@ -113,8 +156,9 @@
               <td
                 class="
                   px-4 py-3 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100
-                  text-right font-medium
+                  text-right font-medium cursor-pointer
                 "
+                onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'"
               >
                 <%= number_to_human_short(execution.total_cost || 0, prefix: "$", precision: 2) %>
               </td>
@@ -122,21 +166,68 @@
               <td
                 class="
                   px-4 py-3 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100
-                  text-right font-medium
+                  text-right font-medium cursor-pointer
                 "
+                onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'"
               >
                 <%= number_with_delimiter(execution.duration_ms || 0) %>ms
               </td>
-              <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400 text-right">
+              <td class="px-4 py-3 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400 text-right cursor-pointer" onclick="window.location='<%= ruby_llm_agents.execution_path(execution) %>'">
                 <%= time_ago_in_words(execution.created_at) %> ago
               </td>
             </tr>
+            <!-- Inline Attempts Expansion Row (hidden by default) -->
+            <% if has_attempts %>
+              <tr id="attempts-row-<%= execution.id %>" class="hidden bg-gray-50 dark:bg-gray-900">
+                <td colspan="9" class="px-4 py-3">
+                  <div class="ml-6">
+                    <h4 class="text-xs font-medium text-gray-500 dark:text-gray-400 uppercase mb-2">Attempts Timeline</h4>
+                    <div class="space-y-2">
+                      <% execution.attempts.each_with_index do |attempt, idx| %>
+                        <% is_successful = attempt["error_class"].nil? && !attempt["short_circuited"] %>
+                        <% is_short_circuited = attempt["short_circuited"] %>
+                        <div class="flex items-center gap-3 text-sm <%= is_successful ? 'bg-green-50 dark:bg-green-900/20 border-l-2 border-green-500' : is_short_circuited ? 'bg-gray-100 dark:bg-gray-800 border-l-2 border-gray-400' : 'bg-red-50 dark:bg-red-900/20 border-l-2 border-red-500' %> px-3 py-2 rounded-r">
+                          <span class="font-medium text-gray-700 dark:text-gray-300 w-6">#<%= idx + 1 %></span>
+                          <span class="text-gray-600 dark:text-gray-400 w-32 truncate" title="<%= attempt["model_id"] %>">
+                            <%= attempt["model_id"]&.split("/")&.last || "unknown" %>
+                          </span>
+                          <% if is_successful %>
+                            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 text-green-800 dark:bg-green-800 dark:text-green-200">
+                              Success
+                            </span>
+                          <% elsif is_short_circuited %>
+                            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-200 text-gray-600 dark:bg-gray-700 dark:text-gray-400">
+                              Skipped (breaker)
+                            </span>
+                          <% else %>
+                            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-red-100 text-red-800 dark:bg-red-800 dark:text-red-200" title="<%= attempt["error_message"] %>">
+                              <%= attempt["error_class"]&.split("::")&.last || "Error" %>
+                            </span>
+                          <% end %>
+                          <% if attempt["duration_ms"] %>
+                            <span class="text-gray-500 dark:text-gray-400 text-xs">
+                              <%= number_with_delimiter(attempt["duration_ms"].to_i) %>ms
+                            </span>
+                          <% end %>
+                          <% if attempt["input_tokens"] || attempt["output_tokens"] %>
+                            <span class="text-gray-500 dark:text-gray-400 text-xs">
+                              <%= number_to_human_short((attempt["input_tokens"] || 0) + (attempt["output_tokens"] || 0)) %> tokens
+                            </span>
+                          <% end %>
+                        </div>
+                      <% end %>
+                    </div>
+                  </div>
+                </td>
+              </tr>
+            <% end %>
             <% if execution.status_error? && execution.error_message.present? %>
               <tr class="bg-red-50 dark:bg-red-900/30">
-                <td colspan="7" class="px-4 py-2">
-                  <p class="text-xs text-red-600 dark:text-red-400">
+                <td colspan="9" class="px-4 py-2">
+                  <p class="text-xs text-red-600 dark:text-red-400 ml-8">
                     <span class="font-medium">
                       <%= execution.error_class %>:
                     </span>