ruby_llm-agents 0.3.3 → 0.3.5

data/app/views/ruby_llm/agents/agents/_workflow.html.erb

@@ -0,0 +1,125 @@
+<%
+  workflow_colors = {
+    "pipeline" => { border: "border-l-indigo-500", icon_bg: "bg-indigo-100 dark:bg-indigo-900/50", icon_text: "text-indigo-600 dark:text-indigo-300" },
+    "parallel" => { border: "border-l-cyan-500", icon_bg: "bg-cyan-100 dark:bg-cyan-900/50", icon_text: "text-cyan-600 dark:text-cyan-300" },
+    "router" => { border: "border-l-amber-500", icon_bg: "bg-amber-100 dark:bg-amber-900/50", icon_text: "text-amber-600 dark:text-amber-300" }
+  }
+  colors = workflow_colors[workflow[:workflow_type]] || { border: "border-l-gray-400", icon_bg: "bg-gray-100", icon_text: "text-gray-600" }
+
+  child_label = case workflow[:workflow_type]
+    when "pipeline" then "steps"
+    when "parallel" then "branches"
+    when "router" then "routes"
+    else "children"
+  end
+%>
+
+<div x-data="{ expanded: false }" class="block bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-shadow border-l-4 <%= colors[:border] %>">
+  <%= link_to ruby_llm_agents.agent_path(workflow[:name]), class: "block p-4 sm:p-5" do %>
+    <!-- Header Row -->
+    <div class="flex items-center justify-between gap-2">
+      <div class="flex items-center gap-2 min-w-0">
+        <%= render "ruby_llm/agents/shared/workflow_type_badge", workflow_type: workflow[:workflow_type], size: :sm %>
+        <h3 class="font-semibold text-gray-900 dark:text-gray-100 truncate">
+          <%= workflow[:name].gsub(/Workflow$/, '').gsub(/Pipeline$|Parallel$|Router$/, '') %>
+        </h3>
+        <span class="hidden sm:inline text-sm text-gray-500 dark:text-gray-400">v<%= workflow[:version] %></span>
+        <% if workflow[:active] %>
+          <span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-green-100 dark:bg-green-900/50 text-green-800 dark:text-green-300">Active</span>
+        <% else %>
+          <span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400">Deleted</span>
+        <% end %>
+      </div>
+      <span class="hidden sm:block text-sm text-gray-500 dark:text-gray-400">
+        <%= workflow[:workflow_children]&.size || 0 %> <%= child_label %>
+      </span>
+    </div>
+
+    <!-- Stats Row -->
+    <div class="mt-2 sm:mt-3 sm:border-t sm:border-gray-100 sm:dark:border-gray-700 sm:pt-3">
+      <% success_rate = workflow[:success_rate] || 0 %>
+      <!-- Mobile: compact inline -->
+      <div class="sm:hidden text-xs text-gray-500 dark:text-gray-400">
+        <%= number_with_delimiter(workflow[:execution_count]) %> runs
+        <span class="mx-1 text-gray-300 dark:text-gray-600">-</span>
+        $<%= number_with_precision(workflow[:total_cost] || 0, precision: 2) %>
+        <span class="mx-1 text-gray-300 dark:text-gray-600">-</span>
+        <span class="<%= success_rate >= 95 ? 'text-green-600 dark:text-green-400' : success_rate >= 80 ? 'text-yellow-600 dark:text-yellow-400' : 'text-red-600 dark:text-red-400' %>">
+          <%= success_rate %>%
+        </span>
+      </div>
+
+      <!-- Desktop: full stats with icons -->
+      <div class="hidden sm:flex items-center justify-between text-sm">
+        <div class="flex items-center space-x-6">
+          <div class="flex items-center text-gray-600 dark:text-gray-300">
+            <svg class="w-4 h-4 mr-1.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
+            </svg>
+            <span><%= number_with_delimiter(workflow[:execution_count]) %> executions</span>
+          </div>
+          <div class="flex items-center text-gray-600 dark:text-gray-300">
+            <svg class="w-4 h-4 mr-1.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+            <span>$<%= number_with_precision(workflow[:total_cost] || 0, precision: 4) %></span>
+          </div>
+          <div class="flex items-center">
+            <% if success_rate >= 95 %>
+              <span class="w-2 h-2 rounded-full bg-green-500 mr-1.5"></span>
+              <span class="text-green-600 dark:text-green-400"><%= success_rate %>%</span>
+            <% elsif success_rate >= 80 %>
+              <span class="w-2 h-2 rounded-full bg-yellow-500 mr-1.5"></span>
+              <span class="text-yellow-600 dark:text-yellow-400"><%= success_rate %>%</span>
+            <% else %>
+              <span class="w-2 h-2 rounded-full bg-red-500 mr-1.5"></span>
+              <span class="text-red-600 dark:text-red-400"><%= success_rate %>%</span>
+            <% end %>
+          </div>
+        </div>
+        <div class="text-gray-400 dark:text-gray-500">
+          <% if workflow[:last_executed] %>
+            <%= time_ago_in_words(workflow[:last_executed]) %> ago
+          <% else %>
+            Never executed
+          <% end %>
+        </div>
+      </div>
+    </div>
+  <% end %>
+
+  <!-- Expandable Child Agents Section -->
+  <% if workflow[:workflow_children].present? && workflow[:workflow_children].any? %>
+    <div class="border-t border-gray-100 dark:border-gray-700 px-4 sm:px-5 py-2">
+      <button type="button" @click.prevent="expanded = !expanded" class="w-full flex items-center justify-between text-sm text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300">
+        <span class="font-medium">
+          <%= child_label.capitalize %> (<%= workflow[:workflow_children].size %>)
+        </span>
+        <svg class="w-4 h-4 transition-transform duration-200" :class="{ 'rotate-180': expanded }" 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 x-show="expanded" x-cloak x-transition:enter="transition ease-out duration-200" x-transition:enter-start="opacity-0 -translate-y-1" x-transition:enter-end="opacity-100 translate-y-0" class="mt-2 space-y-1">
+        <% workflow[:workflow_children].each_with_index do |child, index| %>
+          <div class="flex items-center gap-2 text-sm py-1.5 px-2 rounded bg-gray-50 dark:bg-gray-900/50">
+            <span class="w-5 h-5 flex items-center justify-center rounded-full <%= colors[:icon_bg] %> text-xs <%= colors[:icon_text] %>">
+              <%= index + 1 %>
+            </span>
+            <span class="font-medium text-gray-700 dark:text-gray-300"><%= child[:name] %></span>
+            <span class="text-gray-400 dark:text-gray-500">-></span>
+            <span class="text-gray-600 dark:text-gray-400 font-mono text-xs"><%= child[:agent] %></span>
+            <% if child[:optional] %>
+              <span class="text-xs text-gray-400 dark:text-gray-500 italic">(optional)</span>
+            <% end %>
+            <% if child[:description].present? %>
+              <span class="text-xs text-gray-400 dark:text-gray-500 truncate max-w-xs" title="<%= child[:description] %>">
+                - <%= child[:description].truncate(30) %>
+              </span>
+            <% end %>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+</div>

data/app/views/ruby_llm/agents/agents/index.html.erb

@@ -0,0 +1,93 @@
+<div class="mb-6">
+  <h1 class="text-2xl font-bold text-gray-900 dark:text-gray-100">Agents & Workflows</h1>
+  <p class="text-gray-500 dark:text-gray-400 mt-1">All available agents and workflows with execution statistics</p>
+</div>
+
+<div x-data="{ activeTab: 'agents', activeSubTab: null }">
+  <!-- Tab Navigation -->
+  <div class="border-b border-gray-200 dark:border-gray-700 mb-6">
+    <nav class="-mb-px flex space-x-6" aria-label="Tabs">
+      <!-- Agents Tab -->
+      <button type="button" @click="activeTab = 'agents'; activeSubTab = null"
+              :class="activeTab === 'agents' ? 'border-blue-500 text-blue-600 dark:text-blue-400' : 'border-transparent text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 hover:border-gray-300'"
+              class="whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm flex items-center gap-2 transition-colors">
+        <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="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>
+        Agents
+        <span class="inline-flex items-center justify-center px-2 py-0.5 rounded-full text-xs font-medium"
+              :class="activeTab === 'agents' ? 'bg-blue-100 dark:bg-blue-900/50 text-blue-600 dark:text-blue-300' : 'bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400'">
+          <%= @agent_count %>
+        </span>
+      </button>
+
+      <!-- Workflows Tab -->
+      <button type="button" @click="activeTab = 'workflows'; activeSubTab = null"
+              :class="activeTab === 'workflows' ? 'border-blue-500 text-blue-600 dark:text-blue-400' : 'border-transparent text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 hover:border-gray-300'"
+              class="whitespace-nowrap py-3 px-1 border-b-2 font-medium text-sm flex items-center gap-2 transition-colors">
+        <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="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zm0 8a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zm12 0a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"/>
+        </svg>
+        Workflows
+        <span class="inline-flex items-center justify-center px-2 py-0.5 rounded-full text-xs font-medium"
+              :class="activeTab === 'workflows' ? 'bg-blue-100 dark:bg-blue-900/50 text-blue-600 dark:text-blue-300' : 'bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400'">
+          <%= @workflow_count %>
+        </span>
+      </button>
+    </nav>
+  </div>
+
+  <!-- Workflow Sub-tabs -->
+  <div x-show="activeTab === 'workflows'" x-cloak class="mb-4">
+    <div class="flex flex-wrap gap-2">
+      <button type="button" @click="activeSubTab = null"
+              :class="activeSubTab === null ? 'bg-gray-900 dark:bg-gray-100 text-white dark:text-gray-900' : 'bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-600'"
+              class="px-3 py-1.5 rounded-md text-sm font-medium transition-colors">
+        All (<%= @workflow_count %>)
+      </button>
+      <button type="button" @click="activeSubTab = 'pipeline'"
+              :class="activeSubTab === 'pipeline' ? 'bg-indigo-600 text-white' : 'bg-indigo-100 dark:bg-indigo-900/50 text-indigo-700 dark:text-indigo-300 hover:bg-indigo-200 dark:hover:bg-indigo-800'"
+              class="px-3 py-1.5 rounded-md text-sm font-medium transition-colors inline-flex items-center gap-1.5">
+        <span aria-hidden="true">-></span> Pipeline (<%= @workflows_by_type[:pipeline].size %>)
+      </button>
+      <button type="button" @click="activeSubTab = 'parallel'"
+              :class="activeSubTab === 'parallel' ? 'bg-cyan-600 text-white' : 'bg-cyan-100 dark:bg-cyan-900/50 text-cyan-700 dark:text-cyan-300 hover:bg-cyan-200 dark:hover:bg-cyan-800'"
+              class="px-3 py-1.5 rounded-md text-sm font-medium transition-colors inline-flex items-center gap-1.5">
+        <span aria-hidden="true">//</span> Parallel (<%= @workflows_by_type[:parallel].size %>)
+      </button>
+      <button type="button" @click="activeSubTab = 'router'"
+              :class="activeSubTab === 'router' ? 'bg-amber-600 text-white' : 'bg-amber-100 dark:bg-amber-900/50 text-amber-700 dark:text-amber-300 hover:bg-amber-200 dark:hover:bg-amber-800'"
+              class="px-3 py-1.5 rounded-md text-sm font-medium transition-colors inline-flex items-center gap-1.5">
+        <span aria-hidden="true">&lt;&gt;</span> Router (<%= @workflows_by_type[:router].size %>)
+      </button>
+    </div>
+  </div>
+
+  <!-- Agents Content -->
+  <div x-show="activeTab === 'agents'">
+    <% if @agents.empty? %>
+      <%= render "ruby_llm/agents/agents/empty_state", type: "agents" %>
+    <% else %>
+      <div class="space-y-3 sm:space-y-4">
+        <% @agents.each do |agent| %>
+          <%= render partial: "ruby_llm/agents/agents/agent", locals: { agent: agent } %>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+
+  <!-- Workflows Content -->
+  <div x-show="activeTab === 'workflows'" x-cloak>
+    <% if @workflows.empty? %>
+      <%= render "ruby_llm/agents/agents/empty_state", type: "workflows" %>
+    <% else %>
+      <div class="space-y-3 sm:space-y-4">
+        <% @workflows.each do |workflow| %>
+          <div x-show="activeSubTab === null || activeSubTab === '<%= workflow[:workflow_type] %>'">
+            <%= render partial: "ruby_llm/agents/agents/workflow", locals: { workflow: workflow } %>
+          </div>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+</div>