insika 0.8.0 → 1.0.1

data/lib/insika/studio/views/home.erb

@@ -1,12 +1,13 @@
-<%# Overview home: stat cards + activity chart + recent
+<%# Overview home: KPI strip + activity chart + recent
     conversations, all LIVE over the existing SSE channel (live_home_controller
     subscribes to /studio/events; the server-rendered numbers are its baseline).
     Charts are inline SVG (geometry via attributes, fill via stylesheet —
     CSP-safe, no inline style). %>
-<div data-controller="live-home" data-live-home-active-value="<%= @active_now %>">
+<div class="reports-page reports-home" data-controller="live-home" data-live-home-active-value="<%= @active_now %>">
   <header class="page-head">
     <div>
-      <h1>Overview<span class="sub">at a glance</span></h1>
+      <%== crumbs_for("Overview") %>
+      <h1>Overview<span class="sub">Conversations & activity</span></h1>
     </div>
     <div class="head-actions">
       <%== agent_filter_form("/studio/home", @agent) %>
@@ -18,35 +19,56 @@
         <b class="tnum" data-live-home-target="count"><%= @active_now %></b> active now
         <span class="live-ago muted" data-live-home-target="ago"></span>
       </span>
-      <a class="btn primary" href="/studio/playground">Open playground →</a>
+      <a class="btn primary" href="/studio/playground">Open playground</a>
     </div>
   </header>
 
-  <div class="stat-cards">
-    <% [["conversations", "Conversations", @conv_trend],
-        ["messages", "Messages", @msg_trend],
-        ["agents", "Agents", nil],
-        ["skills", "Skills", nil],
-        ["tools", "Tools", nil],
-        ["providers", "LLM providers", nil]].each do |key, label, trend| %>
-      <div class="stat-card">
-        <div class="stat-num tnum"><%= @counts[key] %></div>
-        <div class="stat-label"><%= label %><% if trend && !trend.zero? %>
-          <span class="trend <%= trend.positive? ? "up" : "down" %>" title="vs yesterday"><%= trend.positive? ? "+" : "−" %><%= trend.abs %></span>
-        <% end %></div>
-      </div>
+  <%# home-ops: everything below the header. live-home reloads this frame
+      (debounced) when a turn ends, so the numbers follow the traffic. %>
+  <turbo-frame id="home-ops" target="_top" data-live-home-target="ops">
+  <% totals = @day && @day["totals"] %>
+  <% turns = @day && @day["turns"] %>
+  <% p95 = turns && turns["windows"]["total_ms"]["p95"] %>
+  <% cost = totals && totals["cost"] %>
+  <div class="kpi-strip">
+    <% window = "last 14 days" %>
+    <% [["Conversations", @counts["conversations"], @conv_trend, (window if @agent)],
+        ["Messages", @counts["messages"], @msg_trend, window],
+        ["Outcomes", @outcomes_24h || "—", nil, "last 24h"],
+        ["Cost", usd(cost), nil, @day_before_cost.nil? ? "last 24h" : "last 24h · #{usd(@day_before_cost)} before"],
+        ["Turn p95", p95.nil? ? "—" : format("%.1fs", p95 / 1000.0), nil, turns ? "#{turns['count']} turns · 24h" : "last 24h"],
+        ["Failed turns", turns && turns["count"].positive? ? format("%.1f%%", turns["failures"] * 100.0 / turns["count"]) : "—", nil, turns ? "#{turns['failures']} in 24h" : "last 24h"]].each do |label, value, trend, sub| %>
+      <% delta = (trend && !trend.zero?) ? "#{trend.positive? ? '+' : '-'}#{trend.abs}" : nil %>
+      <%== render("_kpi", locals: { label: label, value: value, delta: delta, sub: sub }) %>
     <% end %>
   </div>
 
+  <p class="report-note">Every number follows the agent filter. Conversations and messages compare today with yesterday; cost, outcomes and turns cover the last 24 hours. <a href="/studio/models<%= "?agent=#{Rack::Utils.escape(@agent)}" if @agent %>">Models</a> has the detail.</p>
+
+  <%# What a person should act on now: review queues, stalled customers,
+      failing tools. Only non-zero items show. %>
+  <% attention = attention_items(turns) %>
+  <section class="attention" aria-label="Needs attention">
+    <h2>Needs attention</h2>
+    <% if attention.empty? %>
+      <span class="muted">Nothing waiting on you.</span>
+    <% else %>
+      <% attention.each do |text, href, tone| %>
+        <a class="attention-item <%= tone %>" href="<%= href %>" data-turbo-frame="_top"><%= text %></a>
+      <% end %>
+    <% end %>
+  </section>
+
   <div class="home-grid">
     <section class="card home-activity">
       <div class="section-head">
         <h2>Activity</h2>
         <span class="muted">conversations touched · last 14 days</span>
       </div>
-      <%# 24h sparkline: area-fill + 1.5px line over the hourly
-          series; same session scan, finer buckets. Geometry via attributes,
-          colors via classes — CSP-safe like the barchart below. %>
+      <%# 24h sparkline: area-fill + 1.5px line over the hourly series, on the
+          shared .chart base (Task 1) — same hairline axis and sans labels as
+          the funnel's bar chart, just a line/time-series shape instead of
+          bars. Geometry via attributes, colors via classes — CSP-safe. %>
       <% s_max = [@activity_24h.map(&:last).max || 0, 1].max %>
       <% s_n = @activity_24h.size %>
       <% s_pts = @activity_24h.each_with_index.map do |(_t, c), i|
@@ -57,11 +79,16 @@
         <div class="sparkline-meta">
           <b class="tnum"><%= @activity_24h.sum { |_t, c| c } %></b> conversations · last 24h
         </div>
-        <svg class="sparkline" viewBox="0 0 480 48" preserveAspectRatio="none" role="img"
+        <svg class="chart chart-sparkline" viewBox="0 0 480 48" preserveAspectRatio="none" role="img"
              aria-label="conversations per hour, last 24 hours">
           <polygon class="spark-area" points="<%= s_line %> 480,48 0,48"/>
           <polyline class="spark-line" points="<%= s_line %>" vector-effect="non-scaling-stroke"/>
+          <line class="axis" x1="0" y1="44" x2="480" y2="44" />
         </svg>
+        <div class="chart-labels">
+          <span><%= @activity_24h.first&.first&.strftime('%-l%P') %></span>
+          <span>now</span>
+        </div>
       </div>
       <% max = [@activity.map(&:last).max || 0, 1].max %>
       <svg class="barchart" viewBox="0 0 700 176" preserveAspectRatio="none" role="img" aria-label="conversations per day, last 14 days">
@@ -85,7 +112,7 @@
     <section class="card home-recent">
       <div class="section-head">
         <h2>Recent conversations</h2>
-        <a class="muted" href="/studio/chats">all →</a>
+        <a class="muted" href="/studio/chats<%= "?agent=#{Rack::Utils.escape(@agent)}" if @agent %>">See all</a>
       </div>
       <% cutoff = Time.now - (5 * 60) %>
       <ul class="convo-rail" data-live-home-target="list">
@@ -98,7 +125,7 @@
               <a href="/studio/sessions/<%= Rack::Utils.escape(s.id) %>">
                 <span class="avatar sm <%= avatar_class(s.id) %>"><%= s.id[0, 2].upcase %></span>
                 <span class="convo-main">
-                  <span class="convo-id mono"><%= s.id[0, 20] %></span>
+                  <span class="convo-id mono" title="<%= s.id %>"><%= s.id[0, 20] %></span>
                   <span class="convo-sub"><%= Array(s.messages).size %> msg · <%= time_ago(s.updated_at) %></span>
                 </span>
                 <span class="presence<%= " present" if fresh %>" title="touched in the last 5 minutes"></span>
@@ -109,4 +136,92 @@
       </ul>
     </section>
   </div>
+
+  <div class="home-grid">
+    <section class="card">
+      <div class="section-head"><h2>Cost per day</h2><span class="muted">reported USD · tokens in the tooltip · UTC days</span></div>
+      <% d_costs = @daily.map { |b| b["cost"] || 0 } %>
+      <% if @daily.empty? || d_costs.sum.zero? %>
+        <div class="empty">No reported cost in the last 14 days.</div>
+      <% else %>
+        <% d_max = [d_costs.max, 0.000001].max %>
+        <svg class="barchart" viewBox="0 0 700 176" preserveAspectRatio="none" role="img" aria-label="reported cost per day, last 14 days">
+          <% n = @daily.size; slot = 700.0 / n; bw = slot * 0.58 %>
+          <% @daily.each_with_index do |b, i| %>
+            <% c = b["cost"] || 0; h = (c / d_max) * 150.0; x = (i * slot) + ((slot - bw) / 2.0) %>
+            <% tokens = %w[input_tokens output_tokens].sum { |k| b[k].to_i } %>
+            <rect class="bar<%== ' bar-empty' if c.zero? %>" x="<%= format('%.1f', x) %>" y="<%= format('%.1f', c.zero? ? 157.0 : 160.0 - h) %>"
+                  width="<%= format('%.1f', bw) %>" height="<%= format('%.1f', c.zero? ? 3.0 : [h, 3.0].max) %>" rx="2">
+              <title><%= Time.iso8601(b["at"]).utc.strftime('%b %-d') %> · <%= usd(c) %> · <%= b["requests"] %> requests · <%= tokens %> tokens</title>
+            </rect>
+          <% end %>
+          <line class="barchart-axis-line" x1="0" y1="160" x2="700" y2="160" />
+        </svg>
+        <div class="barchart-axis">
+          <span><%= Time.iso8601(@daily.first["at"]).utc.strftime('%b %-d') %></span>
+          <span class="peak"><%= usd(d_costs.sum) %> in 14 days · peak <%= usd(d_max) %>/day</span>
+          <span><%= Time.iso8601(@daily.last["at"]).utc.strftime('%b %-d') %></span>
+        </div>
+      <% end %>
+    </section>
+
+    <section class="card">
+      <div class="section-head"><h2>Waiting for a reply</h2><span class="muted">customer spoke last, 10+ min ago · 24h</span></div>
+      <% if @stalled.empty? %>
+        <div class="empty">No conversation is waiting.</div>
+      <% else %>
+        <table class="grid">
+          <thead><tr><th>conversation</th><th>agent</th><th class="num">waiting</th></tr></thead>
+          <tbody>
+            <% @stalled.each do |row| %>
+              <tr><td><a class="mono" href="/studio/sessions/<%= Rack::Utils.escape(row[:id]) %>" title="<%= row[:id] %>"><%= row[:id][0, 20] %></a></td>
+                <td><%= row[:agent].empty? ? "—" : row[:agent] %></td><td class="num"><%= time_ago(row[:waiting].iso8601) %></td></tr>
+            <% end %>
+          </tbody>
+        </table>
+      <% end %>
+    </section>
+  </div>
+
+  <div class="home-grid">
+    <section class="card">
+      <div class="section-head"><h2>Agents</h2><span class="muted">conversations · last 14 days</span></div>
+      <% if @agent_ranking.empty? %>
+        <div class="empty">No agent conversations yet.</div>
+      <% else %>
+        <table class="grid">
+          <thead><tr><th>agent</th><th class="num">today</th><th class="num">14 days</th><th class="num">messages</th></tr></thead>
+          <tbody>
+            <% @agent_ranking.each do |row| %>
+              <tr><td><a href="/studio/chats?agent=<%= Rack::Utils.escape(row[:agent]) %>"><%= row[:agent] %></a></td>
+                <td class="num"><%= row[:today] %></td><td class="num"><%= row[:conversations] %></td><td class="num"><%= row[:messages] %></td></tr>
+            <% end %>
+          </tbody>
+        </table>
+      <% end %>
+      <% unless @cold_agents.empty? %>
+        <p class="muted">No conversation in <%= COLD_AGENT_DAYS %>+ days: <%== @cold_agents.map { |id| %(<a href="/studio/agents/#{Rack::Utils.escape(id)}">#{Rack::Utils.escape_html(id)}</a>) }.join(", ") %></p>
+      <% end %>
+    </section>
+
+    <section class="card">
+      <div class="section-head"><h2>Tool health</h2><span class="muted">last 24h</span></div>
+      <% tools = turns ? turns["tools"].sort_by { |t| [-t["failures"], -t["calls"]] }.first(8) : [] %>
+      <% if tools.empty? %>
+        <div class="empty">No tool calls in the last 24h.</div>
+      <% else %>
+        <table class="grid">
+          <thead><tr><th>tool</th><th class="num">calls</th><th class="num">ok %</th><th class="num">p95 ms</th></tr></thead>
+          <tbody>
+            <% tools.each do |t| %>
+              <tr><td><%= t["tool"] %></td><td class="num"><%= t["calls"] %></td>
+                <td class="num"><%= format("%.1f", (t["calls"] - t["failures"]) * 100.0 / t["calls"]) %></td>
+                <td class="num"><%= t["p95_ms"] || "—" %></td></tr>
+            <% end %>
+          </tbody>
+        </table>
+      <% end %>
+    </section>
+  </div>
+  </turbo-frame>
 </div>

data/lib/insika/studio/views/inbox.erb

@@ -0,0 +1,36 @@
+<%# Review inbox — every item parked on a person, across Approvals, Facts,
+    Harvest, Refinement and guardrail false-positive reports. Oldest first;
+    each row opens the page where the decision is made. %>
+<header class="page-head">
+  <div>
+    <%== crumbs_for("Inbox") %>
+    <h1>Inbox<span class="sub"><%= @inbox_total %> waiting on a person</span></h1>
+  </div>
+</header>
+
+<nav class="segmented inbox-tabs" aria-label="Queue">
+  <a href="/studio/inbox"<%== ' aria-current="page"' unless @inbox_type %>>All&nbsp;<span class="count"><%= @inbox_total %></span></a>
+  <% Studio::App::INBOX_TYPES.each do |type, label| %>
+    <a href="/studio/inbox?type=<%= type %>"<%== ' aria-current="page"' if @inbox_type == type %>><%= label %>&nbsp;<span class="count"><%= @inbox_counts[type] %></span></a>
+  <% end %>
+</nav>
+
+<% if @items.empty? %>
+  <%== render("_empty", locals: { icon: :approvals, text: "Nothing waiting on you." }) %>
+<% else %>
+  <div class="card">
+    <table class="grid">
+      <thead><tr><th>type</th><th>item</th><th>agent</th><th>since</th></tr></thead>
+      <tbody>
+        <% @items.each do |i| %>
+          <tr>
+            <td><span class="inbox-type <%= i[:type] %>"><%= Studio::App::INBOX_TYPES[i[:type]] %></span></td>
+            <td><a href="<%= i[:href] %>"><%= i[:title] %></a></td>
+            <td class="mono"><%= i[:agent] %></td>
+            <td class="mono"><%= i[:at] ? time_ago(i[:at]) : "—" %></td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+<% end %>

data/lib/insika/studio/views/kits.erb

@@ -0,0 +1,176 @@
+<%# Kits — drill-down: master list | kit editor + membership. A kit bundles
+   skills, tools and MCP servers; agents that list it (AgentProfile#kits) get
+   them at read time (Insika::Kits). @selected nil = none open, "" = new. %>
+<header class="page-head">
+  <h1>Kits<span class="sub">Bundles of skills and tools that agents share</span></h1>
+</header>
+<div class="drill" data-controller="list-filter">
+  <aside class="drill-pane drill-master">
+    <div class="drill-pane-head">
+      <div class="title"><strong>Kits <span class="count"><%= @kits.size %></span></strong></div>
+      <a class="btn primary btn-sm" href="/studio/kits/new">+ new</a>
+    </div>
+    <div class="drill-search">
+      <input type="search" class="filter-input" placeholder="Search kits…" aria-label="Filter kits"
+             data-list-filter-target="query" data-action="input->list-filter#filter keydown->list-filter#clear">
+    </div>
+    <nav class="drill-pane-body drill-list" aria-label="kits">
+      <% if @kits.empty? %>
+        <div class="empty">No kits yet. Create one to share skills and tools across agents.</div>
+      <% end %>
+      <% @kits.each do |name, kit| %>
+        <% members = @agents.count { |a| Array(a.kits).include?(name) } %>
+        <a class="drill-item<%== ' active' if @selected == name %>"
+           href="/studio/kits/<%= Rack::Utils.escape(name) %>"
+           data-list-filter-target="item" data-filter-text="<%= name %> <%= kit["description"] %>">
+          <div class="drill-item-name"><span class="txt" title="<%= name %>"><%= name %></span><span class="pill plain"><%= members %> <%= members == 1 ? "agent" : "agents" %></span></div>
+          <div class="drill-item-sub"><%= kit["description"] %></div>
+        </a>
+      <% end %>
+      <div class="empty" data-list-filter-target="empty" hidden>No kits match your filter.</div>
+    </nav>
+  </aside>
+
+  <section class="drill-pane drill-detail">
+    <% if @selected.nil? %>
+      <div class="drill-empty">
+        <div>
+          <h2>Kits</h2>
+          <p>Pick a kit, or create one. A kit bundles skills and tools; every agent in it gets them on its next turn.</p>
+        </div>
+      </div>
+    <% else %>
+      <% new = @selected == "" %>
+      <% kit = @kit || {} %>
+      <%# write_kit replaces the whole kit: a stored item the live catalog does not list
+          (an MCP server down, a non-MCP group) is rendered checked so a save keeps it. %>
+      <% gone_skills = Array(kit["skills"]) - @skills.map(&:name) %>
+      <% gone_tools = Array(kit["tools"]) - @tools.map(&:name) %>
+      <% gone_groups = Array(kit["tool_groups"]) - @tool_group_names %>
+      <div class="drill-pane-head">
+        <div class="title"><strong class="mono"><%= new ? "New kit" : @selected %></strong></div>
+        <button type="submit" form="kit-form" class="btn primary" data-turbo-submits-with="Saving…">Save kit</button>
+      </div>
+      <div class="drill-pane-body">
+        <form id="kit-form" method="post" action="/studio/kits" data-controller="dirty-guard">
+          <%== csrf_tag %>
+          <% if new %>
+            <label>name <span class="muted">(lowercase slug, e.g. grocery)</span>
+              <input type="text" name="name" placeholder="grocery" required pattern="[a-z0-9][a-z0-9_\-]{0,63}">
+            </label>
+          <% else %>
+            <input type="hidden" name="name" value="<%= @selected %>">
+          <% end %>
+          <label>description
+            <input type="text" name="description" value="<%= kit["description"] %>" placeholder="What agents in this kit have in common">
+          </label>
+
+          <details class="tool-section" open>
+            <summary>Skills <span class="count"><%= Array(kit["skills"]).size %>/<%= @skills.size %></span></summary>
+            <div class="check-grid tool-grid">
+              <% @skills.each do |s| %>
+                <label class="check tool-check" title="<%= s.description %>">
+                  <input type="checkbox" name="skills[]" value="<%= s.name %>"<%== " checked" if Array(kit["skills"]).include?(s.name) %>>
+                  <span class="mono"><%= s.name %></span>
+                </label>
+              <% end %>
+              <% gone_skills.each do |name| %>
+                <label class="check tool-check" title="stored in the kit, not in the skill catalog right now">
+                  <input type="checkbox" name="skills[]" value="<%= name %>" checked>
+                  <span class="mono"><%= name %></span> <span class="pill warn">not in catalog</span>
+                </label>
+              <% end %>
+            </div>
+          </details>
+
+          <% if @tool_group_names.any? || gone_groups.any? %>
+            <details class="tool-section" open>
+              <summary>MCP servers <span class="count"><%= Array(kit["tool_groups"]).size %>/<%= @tool_group_names.size %></span></summary>
+              <div class="check-grid tool-grid">
+                <% @tool_group_names.each do |g| %>
+                  <label class="check tool-check">
+                    <input type="checkbox" name="tool_groups[]" value="<%= g %>"<%== " checked" if Array(kit["tool_groups"]).include?(g) %>>
+                    <span class="mono">all tools from <%= g.delete_prefix("mcp:") %></span>
+                  </label>
+                <% end %>
+                <% gone_groups.each do |g| %>
+                  <label class="check tool-check" title="stored in the kit, no live tool carries this group right now">
+                    <input type="checkbox" name="tool_groups[]" value="<%= g %>" checked>
+                    <span class="mono"><%= g %></span> <span class="pill warn">not in catalog</span>
+                  </label>
+                <% end %>
+              </div>
+            </details>
+          <% end %>
+
+          <div class="only-on-scope" data-controller="list-filter">
+            <details class="tool-section" open>
+              <summary>Tools <span class="count"><%= Array(kit["tools"]).size %>/<%= @tools.size %></span></summary>
+              <div class="matrix-topline">
+                <label class="switch" title="hide tools not in this kit; typing a search shows every match">
+                  <input type="checkbox" id="only-on" checked>
+                  <span class="switch-track" aria-hidden="true"></span>
+                  <span class="switch-label">only in kit</span>
+                </label>
+              </div>
+              <input type="search" class="filter-input" placeholder="Search to add tools…" aria-label="Search tools"
+                     data-list-filter-target="query" data-action="input->list-filter#filter keydown->list-filter#clear">
+              <p class="empty" data-list-filter-target="empty" hidden>No tools match your filter.</p>
+              <div class="check-grid tool-grid">
+                <% @tools.each do |t| %>
+                  <label class="check tool-check" title="<%= t.description %>"
+                         data-list-filter-target="item" data-filter-text="<%= t.name %>">
+                    <input type="checkbox" name="tools[]" value="<%= t.name %>"<%== " checked" if Array(kit["tools"]).include?(t.name) %>>
+                    <span class="mono"><%= t.name %></span>
+                  </label>
+                <% end %>
+                <% gone_tools.each do |name| %>
+                  <label class="check tool-check" title="stored in the kit, not in the tool catalog right now"
+                         data-list-filter-target="item" data-filter-text="<%= name %>">
+                    <input type="checkbox" name="tools[]" value="<%= name %>" checked>
+                    <span class="mono"><%= name %></span> <span class="pill warn">not in catalog</span>
+                  </label>
+                <% end %>
+              </div>
+            </details>
+          </div>
+        </form>
+
+        <% unless new %>
+          <div class="drill-section">
+            <div class="drill-section-head">
+              <h3>Agents</h3>
+              <span class="muted">Checked agents get this kit's skills and tools on their next turn. An agent allowed every tool or every skill keeps that.</span>
+            </div>
+            <form method="post" action="/studio/kits/<%= Rack::Utils.escape(@selected) %>/agents" data-controller="dirty-guard">
+              <%== csrf_tag %>
+              <% if @agents.empty? %>
+                <p class="muted">No agents configured.</p>
+              <% else %>
+                <div class="check-grid tool-grid">
+                  <% @agents.each do |a| %>
+                    <label class="check tool-check">
+                      <input type="checkbox" name="agent_ids[]" value="<%= a.id %>"<%== " checked" if Array(a.kits).include?(@selected) %>>
+                      <span class="mono"><%= a.id %></span>
+                      <% if (a.tools_allow.nil? && a.tools_allow_groups.nil?) || a.skills.nil? %>
+                        <span class="pill warn" title="this agent gets every tool or skill, so the kit adds nothing there — limit it in Tools or in its Skills tab">all</span>
+                      <% end %>
+                    </label>
+                  <% end %>
+                </div>
+                <div class="actions"><button type="submit" class="primary" data-turbo-submits-with="Applying…">Apply to agents</button></div>
+              <% end %>
+            </form>
+          </div>
+
+          <div class="drill-section">
+            <form method="post" action="/studio/kits/<%= Rack::Utils.escape(@selected) %>/delete">
+              <%== csrf_tag %>
+              <div class="actions"><button type="submit" data-turbo-confirm="Remove kit? Agents in it lose its skills and tools.">Delete kit</button></div>
+            </form>
+          </div>
+        <% end %>
+      </div>
+    <% end %>
+  </section>
+</div>