ruby_llm-agents 0.5.0 → 1.0.0.beta.1

data/app/views/ruby_llm/agents/workflows/_step_performance.html.erb

@@ -0,0 +1,236 @@
+<%
+  # Step/Branch/Route Performance Analytics
+  # Shows per-step metrics in a table format
+  workflow_type = local_assigns[:workflow_type]
+  step_stats = local_assigns[:step_stats] || []
+  route_distribution = local_assigns[:route_distribution] || {}
+
+  # Determine labels based on workflow type
+  section_title = case workflow_type
+    when "pipeline" then "Step Performance"
+    when "parallel" then "Branch Performance"
+    when "router" then "Route Distribution"
+    else "Step Performance"
+  end
+
+  column_label = case workflow_type
+    when "pipeline" then "Step"
+    when "parallel" then "Branch"
+    when "router" then "Route"
+    else "Step"
+  end
+
+  # Calculate max values for bar charts
+  max_duration = step_stats.map { |s| s[:avg_duration_ms] }.compact.max || 1
+  max_cost = step_stats.map { |s| s[:avg_cost] }.compact.max || 0.001
+%>
+
+<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6 mb-6">
+  <h3 class="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">
+    <%= section_title %> <span class="text-sm font-normal text-gray-500 dark:text-gray-400">(last 30 days)</span>
+  </h3>
+
+  <% if workflow_type == "router" && route_distribution.present? %>
+    <!-- Route Distribution Bar Chart -->
+    <div class="mb-6">
+      <div class="space-y-3">
+        <% route_distribution.each do |route_name, data| %>
+          <div class="flex items-center gap-3">
+            <span class="text-sm font-medium text-gray-700 dark:text-gray-300 w-24 truncate" title="<%= route_name %>">
+              <%= route_name %>
+            </span>
+            <div class="flex-1 h-6 bg-gray-100 dark:bg-gray-700 rounded-lg overflow-hidden">
+              <div class="h-full bg-amber-500 dark:bg-amber-400 rounded-lg transition-all duration-300"
+                   style="width: <%= data[:percentage] %>%">
+              </div>
+            </div>
+            <span class="text-sm text-gray-600 dark:text-gray-400 w-24 text-right">
+              <%= data[:count] %> (<%= data[:percentage] %>%)
+            </span>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+
+  <% if step_stats.any? %>
+    <!-- Performance Table -->
+    <div class="overflow-x-auto">
+      <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
+        <thead>
+          <tr>
+            <th scope="col" class="px-4 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              <%= column_label %>
+            </th>
+            <th scope="col" class="px-4 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              Executions
+            </th>
+            <th scope="col" class="px-4 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              Success
+            </th>
+            <th scope="col" class="px-4 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              Avg Duration
+            </th>
+            <th scope="col" class="px-4 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              Avg Cost
+            </th>
+            <th scope="col" class="px-4 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+              Avg Tokens
+            </th>
+            <% if workflow_type == "parallel" %>
+              <th scope="col" class="px-4 py-3 text-center text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+                Notes
+              </th>
+            <% end %>
+          </tr>
+        </thead>
+        <tbody class="divide-y divide-gray-100 dark:divide-gray-700">
+          <%
+            # For parallel workflows, find fastest/slowest
+            durations = step_stats.map { |s| s[:avg_duration_ms] }.compact
+            min_duration = durations.min
+            max_duration_val = durations.max
+          %>
+
+          <% step_stats.each do |stat| %>
+            <tr class="hover:bg-gray-50 dark:hover:bg-gray-700/50">
+              <td class="px-4 py-3">
+                <div class="flex items-center gap-2">
+                  <span class="font-medium text-gray-900 dark:text-gray-100">
+                    <%= stat[:name] %>
+                  </span>
+                  <% if stat[:agent_type].present? %>
+                    <span class="text-xs text-gray-400 dark:text-gray-500 font-mono">
+                      (<%= stat[:agent_type].gsub(/Agent$/, '') %>)
+                    </span>
+                  <% end %>
+                </div>
+              </td>
+              <td class="px-4 py-3 text-right text-sm text-gray-600 dark:text-gray-300">
+                <%= number_with_delimiter(stat[:execution_count]) %>
+              </td>
+              <td class="px-4 py-3 text-right">
+                <% rate = stat[:success_rate] %>
+                <span class="text-sm font-medium <%= rate >= 95 ? 'text-green-600 dark:text-green-400' : rate >= 80 ? 'text-yellow-600 dark:text-yellow-400' : 'text-red-600 dark:text-red-400' %>">
+                  <%= rate %>%
+                </span>
+              </td>
+              <td class="px-4 py-3 text-right">
+                <div class="flex items-center justify-end gap-2">
+                  <div class="w-16 h-2 bg-gray-100 dark:bg-gray-700 rounded-full overflow-hidden">
+                    <div class="h-full bg-purple-500 rounded-full"
+                         style="width: <%= max_duration > 0 ? (stat[:avg_duration_ms].to_f / max_duration * 100).round : 0 %>%">
+                    </div>
+                  </div>
+                  <span class="text-sm text-gray-600 dark:text-gray-300 w-20 text-right">
+                    <%= number_with_delimiter(stat[:avg_duration_ms]) %> ms
+                  </span>
+                </div>
+              </td>
+              <td class="px-4 py-3 text-right">
+                <div class="flex items-center justify-end gap-2">
+                  <div class="w-12 h-2 bg-gray-100 dark:bg-gray-700 rounded-full overflow-hidden">
+                    <div class="h-full bg-amber-500 rounded-full"
+                         style="width: <%= max_cost > 0 ? (stat[:avg_cost].to_f / max_cost * 100).round : 0 %>%">
+                    </div>
+                  </div>
+                  <span class="text-sm text-gray-600 dark:text-gray-300 w-16 text-right">
+                    $<%= number_with_precision(stat[:avg_cost], precision: 4) %>
+                  </span>
+                </div>
+              </td>
+              <td class="px-4 py-3 text-right text-sm text-gray-600 dark:text-gray-300">
+                <%= number_with_delimiter(stat[:avg_tokens]) %>
+              </td>
+              <% if workflow_type == "parallel" %>
+                <td class="px-4 py-3 text-center">
+                  <% if step_stats.size > 1 %>
+                    <% if stat[:avg_duration_ms] == min_duration %>
+                      <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-green-100 dark:bg-green-900/50 text-green-700 dark:text-green-300">
+                        fastest
+                      </span>
+                    <% elsif stat[:avg_duration_ms] == max_duration_val && min_duration != max_duration_val %>
+                      <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-yellow-100 dark:bg-yellow-900/50 text-yellow-700 dark:text-yellow-300">
+                        slowest
+                      </span>
+                    <% end %>
+                  <% end %>
+                </td>
+              <% end %>
+            </tr>
+          <% end %>
+
+          <!-- Totals Row -->
+          <%
+            total_executions = step_stats.sum { |s| s[:execution_count] }
+            total_cost = step_stats.sum { |s| s[:total_cost] }
+            total_tokens = step_stats.sum { |s| s[:total_tokens] }
+            avg_duration_all = step_stats.any? ? (step_stats.sum { |s| s[:avg_duration_ms] * s[:execution_count] }.to_f / total_executions).round : 0
+            avg_cost_all = total_executions > 0 ? total_cost / total_executions : 0
+            avg_tokens_all = total_executions > 0 ? total_tokens / total_executions : 0
+
+            # Calculate overall success rate
+            total_success = step_stats.sum { |s| (s[:success_rate] * s[:execution_count] / 100.0).round }
+            overall_success_rate = total_executions > 0 ? (total_success.to_f / total_executions * 100).round(1) : 0
+          %>
+          <tr class="bg-gray-50 dark:bg-gray-700/50 font-medium">
+            <td class="px-4 py-3 text-gray-700 dark:text-gray-300">
+              Totals
+            </td>
+            <td class="px-4 py-3 text-right text-sm text-gray-700 dark:text-gray-300">
+              <%= number_with_delimiter(total_executions) %>
+            </td>
+            <td class="px-4 py-3 text-right">
+              <span class="text-sm <%= overall_success_rate >= 95 ? 'text-green-600 dark:text-green-400' : overall_success_rate >= 80 ? 'text-yellow-600 dark:text-yellow-400' : 'text-red-600 dark:text-red-400' %>">
+                <%= overall_success_rate %>%
+              </span>
+            </td>
+            <td class="px-4 py-3 text-right text-sm text-gray-700 dark:text-gray-300">
+              <%= number_with_delimiter(avg_duration_all) %> ms
+            </td>
+            <td class="px-4 py-3 text-right text-sm text-gray-700 dark:text-gray-300">
+              $<%= number_with_precision(avg_cost_all, precision: 4) %>
+            </td>
+            <td class="px-4 py-3 text-right text-sm text-gray-700 dark:text-gray-300">
+              <%= number_with_delimiter(avg_tokens_all.round) %>
+            </td>
+            <% if workflow_type == "parallel" %>
+              <td class="px-4 py-3"></td>
+            <% end %>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+
+    <% if workflow_type == "parallel" && step_stats.size > 1 %>
+      <%
+        sum_duration = step_stats.sum { |s| s[:avg_duration_ms] }
+        wall_clock = step_stats.map { |s| s[:avg_duration_ms] }.max
+        time_saved = sum_duration - wall_clock
+      %>
+      <div class="mt-4 pt-4 border-t border-gray-100 dark:border-gray-700">
+        <p class="text-sm text-gray-500 dark:text-gray-400">
+          Wall-clock avg: <span class="font-medium text-gray-700 dark:text-gray-300"><%= number_with_delimiter(wall_clock) %> ms</span>
+          <span class="text-gray-400 dark:text-gray-500 mx-2">|</span>
+          Parallel saves <span class="font-medium text-green-600 dark:text-green-400"><%= number_with_delimiter(time_saved) %> ms</span> vs sequential
+        </p>
+      </div>
+    <% end %>
+
+    <% if workflow_type == "router" && route_distribution.present? %>
+      <%
+        # Calculate classification cost if we have stats
+        # This is approximate since we don't have exact classification costs
+      %>
+      <div class="mt-4 pt-4 border-t border-gray-100 dark:border-gray-700">
+        <p class="text-sm text-gray-500 dark:text-gray-400">
+          Route distribution based on <%= route_distribution.values.sum { |v| v[:count] } %> classified requests
+        </p>
+      </div>
+    <% end %>
+  <% else %>
+    <p class="text-gray-500 dark:text-gray-400 italic py-4">
+      No <%= column_label.downcase %> performance data available for the last 30 days.
+    </p>
+  <% end %>
+</div>

data/app/views/ruby_llm/agents/workflows/_structure_parallel.html.erb

@@ -0,0 +1,76 @@
+<%
+  # Parallel workflow structure visualization
+  # Shows branches executing concurrently
+  branches = local_assigns[:branches] || []
+%>
+
+<% if branches.any? %>
+  <!-- Visual Parallel Flow -->
+  <div class="py-4">
+    <div class="flex items-stretch gap-4">
+      <!-- Parallel Symbol -->
+      <div class="flex items-center">
+        <span class="text-3xl font-light text-cyan-500 dark:text-cyan-400">⫿</span>
+      </div>
+
+      <!-- Branches Container -->
+      <div class="flex-1 border-l-4 border-cyan-300 dark:border-cyan-600 pl-4">
+        <div class="space-y-2">
+          <% branches.each do |branch| %>
+            <div class="flex items-center gap-3 py-2 px-3 rounded-lg bg-cyan-50 dark:bg-cyan-900/20 border border-cyan-200 dark:border-cyan-800 <%= branch[:optional] ? 'border-dashed' : '' %>">
+              <span class="font-semibold text-cyan-700 dark:text-cyan-300 min-w-28">
+                <%= branch[:name] %>
+              </span>
+              <span class="text-cyan-400 dark:text-cyan-500">-></span>
+              <code class="text-sm font-mono text-gray-600 dark:text-gray-400">
+                <%= branch[:agent] %>
+              </code>
+              <% if branch[:optional] %>
+                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400 ml-auto">
+                  optional
+                </span>
+              <% end %>
+            </div>
+          <% end %>
+        </div>
+      </div>
+    </div>
+
+    <p class="text-sm text-gray-500 dark:text-gray-400 mt-4 ml-12">
+      All branches execute concurrently
+    </p>
+  </div>
+
+  <!-- Branch Details Table -->
+  <div class="border-t border-gray-100 dark:border-gray-700 pt-4 mt-4">
+    <p class="text-xs text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-3">
+      Branch Details
+    </p>
+
+    <div class="space-y-2">
+      <% branches.each_with_index do |branch, index| %>
+        <div class="flex items-center gap-3 py-2 px-3 rounded-lg bg-gray-50 dark:bg-gray-900/50">
+          <span class="w-6 h-6 flex items-center justify-center rounded-full bg-cyan-100 dark:bg-cyan-900/50 text-xs font-medium text-cyan-600 dark:text-cyan-300">
+            <%= index + 1 %>
+          </span>
+          <span class="font-medium text-gray-700 dark:text-gray-300 min-w-24">
+            <%= branch[:name] %>
+          </span>
+          <span class="text-gray-400 dark:text-gray-500 text-sm">-></span>
+          <code class="text-sm font-mono text-gray-600 dark:text-gray-400 bg-gray-100 dark:bg-gray-800 px-2 py-0.5 rounded">
+            <%= branch[:agent] %>
+          </code>
+          <% if branch[:optional] %>
+            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400">
+              optional
+            </span>
+          <% end %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+<% else %>
+  <p class="text-gray-500 dark:text-gray-400 italic py-4">
+    No branches defined for this parallel workflow.
+  </p>
+<% end %>

data/app/views/ruby_llm/agents/workflows/_structure_pipeline.html.erb

@@ -0,0 +1,74 @@
+<%
+  # Pipeline workflow structure visualization
+  # Shows steps in sequential order with arrows between them
+  steps = local_assigns[:steps] || []
+%>
+
+<% if steps.any? %>
+  <!-- Visual Pipeline Flow -->
+  <div class="py-4 overflow-x-auto">
+    <div class="flex items-center justify-center gap-2 min-w-max px-4">
+      <% steps.each_with_index do |step, index| %>
+        <!-- Step Box -->
+        <div class="flex flex-col items-center">
+          <div class="w-28 h-16 flex flex-col items-center justify-center rounded-lg border-2 border-indigo-200 dark:border-indigo-700 bg-indigo-50 dark:bg-indigo-900/30 <%= step[:optional] ? 'border-dashed' : '' %>">
+            <span class="text-sm font-semibold text-indigo-700 dark:text-indigo-300 truncate max-w-24 px-1">
+              <%= step[:name] %>
+            </span>
+          </div>
+          <span class="text-xs text-gray-500 dark:text-gray-400 mt-1 truncate max-w-28" title="<%= step[:agent] %>">
+            <%= step[:agent]&.gsub(/Agent$/, '') %>
+          </span>
+          <% if step[:optional] %>
+            <span class="text-[10px] text-gray-400 dark:text-gray-500 italic">(optional)</span>
+          <% end %>
+        </div>
+
+        <!-- Arrow between steps -->
+        <% unless index == steps.length - 1 %>
+          <div class="flex items-center text-indigo-400 dark:text-indigo-500 -mt-6">
+            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"/>
+            </svg>
+          </div>
+        <% end %>
+      <% end %>
+    </div>
+  </div>
+
+  <!-- Step Details Table -->
+  <div class="border-t border-gray-100 dark:border-gray-700 pt-4 mt-4">
+    <p class="text-xs text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-3">
+      Step Details
+    </p>
+
+    <div class="space-y-2">
+      <% steps.each_with_index do |step, index| %>
+        <div class="flex items-center gap-3 py-2 px-3 rounded-lg bg-gray-50 dark:bg-gray-900/50">
+          <span class="w-6 h-6 flex items-center justify-center rounded-full bg-indigo-100 dark:bg-indigo-900/50 text-xs font-medium text-indigo-600 dark:text-indigo-300">
+            <%= index + 1 %>
+          </span>
+          <span class="font-medium text-gray-700 dark:text-gray-300 min-w-24">
+            <%= step[:name] %>
+          </span>
+          <span class="text-gray-400 dark:text-gray-500 text-sm">-></span>
+          <code class="text-sm font-mono text-gray-600 dark:text-gray-400 bg-gray-100 dark:bg-gray-800 px-2 py-0.5 rounded">
+            <%= step[:agent] %>
+          </code>
+          <% if step[:optional] %>
+            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400">
+              optional
+            </span>
+            <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-yellow-100 dark:bg-yellow-900/50 text-yellow-700 dark:text-yellow-300">
+              continue_on_error
+            </span>
+          <% end %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+<% else %>
+  <p class="text-gray-500 dark:text-gray-400 italic py-4">
+    No steps defined for this pipeline workflow.
+  </p>
+<% end %>

data/app/views/ruby_llm/agents/workflows/_structure_router.html.erb

@@ -0,0 +1,108 @@
+<%
+  # Router workflow structure visualization
+  # Shows classifier branching to different routes
+  routes = local_assigns[:routes] || []
+  default_route = routes.find { |r| r[:default] }
+%>
+
+<% if routes.any? %>
+  <!-- Visual Router Flow -->
+  <div class="py-4">
+    <div class="flex items-start gap-6">
+      <!-- Classifier Box -->
+      <div class="flex flex-col items-center">
+        <div class="w-24 h-12 flex items-center justify-center rounded-lg border-2 border-amber-300 dark:border-amber-600 bg-amber-50 dark:bg-amber-900/30">
+          <span class="text-sm font-semibold text-amber-700 dark:text-amber-300">classify</span>
+        </div>
+      </div>
+
+      <!-- Routes Fan-out -->
+      <div class="flex-1 relative">
+        <!-- Connection Lines (visual only) -->
+        <div class="absolute left-0 top-0 bottom-0 w-8 flex flex-col justify-around items-end">
+          <% routes.each do |route| %>
+            <div class="text-amber-400 dark:text-amber-500">
+              <svg class="w-6 h-4" viewBox="0 0 24 16" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M0 8 L12 8 L18 8" stroke-linecap="round"/>
+                <path d="M14 4 L18 8 L14 12" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg>
+            </div>
+          <% end %>
+        </div>
+
+        <!-- Route Boxes -->
+        <div class="space-y-2 ml-10">
+          <% routes.each do |route| %>
+            <div class="flex items-center gap-3 py-2 px-3 rounded-lg bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 <%= route[:default] ? 'border-dashed' : '' %>">
+              <span class="font-semibold text-amber-700 dark:text-amber-300 min-w-24">
+                <%= route[:name] %>
+              </span>
+              <span class="text-amber-400 dark:text-amber-500">-></span>
+              <code class="text-sm font-mono text-gray-600 dark:text-gray-400">
+                <%= route[:agent] %>
+              </code>
+              <% if route[:description].present? %>
+                <span class="text-xs text-gray-500 dark:text-gray-400 italic truncate max-w-xs ml-2" title="<%= route[:description] %>">
+                  "<%= route[:description].truncate(40) %>"
+                </span>
+              <% end %>
+              <% if route[:default] %>
+                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400 ml-auto">
+                  fallback
+                </span>
+              <% end %>
+            </div>
+          <% end %>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Route Details Table -->
+  <div class="border-t border-gray-100 dark:border-gray-700 pt-4 mt-4">
+    <p class="text-xs text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-3">
+      Route Details
+    </p>
+
+    <div class="space-y-2">
+      <% routes.each do |route| %>
+        <div class="flex items-start gap-3 py-2 px-3 rounded-lg bg-gray-50 dark:bg-gray-900/50">
+          <span class="w-6 h-6 flex items-center justify-center rounded-full <%= route[:default] ? 'bg-gray-200 dark:bg-gray-700' : 'bg-amber-100 dark:bg-amber-900/50' %> text-xs font-medium <%= route[:default] ? 'text-gray-600 dark:text-gray-400' : 'text-amber-600 dark:text-amber-300' %> mt-0.5">
+            <% if route[:default] %>
+              *
+            <% else %>
+              <svg class="w-3 h-3" fill="currentColor" viewBox="0 0 20 20">
+                <path fill-rule="evenodd" d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z" clip-rule="evenodd"/>
+              </svg>
+            <% end %>
+          </span>
+          <div class="flex-1">
+            <div class="flex items-center gap-3">
+              <span class="font-medium text-gray-700 dark:text-gray-300">
+                <%= route[:name] %>
+              </span>
+              <span class="text-gray-400 dark:text-gray-500 text-sm">-></span>
+              <code class="text-sm font-mono text-gray-600 dark:text-gray-400 bg-gray-100 dark:bg-gray-800 px-2 py-0.5 rounded">
+                <%= route[:agent] %>
+              </code>
+              <% if route[:default] %>
+                <span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400">
+                  fallback route
+                </span>
+              <% end %>
+            </div>
+            <% if route[:description].present? %>
+              <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">
+                <%= route[:description] %>
+              </p>
+            <% end %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </div>
+<% else %>
+  <p class="text-gray-500 dark:text-gray-400 italic py-4">
+    No routes defined for this router workflow.
+  </p>
+<% end %>