completion-kit 0.4.8 → 0.5.0

data/app/views/completion_kit/api_reference/index.html.erb

@@ -64,6 +64,7 @@ end %>
   <input type="radio" name="ck-api-tab" id="ck-tab-datasets" class="ck-api-tabs__radio">
   <input type="radio" name="ck-api-tab" id="ck-tab-metrics" class="ck-api-tabs__radio">
   <input type="radio" name="ck-api-tab" id="ck-tab-metric-groups" class="ck-api-tabs__radio">
+  <input type="radio" name="ck-api-tab" id="ck-tab-tags" class="ck-api-tabs__radio">
   <input type="radio" name="ck-api-tab" id="ck-tab-providers" class="ck-api-tabs__radio">
 
   <nav class="ck-api-tabs__nav">
@@ -74,6 +75,7 @@ end %>
     <label for="ck-tab-datasets" class="ck-api-tabs__label">Datasets <span class="ck-api-tabs__count">5</span></label>
     <label for="ck-tab-metrics" class="ck-api-tabs__label">Metrics <span class="ck-api-tabs__count">5</span></label>
     <label for="ck-tab-metric-groups" class="ck-api-tabs__label">Metric Groups <span class="ck-api-tabs__count">5</span></label>
+    <label for="ck-tab-tags" class="ck-api-tabs__label">Tags <span class="ck-api-tabs__count">5</span></label>
     <label for="ck-tab-providers" class="ck-api-tabs__label">Providers <span class="ck-api-tabs__count">5</span></label>
   </nav>
 
@@ -254,6 +256,42 @@ end %>
       </div>
     </div>
 
+    <div class="ck-api-tabs__panel">
+      <h2 class="ck-section-title">Tags</h2>
+      <p class="ck-copy">Domain labels you can attach to metrics, prompts, runs, and datasets. Tags are auto-assigned a color from a 10-color palette. Each index page can be filtered by one or more tags using <code>?tag[]=name</code> query params (OR semantics).</p>
+      <div class="ck-api-endpoint">
+        <p class="ck-api-method"><span class="ck-chip ck-chip--soft">GET</span> /api/v1/tags</p>
+        <p class="ck-meta-copy">List all tags with name and color.</p>
+        <%= render "example", base_url: @base_url, token: token_display, real_token: @token, cmd: "curl #{@base_url}/api/v1/tags \\\n  -H \"Authorization: Bearer #{token_display}\"" %>
+      </div>
+      <div class="ck-api-endpoint">
+        <p class="ck-api-method"><span class="ck-chip ck-chip--soft">POST</span> /api/v1/tags</p>
+        <p class="ck-meta-copy">Create a tag.</p>
+        <p class="ck-api-params"><strong>Required:</strong>&ensp;<code>name</code></p>
+        <%= render "example", base_url: @base_url, token: token_display, real_token: @token, cmd: "curl -X POST #{@base_url}/api/v1/tags \\\n  -H \"Authorization: Bearer #{token_display}\" \\\n  -H \"Content-Type: application/json\" \\\n  -d '{\"name\": \"real estate\"}'" %>
+      </div>
+      <div class="ck-api-endpoint">
+        <p class="ck-api-method"><span class="ck-chip ck-chip--soft">GET</span>&ensp;<span class="ck-chip ck-chip--soft">PATCH</span>&ensp;<span class="ck-chip" style="color: var(--ck-danger);">DELETE</span> /api/v1/tags/:id</p>
+        <p class="ck-meta-copy">Get, update, or delete a tag. PATCH accepts <code>name</code>. DELETE returns 204 No Content and removes all taggings for this tag.</p>
+      </div>
+      <div class="ck-api-endpoint" style="padding-top: 1rem;">
+        <p class="ck-kicker" style="margin-bottom: 0.5rem;">Tagging resources</p>
+        <p class="ck-meta-copy">Metrics, prompts, runs, and datasets accept a <code>tag_names</code> array on their create and update endpoints. Passing a name that does not yet exist silently creates the tag. On PATCH, the list replaces all existing tags for that record (omit the field to leave tags unchanged).</p>
+        <%= render "example", base_url: @base_url, token: token_display, real_token: @token, cmd: "curl -X POST #{@base_url}/api/v1/metrics \\\n  -H \"Authorization: Bearer #{token_display}\" \\\n  -H \"Content-Type: application/json\" \\\n  -d '{\"name\": \"Accuracy\", \"tag_names\": [\"real estate\"]}'" %>
+      </div>
+      <div class="ck-api-endpoint" style="padding-top: 1rem;">
+        <p class="ck-kicker" style="margin-bottom: 0.5rem;">MCP tools</p>
+        <div class="ck-mcp-tools">
+          <div class="ck-mcp-tool"><code class="ck-mcp-tool__name">tags_list</code><span class="ck-mcp-tool__desc">List all tags</span></div>
+          <div class="ck-mcp-tool"><code class="ck-mcp-tool__name">tags_get</code><span class="ck-mcp-tool__desc">Get a tag by ID</span></div>
+          <div class="ck-mcp-tool"><code class="ck-mcp-tool__name">tags_create</code><span class="ck-mcp-tool__desc">Create a tag (name required)</span></div>
+          <div class="ck-mcp-tool"><code class="ck-mcp-tool__name">tags_update</code><span class="ck-mcp-tool__desc">Update a tag's name</span></div>
+          <div class="ck-mcp-tool"><code class="ck-mcp-tool__name">tags_delete</code><span class="ck-mcp-tool__desc">Delete a tag and remove all its taggings</span></div>
+        </div>
+        <p class="ck-meta-copy" style="margin-top: 0.75rem;">The existing <code>metrics_create</code>, <code>metrics_update</code>, <code>prompts_create</code>, <code>prompts_update</code>, <code>runs_create</code>, <code>runs_update</code>, <code>datasets_create</code>, and <code>datasets_update</code> tools all accept a <code>tag_names</code> parameter with the same auto-create and replace semantics as the REST API.</p>
+      </div>
+    </div>
+
     <div class="ck-api-tabs__panel">
       <h2 class="ck-section-title">Provider Credentials</h2>
       <p class="ck-copy">LLM provider API keys. The <code>api_key</code> field is write-only and never returned in responses.</p>

data/app/views/completion_kit/datasets/_form.html.erb

@@ -21,8 +21,27 @@
       <%= form.text_area :csv_data, rows: 12, class: "ck-input ck-input--area ck-input--code", placeholder: "content,audience\nFirst ticket text,internal\nSecond ticket text,customer" %>
     </div>
 
+    <%= render "completion_kit/tags/picker", record: dataset, param_namespace: :dataset %>
+
     <div class="ck-actions">
-      <%= link_to "Cancel", datasets_path, class: ck_button_classes(:light, variant: :outline) %>
+      <% if dataset.persisted? %>
+        <% runs_n = dataset.runs.count %>
+        <% responses_n = CompletionKit::Response.where(run_id: dataset.runs.select(:id)).count %>
+        <% confirm = if runs_n.zero?
+             "Delete \"#{dataset.name}\"? It has no runs."
+           else
+             "Delete \"#{dataset.name}\"? Cascades through #{pluralize(runs_n, 'run')} and #{pluralize(responses_n, 'response')} (and their reviews) that used this dataset."
+           end %>
+        <%= button_to dataset_path(dataset), method: :delete,
+              form_class: "inline-block",
+              class: "ck-icon-btn",
+              title: "Delete dataset",
+              "aria-label": "Delete dataset",
+              data: { turbo_confirm: confirm } do %>
+          <%= heroicon_tag "trash", variant: :outline, size: 16, "aria-hidden": "true" %>
+        <% end %>
+      <% end %>
+      <%= link_to "Cancel", datasets_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(dataset.persisted? ? "Save dataset" : "Create dataset", class: ck_button_classes(:dark)) %>
     </div>
   </div>

data/app/views/completion_kit/datasets/index.html.erb

@@ -8,6 +8,11 @@
   </div>
 </section>
 
+<%= render "completion_kit/tags/filter_bar",
+      available: @available_tags,
+      selected: @selected_tags,
+      base_path: datasets_path %>
+
 <% if @datasets.any? %>
   <table class="ck-results-table">
     <thead>
@@ -22,7 +27,14 @@
     <tbody>
       <% @datasets.each do |dataset| %>
         <tr onclick="window.location='<%= dataset_path(dataset) %>'" style="cursor: pointer;">
-          <td><strong><%= dataset.name %></strong></td>
+          <td>
+            <strong><%= dataset.name %></strong>
+            <% if dataset.tags.any? %>
+              <div class="tag-marks-row">
+                <%= render "completion_kit/tags/marks", tags: dataset.tags %>
+              </div>
+            <% end %>
+          </td>
           <td><%= dataset.row_count %></td>
           <td><%= dataset.runs.count %></td>
           <td class="ck-meta-copy"><time datetime="<%= dataset.created_at.iso8601 %>"><%= dataset.created_at.strftime("%b %-d, %Y") %></time></td>
@@ -31,6 +43,10 @@
       <% end %>
     </tbody>
   </table>
+<% elsif @selected_tags.any? %>
+  <div class="ck-empty">
+    <p>No datasets match these tags. <%= link_to "Clear filters", datasets_path, class: "ck-link" %>.</p>
+  </div>
 <% else %>
   <div class="ck-empty">
     No datasets yet. Create one to use with your prompts.

data/app/views/completion_kit/datasets/show.html.erb

@@ -12,6 +12,12 @@
   </div>
 </section>
 
+<% if @dataset.tags.any? %>
+  <div class="tag-marks-row tag-marks-row--header">
+    <%= render "completion_kit/tags/marks", tags: @dataset.tags %>
+  </div>
+<% end %>
+
 <section>
   <p class="ck-kicker">CSV preview</p>
   <%

data/app/views/completion_kit/metric_groups/_form.html.erb

@@ -1,19 +1,17 @@
 <%= form_with(model: metric_group, url: metric_group.persisted? ? metric_group_path(metric_group) : metric_groups_path, local: true) do |form| %>
-  <% if metric_group.errors.any? %>
-    <div class="ck-flash ck-flash--alert">
-      <p class="ck-flash__title"><%= pluralize(metric_group.errors.count, "problem") %> prevented this metric group from being saved.</p>
-      <ul class="ck-error-list">
-        <% metric_group.errors.full_messages.each do |message| %>
-          <li><%= message %></li>
-        <% end %>
-      </ul>
-    </div>
-  <% end %>
+  <% name_error = metric_group.errors[:name].first %>
 
   <div class="ck-card ck-form-card">
     <div class="ck-field">
       <%= form.label :name, "Metric group name", class: "ck-label" %>
-      <%= form.text_field :name, class: "ck-input", placeholder: "Support quality" %>
+      <%= form.text_field :name,
+            class: ["ck-input", ("ck-input--error" if name_error)].compact.join(" "),
+            placeholder: "Support quality",
+            autofocus: !metric_group.persisted?,
+            "aria-invalid": name_error ? "true" : nil %>
+      <% if name_error %>
+        <p class="ck-field-error" role="alert"><%= name_error %></p>
+      <% end %>
     </div>
 
     <div class="ck-field">
@@ -21,16 +19,41 @@
       <%= form.text_area :description, rows: 3, class: "ck-input ck-input--area", placeholder: "When this metric group should be used." %>
     </div>
 
+    <%= render "completion_kit/tags/picker", record: metric_group, param_namespace: :metric_group %>
+
     <div class="ck-field">
       <p class="ck-label">Metrics in this group</p>
-      <p class="ck-hint">Pick the metrics to include.</p>
-      <div class="ck-list ck-list--compact">
+      <p class="ck-hint">Pick the metrics to include. Filter the list by tag to narrow it down.</p>
+
+      <% available_filter_tags = @metrics.flat_map(&:tags).uniq.sort_by(&:name) %>
+      <% if available_filter_tags.any? %>
+        <div class="ck-metric-tag-filter" data-metric-tag-filter>
+          <span class="ck-metric-tag-filter__label">Filter metrics by tag</span>
+          <% available_filter_tags.each do |tag| %>
+            <button type="button"
+                    class="tag-mark tag-mark--off ck-metric-tag-filter__chip"
+                    style="--mark-color: var(--tag-<%= tag.color %>);"
+                    data-filter-tag="<%= tag.name %>"
+                    onclick="ckToggleMetricGroupFilter(this)"><%= tag.name %></button>
+          <% end %>
+        </div>
+      <% end %>
+
+      <div class="ck-metric-checkboxes" data-metric-checkboxes>
         <% @metrics.each do |metric| %>
-          <label class="ck-item">
-            <%= check_box_tag "metric_group[metric_ids][]", metric.id, metric_group.metrics.exists?(metric.id), class: "ck-checkbox" %>
-            <span>
-              <strong><%= metric.name %></strong>
-              <span class="ck-meta-copy"><%= metric.instruction.presence || "No instruction set." %></span>
+          <label class="ck-checkbox-label" data-metric-tags="<%= metric.tag_names.join(",") %>">
+            <%= check_box_tag "metric_group[metric_ids][]", metric.id, metric_group.metrics.exists?(metric.id), class: "ck-checkbox", id: "metric_group_metric_#{metric.id}" %>
+            <span class="ck-checkbox-label__box" aria-hidden="true"></span>
+            <span class="ck-checkbox-label__body">
+              <span class="ck-checkbox-label__text"><%= metric.name %></span>
+              <% if metric.instruction.present? %>
+                <span class="ck-checkbox-label__hint"><%= truncate(metric.instruction.to_s, length: 90) %></span>
+              <% end %>
+              <% if metric.tags.any? %>
+                <div class="tag-marks-row">
+                  <%= render "completion_kit/tags/marks", tags: metric.tags %>
+                </div>
+              <% end %>
             </span>
           </label>
         <% end %>
@@ -38,8 +61,40 @@
       <%= hidden_field_tag "metric_group[metric_ids][]", "" %>
     </div>
 
+    <script>
+      function ckToggleMetricGroupFilter(btn) {
+        btn.classList.toggle("tag-mark--off");
+        var bar = btn.closest("[data-metric-tag-filter]");
+        var grid = bar && bar.parentElement.querySelector("[data-metric-checkboxes]");
+        if (!grid) return;
+        var active = Array.prototype.map.call(
+          bar.querySelectorAll(".ck-metric-tag-filter__chip:not(.tag-mark--off)"),
+          function(b) { return b.getAttribute("data-filter-tag"); }
+        );
+        grid.querySelectorAll(".ck-checkbox-label").forEach(function(lbl) {
+          var tags = (lbl.getAttribute("data-metric-tags") || "").split(",").filter(Boolean);
+          var visible = active.length === 0 || tags.some(function(t) { return active.indexOf(t) !== -1; });
+          lbl.style.display = visible ? "" : "none";
+        });
+      }
+    </script>
+
     <div class="ck-actions">
-      <%= link_to "Cancel", metrics_path, class: ck_button_classes(:light, variant: :outline) %>
+      <% if metric_group.persisted? %>
+        <% members_n = metric_group.metrics.count %>
+        <% confirm = members_n.zero? ?
+             "Delete \"#{metric_group.name}\"? It has no members." :
+             "Delete \"#{metric_group.name}\"? Removes this grouping. #{pluralize(members_n, 'member metric')} #{members_n == 1 ? 'is' : 'are'} kept." %>
+        <%= button_to metric_group_path(metric_group), method: :delete,
+              form_class: "inline-block",
+              class: "ck-icon-btn",
+              title: "Delete metric group",
+              "aria-label": "Delete metric group",
+              data: { turbo_confirm: confirm } do %>
+          <%= heroicon_tag "trash", variant: :outline, size: 16, "aria-hidden": "true" %>
+        <% end %>
+      <% end %>
+      <%= link_to "Cancel", metrics_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(metric_group.persisted? ? "Save metric group" : "Create metric group", class: ck_button_classes(:dark)) %>
     </div>
   </div>

data/app/views/completion_kit/metric_groups/index.html.erb

@@ -13,27 +13,53 @@
   </div>
 </section>
 
+<%= render "completion_kit/tags/filter_bar",
+      available: @available_tags,
+      selected: @selected_tags,
+      base_path: metric_groups_path %>
+
 <% if @metric_groups.any? %>
   <table class="ck-results-table">
     <thead>
       <tr>
         <th>Name</th>
         <th>Description</th>
-        <th>Metrics</th>
+        <th>Members</th>
         <th></th>
       </tr>
     </thead>
     <tbody>
       <% @metric_groups.each do |metric_group| %>
         <tr onclick="window.location='<%= metric_group_path(metric_group) %>'" style="cursor: pointer;">
-          <td><strong><%= metric_group.name %></strong></td>
-          <td class="ck-meta-copy"><%= truncate(metric_group.description.to_s, length: 90).presence || "—" %></td>
-          <td class="ck-meta-copy"><%= metric_group.metrics.any? ? metric_group.metrics.map(&:name).join(", ") : "empty" %></td>
+          <td>
+            <strong><%= metric_group.name %></strong>
+            <% if metric_group.tags.any? %>
+              <div class="tag-marks-row">
+                <%= render "completion_kit/tags/marks", tags: metric_group.tags %>
+              </div>
+            <% end %>
+          </td>
+          <td class="ck-meta-copy"><div class="ck-clamp-2"><%= metric_group.description.presence || "—" %></div></td>
+          <td>
+            <% if metric_group.metrics.any? %>
+              <div class="ck-mg-members">
+                <% metric_group.metrics.each do |m| %>
+                  <span class="ck-mg-member"><%= m.name %></span>
+                <% end %>
+              </div>
+            <% else %>
+              <span class="ck-metrics-table__dim">empty</span>
+            <% end %>
+          </td>
           <td class="ck-results-table__arrow">&rarr;</td>
         </tr>
       <% end %>
     </tbody>
   </table>
+<% elsif @selected_tags.any? %>
+  <div class="ck-empty">
+    <p>No metric groups match these tags. <%= link_to "Clear filters", metric_groups_path, class: "ck-link" %>.</p>
+  </div>
 <% else %>
   <div class="ck-empty">
     <p>No metric groups yet. <%= link_to "Create one", new_metric_group_path, class: "ck-link" %> if you want to group multiple metrics and apply them together.</p>

data/app/views/completion_kit/metrics/_form.html.erb

@@ -43,8 +43,26 @@
       </div>
     </div>
 
+    <%= render "completion_kit/tags/picker", record: metric, param_namespace: :metric %>
+
     <div class="ck-actions">
-      <%= link_to "Cancel", metrics_path, class: ck_button_classes(:light, variant: :outline) %>
+      <% if metric.persisted? %>
+        <% groups_n = metric.metric_groups.count %>
+        <% reviews_n = metric.reviews.count %>
+        <% parts = [] %>
+        <% parts << "in #{pluralize(groups_n, 'metric group')} (removed from each)" if groups_n > 0 %>
+        <% parts << "scored in #{pluralize(reviews_n, 'review')} (scores kept, link cleared)" if reviews_n > 0 %>
+        <% confirm = parts.empty? ? "Delete \"#{metric.name}\"? It's not in use." : "Delete \"#{metric.name}\"? It's #{parts.to_sentence}." %>
+        <%= button_to metric_path(metric), method: :delete,
+              form_class: "inline-block",
+              class: "ck-icon-btn",
+              title: "Delete metric",
+              "aria-label": "Delete metric",
+              data: { turbo_confirm: confirm } do %>
+          <%= heroicon_tag "trash", variant: :outline, size: 16, "aria-hidden": "true" %>
+        <% end %>
+      <% end %>
+      <%= link_to "Cancel", metrics_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(metric.persisted? ? "Save metric" : "Create metric", class: ck_button_classes(:dark)) %>
     </div>
   </div>

data/app/views/completion_kit/metrics/index.html.erb

@@ -8,6 +8,11 @@
   </div>
 </section>
 
+<%= render "completion_kit/tags/filter_bar",
+      available: @available_tags,
+      selected: @selected_tags,
+      base_path: metrics_path %>
+
 <% if @metrics.any? %>
   <table class="ck-results-table ck-metrics-table">
     <thead>
@@ -21,8 +26,15 @@
     <tbody>
       <% @metrics.each do |metric| %>
         <tr onclick="window.location='<%= metric_path(metric) %>'" style="cursor: pointer;">
-          <td><strong><%= metric.name %></strong></td>
-          <td class="ck-meta-copy"><%= truncate(metric.instruction.to_s, length: 90).presence || "—" %></td>
+          <td>
+            <strong><%= metric.name %></strong>
+            <% if metric.tags.any? %>
+              <div class="tag-marks-row">
+                <%= render "completion_kit/tags/marks", tags: metric.tags %>
+              </div>
+            <% end %>
+          </td>
+          <td class="ck-meta-copy"><div class="ck-clamp-2"><%= metric.instruction.presence || "—" %></div></td>
           <td>
             <% groups = metric.metric_groups %>
             <% if groups.any? %>
@@ -48,6 +60,10 @@
       Use the same metrics on multiple runs? <%= link_to "Group them →", metric_groups_path, class: "ck-link" %>
     </p>
   <% end %>
+<% elsif @selected_tags.any? %>
+  <div class="ck-empty">
+    <p>No metrics match these tags. <%= link_to "Clear filters", metrics_path, class: "ck-link" %>.</p>
+  </div>
 <% else %>
   <div class="ck-empty">
     <p>No metrics yet. <%= link_to "Create your first metric", new_metric_path, class: "ck-link" %> to start scoring prompt outputs.</p>

data/app/views/completion_kit/metrics/show.html.erb

@@ -12,6 +12,12 @@
   </div>
 </section>
 
+<% if @metric.tags.any? %>
+  <div class="tag-marks-row tag-marks-row--header">
+    <%= render "completion_kit/tags/marks", tags: @metric.tags %>
+  </div>
+<% end %>
+
 <% if @metric.instruction.present? %>
 <section class="ck-card">
   <p class="ck-kicker">Instruction</p>

data/app/views/completion_kit/prompts/_form.html.erb

@@ -47,8 +47,27 @@
       <p class="ck-field-hint" id="refresh-status" style="min-height: 1.2em; margin-top: -0.25rem; font-size: 0.75rem;">&nbsp;</p>
     </div>
 
+    <%= render "completion_kit/tags/picker", record: prompt, param_namespace: :prompt %>
+
     <div class="ck-actions">
-      <%= link_to "Cancel", prompts_path, class: ck_button_classes(:light, variant: :outline) %>
+      <% if prompt.persisted? %>
+        <% runs_n = prompt.runs.count %>
+        <% responses_n = prompt.responses.count %>
+        <% confirm = if runs_n.zero?
+             "Delete \"#{prompt.display_name}\"? This version has no runs."
+           else
+             "Delete \"#{prompt.display_name}\"? Cascades through #{pluralize(runs_n, 'run')} and #{pluralize(responses_n, 'response')} (and their reviews). Other versions of this prompt are untouched."
+           end %>
+        <%= button_to prompt_path(prompt), method: :delete,
+              form_class: "inline-block",
+              class: "ck-icon-btn",
+              title: "Delete prompt",
+              "aria-label": "Delete prompt",
+              data: { turbo_confirm: confirm } do %>
+          <%= heroicon_tag "trash", variant: :outline, size: 16, "aria-hidden": "true" %>
+        <% end %>
+      <% end %>
+      <%= link_to "Cancel", prompts_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(prompt.persisted? ? "Save prompt" : "Create prompt", class: ck_button_classes(:dark), disabled: available.empty?) %>
     </div>
   </div>

data/app/views/completion_kit/prompts/index.html.erb

@@ -8,6 +8,11 @@
   </div>
 </section>
 
+<%= render "completion_kit/tags/filter_bar",
+      available: @available_tags,
+      selected: @selected_tags,
+      base_path: prompts_path %>
+
 <% if @prompts.any? %>
   <table class="ck-results-table ck-prompts-table">
     <thead>
@@ -23,7 +28,14 @@
     <tbody>
       <% @prompts.each do |prompt| %>
         <tr onclick="window.location='<%= prompt_path(prompt) %>'" style="cursor: pointer;">
-          <td><strong><%= prompt.name %></strong></td>
+          <td>
+            <strong><%= prompt.name %></strong>
+            <% if prompt.tags.any? %>
+              <div class="tag-marks-row">
+                <%= render "completion_kit/tags/marks", tags: prompt.tags %>
+              </div>
+            <% end %>
+          </td>
           <% latest_version = prompt.family_versions.maximum(:version_number) %>
           <td>
             <span class="ck-chip ck-chip--soft"><%= prompt.version_label %></span>
@@ -58,6 +70,10 @@
       <% end %>
     </tbody>
   </table>
+<% elsif @selected_tags.any? %>
+  <div class="ck-empty">
+    <p>No prompts match these tags. <%= link_to "Clear filters", prompts_path, class: "ck-link" %>.</p>
+  </div>
 <% else %>
   <div class="ck-empty">
     No prompts yet. Create one to get started.

data/app/views/completion_kit/prompts/show.html.erb

@@ -25,6 +25,12 @@
   </div>
 </section>
 
+<% if @prompt.tags.any? %>
+  <div class="tag-marks-row tag-marks-row--header">
+    <%= render "completion_kit/tags/marks", tags: @prompt.tags %>
+  </div>
+<% end %>
+
 <section>
   <div class="ck-prompt-preview__header">
     <p class="ck-kicker">Prompt</p>

data/app/views/completion_kit/provider_credentials/_form.html.erb

@@ -27,7 +27,7 @@
     </div>
 
     <div class="ck-actions">
-      <%= link_to "Cancel", provider_credentials_path, class: ck_button_classes(:light, variant: :outline) %>
+      <%= link_to "Cancel", provider_credentials_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(provider_credential.persisted? ? "Save provider" : "Create provider", class: ck_button_classes(:dark)) %>
     </div>
 

data/app/views/completion_kit/provider_credentials/index.html.erb

@@ -2,9 +2,11 @@
   <%= turbo_stream_from "completion_kit_provider_#{pc.id}" %>
 <% end %>
 
+<%= render "completion_kit/shared/settings_nav", section_label: "Providers" %>
+
 <section class="ck-page-header">
   <div>
-    <h1 class="ck-title">Settings</h1>
+    <h1 class="ck-title">Providers</h1>
     <p class="ck-lead">API keys for LLM providers. These are used for both generating prompt completions and running judge evaluations.</p>
   </div>
   <div class="ck-actions">

data/app/views/completion_kit/runs/_form.html.erb

@@ -115,9 +115,24 @@
           </div>
           <div class="ck-metric-divider"><span>or pick individually</span></div>
         <% end %>
-        <div class="ck-metric-checkboxes">
+
+        <% available_filter_tags = @all_metrics.flat_map(&:tags).uniq.sort_by(&:name) %>
+        <% if available_filter_tags.any? %>
+          <div class="ck-metric-tag-filter" data-metric-tag-filter>
+            <span class="ck-metric-tag-filter__label">Filter metrics by tag</span>
+            <% available_filter_tags.each do |tag| %>
+              <button type="button"
+                      class="tag-mark tag-mark--off ck-metric-tag-filter__chip"
+                      style="--mark-color: var(--tag-<%= tag.color %>);"
+                      data-filter-tag="<%= tag.name %>"
+                      onclick="ckToggleMetricGroupFilter(this)"><%= tag.name %></button>
+            <% end %>
+          </div>
+        <% end %>
+
+        <div class="ck-metric-checkboxes" data-metric-checkboxes>
           <% @all_metrics.each do |metric| %>
-            <label class="ck-checkbox-label">
+            <label class="ck-checkbox-label" data-metric-tags="<%= metric.tag_names.join(",") %>">
               <%= check_box_tag "run[metric_ids][]", metric.id, run.metric_ids.include?(metric.id), class: "ck-checkbox", id: "run_metric_#{metric.id}" %>
               <span class="ck-checkbox-label__box" aria-hidden="true"></span>
               <span class="ck-checkbox-label__body">
@@ -125,6 +140,11 @@
                 <% if metric.instruction.present? %>
                   <span class="ck-checkbox-label__hint"><%= truncate(metric.instruction.to_s, length: 90) %></span>
                 <% end %>
+                <% if metric.tags.any? %>
+                  <div class="tag-marks-row">
+                    <%= render "completion_kit/tags/marks", tags: metric.tags %>
+                  </div>
+                <% end %>
               </span>
             </label>
           <% end %>
@@ -248,8 +268,10 @@ document.querySelectorAll('input[name="run[metric_ids][]"]').forEach(function(cb
 updateRunForm();
     </script>
 
+    <%= render "completion_kit/tags/picker", record: run, param_namespace: :run %>
+
     <div class="ck-actions">
-      <%= link_to "Cancel", run.persisted? ? run_path(run) : runs_path, class: ck_button_classes(:light, variant: :outline) %>
+      <%= link_to "Cancel", run.persisted? ? run_path(run) : runs_path, class: ck_button_classes(:light, variant: :outline), tabindex: "0" %>
       <%= form.submit(run.persisted? ? "Save run" : "Create run", class: ck_button_classes(:dark), id: "run-submit") %>
     </div>
   </div>

data/app/views/completion_kit/runs/_row.html.erb

@@ -13,6 +13,11 @@
           <%= link_to run.dataset.name, dataset_path(run.dataset), class: "ck-runs-table__config-link", onclick: "event.stopPropagation();" %>
         <% end %>
       </div>
+      <% if run.tags.any? %>
+        <div class="tag-marks-row">
+          <%= render "completion_kit/tags/marks", tags: run.tags %>
+        </div>
+      <% end %>
     </div>
   </td>
   <td>

data/app/views/completion_kit/runs/index.html.erb

@@ -8,6 +8,11 @@
   </div>
 </section>
 
+<%= render "completion_kit/tags/filter_bar",
+      available: @available_tags,
+      selected: @selected_tags,
+      base_path: runs_path %>
+
 <% if @runs.any? %>
   <table class="ck-results-table ck-runs-table">
     <thead>
@@ -26,6 +31,10 @@
       <% end %>
     </tbody>
   </table>
+<% elsif @selected_tags.any? %>
+  <div class="ck-empty">
+    <p>No runs match these tags. <%= link_to "Clear filters", runs_path, class: "ck-link" %>.</p>
+  </div>
 <% else %>
   <div class="ck-empty">No runs yet.&ensp;<%= link_to "Create your first run →", new_run_path, class: "ck-link" %></div>
 <% end %>

data/app/views/completion_kit/runs/show.html.erb

@@ -7,6 +7,12 @@
 
 <%= render "status_header", run: @run %>
 
+<% if @run.tags.any? %>
+  <div class="tag-marks-row tag-marks-row--header">
+    <%= render "completion_kit/tags/marks", tags: @run.tags %>
+  </div>
+<% end %>
+
 <% if @run.dataset %>
   <% dataset_lines = @run.dataset.csv_data.to_s.lines %>
   <% dataset_preview_lines = dataset_lines.first(50) %>

data/app/views/completion_kit/shared/_settings_nav.html.erb

@@ -0,0 +1,9 @@
+<p class="ck-settings-kicker">
+  Settings <span class="ck-settings-kicker__sep">/</span>
+  <% link = local_assigns[:section_link] %>
+  <%= link ? link_to(section_label, link, class: "ck-settings-kicker__link") : section_label %>
+  <% if local_assigns[:trail].present? %>
+    <span class="ck-settings-kicker__sep">/</span>
+    <%= trail.html_safe %>
+  <% end %>
+</p>