completion-kit 0.1.0.rc1

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

@@ -0,0 +1,72 @@
+<%= form_with(model: metric, local: true) do |form| %>
+  <% if metric.errors.any? %>
+    <div class="ck-flash ck-flash--alert">
+      <p class="ck-flash__title"><%= pluralize(metric.errors.count, "problem") %> prevented this metric from being saved.</p>
+      <ul class="ck-error-list">
+        <% metric.errors.full_messages.each do |message| %>
+          <li><%= message %></li>
+        <% end %>
+      </ul>
+    </div>
+  <% end %>
+
+  <div class="ck-card ck-form-card">
+    <div class="ck-field">
+      <%= form.label :name, "Metric name", class: "ck-label" %>
+      <%= form.text_field :name, class: "ck-input", placeholder: "Helpfulness" %>
+    </div>
+
+    <div class="ck-field ck-field--spacious">
+      <p class="ck-section-title">Evaluation Instruction</p>
+      <p class="ck-hint">What should the evaluator assess? This is the core instruction sent to the judge model.</p>
+      <%= form.text_area :instruction, rows: 8, class: "ck-input ck-input--area", placeholder: "Evaluate whether the output..." %>
+    </div>
+
+    <div class="ck-field ck-field--spacious" data-controller="evaluation-steps">
+      <p class="ck-section-title">Evaluation Steps</p>
+      <p class="ck-hint">Steps the evaluator follows during assessment.</p>
+
+      <div data-evaluation-steps-target="list">
+        <% Array(metric.evaluation_steps).each_with_index do |step, index| %>
+          <div class="ck-step-row" data-evaluation-steps-target="row">
+            <input type="text" name="metric[evaluation_steps][]" value="<%= step %>" class="ck-input" />
+            <button type="button" class="ck-icon-btn" data-action="evaluation-steps#remove" aria-label="Remove step">
+              <%= heroicon_tag "trash", variant: :outline, size: 16 %>
+            </button>
+          </div>
+        <% end %>
+      </div>
+
+      <button type="button" class="ck-add-btn" data-action="evaluation-steps#add">
+        <%= heroicon_tag "plus", variant: :outline, size: 14 %>
+        Add step
+      </button>
+    </div>
+
+    <div class="ck-field ck-field--spacious">
+      <p class="ck-section-title">Rubric</p>
+      <p class="ck-hint">What each star rating means for this metric.</p>
+
+      <div class="ck-rubric-builder">
+        <% metric.rubric_bands_for_form.each_with_index do |band, index| %>
+          <div class="ck-rubric-row">
+            <div class="ck-rubric-row__stars">
+              <% 5.times do |i| %>
+                <svg viewBox="0 0 24 24" width="14" height="14" stroke-width="1.75" class="ck-star <%= i < band["stars"] ? "ck-star--filled" : "ck-star--empty" %>"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+              <% end %>
+              <input type="hidden" name="metric[rubric_bands][<%= index %>][stars]" value="<%= band["stars"] %>">
+            </div>
+            <div class="ck-rubric-row__fields">
+              <textarea name="metric[rubric_bands][<%= index %>][description]" rows="2" class="ck-input ck-input--area"><%= band["description"] %></textarea>
+            </div>
+          </div>
+        <% end %>
+      </div>
+    </div>
+
+    <div class="ck-actions">
+      <%= link_to "Cancel", metrics_path, class: ck_button_classes(:light, variant: :outline) %>
+      <%= form.submit(metric.persisted? ? "Save metric" : "Create metric", class: ck_button_classes(:dark)) %>
+    </div>
+  </div>
+<% end %>

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

@@ -0,0 +1,13 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Metrics", metrics_path %></li>
+  <li><%= link_to @metric.name, metric_path(@metric) %></li>
+  <li>Edit</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Edit metric</h1>
+  </div>
+</section>
+
+<%= render "form", metric: @metric %>

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

@@ -0,0 +1,34 @@
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Metrics</h1>
+    <p class="ck-lead">Scoring dimensions used by the judge model to evaluate responses. Each metric defines what to assess, the evaluation steps, and a rubric for star ratings. Group metrics into <%= link_to "Criteria", criteria_path, class: "ck-link" %> for reuse across runs.</p>
+  </div>
+  <div class="ck-actions">
+    <%= link_to "New metric", new_metric_path, class: ck_button_classes(:dark) %>
+  </div>
+</section>
+
+<% if @metrics.any? %>
+  <table class="ck-results-table">
+    <thead>
+      <tr>
+        <th>Name</th>
+        <th>Instruction</th>
+        <th>Criteria</th>
+        <th></th>
+      </tr>
+    </thead>
+    <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: 80).presence || "None" %></td>
+          <td class="ck-meta-copy"><%= metric.criterias.any? ? metric.criterias.map { |c| link_to(c.name, criterion_path(c), class: "ck-link", onclick: "event.stopPropagation()") }.join(", ").html_safe : "None" %></td>
+          <td class="ck-results-table__arrow">&rarr;</td>
+        </tr>
+      <% end %>
+    </tbody>
+  </table>
+<% else %>
+  <div class="ck-empty">No metrics yet.</div>
+<% end %>

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

@@ -0,0 +1,12 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Metrics", metrics_path %></li>
+  <li>New</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">New metric</h1>
+  </div>
+</section>
+
+<%= render "form", metric: @metric %>

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

@@ -0,0 +1,49 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Metrics", metrics_path %></li>
+  <li><%= @metric.name %></li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title"><%= @metric.name %></h1>
+  </div>
+  <div class="ck-actions">
+    <%= link_to "Edit", edit_metric_path(@metric), class: ck_button_classes(:light, variant: :outline) %>
+  </div>
+</section>
+
+<% if @metric.instruction.present? %>
+<section class="ck-card">
+  <p class="ck-kicker">Evaluation Instruction</p>
+  <div class="ck-note-box"><%= simple_format(@metric.instruction) %></div>
+</section>
+<% end %>
+
+<% if @metric.evaluation_steps.present? && @metric.evaluation_steps.any? %>
+<section class="ck-card">
+  <p class="ck-kicker">Evaluation Steps</p>
+  <ol class="ck-step-list">
+    <% @metric.evaluation_steps.each do |step| %>
+      <li><%= step %></li>
+    <% end %>
+  </ol>
+</section>
+<% end %>
+
+<section class="ck-card ck-card--spaced">
+  <p class="ck-kicker">Rubric</p>
+  <div class="ck-rubric-display">
+    <% @metric.rubric_bands_for_form.each do |band| %>
+      <div class="ck-rubric-row ck-rubric-row--display">
+        <div class="ck-rubric-row__stars">
+          <% 5.times do |i| %>
+            <svg viewBox="0 0 24 24" width="14" height="14" stroke-width="1.75" class="ck-star <%= i < band["stars"] ? "ck-star--filled" : "ck-star--empty" %>"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
+          <% end %>
+        </div>
+        <div class="ck-rubric-row__fields">
+          <p class="ck-copy"><%= band["description"] %></p>
+        </div>
+      </div>
+    <% end %>
+  </div>
+</section>

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

@@ -0,0 +1,52 @@
+<%= form_with(model: prompt, local: true) do |form| %>
+  <% if prompt.errors.any? %>
+    <div class="ck-flash ck-flash--alert">
+      <p class="ck-flash__title"><%= pluralize(prompt.errors.count, "problem") %> prevented this prompt from being saved.</p>
+      <ul class="ck-error-list">
+        <% prompt.errors.full_messages.each do |message| %>
+          <li><%= message %></li>
+        <% end %>
+      </ul>
+    </div>
+  <% end %>
+
+  <div class="ck-card ck-form-card">
+    <div class="ck-field">
+      <%= form.label :name, "Name", class: "ck-label" %>
+      <%= form.text_field :name, class: "ck-input", placeholder: "Support summary", autocomplete: "off", data: { "1p-ignore": "" } %>
+    </div>
+
+    <div class="ck-field">
+      <%= form.label :description, class: "ck-label" %>
+      <%= form.text_area :description, rows: 3, class: "ck-input ck-input--area", placeholder: "Short note about this prompt." %>
+    </div>
+
+    <div class="ck-field">
+      <%= form.label :template, "Prompt text", class: "ck-label" %>
+      <%= form.text_area :template, rows: 12, class: "ck-input ck-input--area ck-input--code", placeholder: "Summarize {{content}} for {{audience}}" %>
+      <p class="ck-hint">Use <code>{{variable}}</code>. Match your dataset column names.</p>
+    </div>
+
+    <div class="ck-field">
+      <%= form.label :llm_model, "Generation model", class: "ck-label" %>
+      <% available = CompletionKit::ApiConfig.available_models(scope: :generation) %>
+      <% if available.any? %>
+        <div class="ck-select-with-action">
+          <%= form.select :llm_model, ck_grouped_models(available, prompt.llm_model), {}, { class: "ck-input", id: "prompt_llm_model" } %>
+          <button type="button" class="ck-icon-btn" title="Refresh models" onclick="ckRefreshModels()"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" width="16" height="16"><path fill-rule="evenodd" d="M13.836 2.477a.75.75 0 0 1 .75.75v3.182a.75.75 0 0 1-.75.75h-3.182a.75.75 0 0 1 0-1.5h1.37l-.84-.841a4.5 4.5 0 0 0-7.08.681.75.75 0 0 1-1.264-.808 6 6 0 0 1 9.44-.908l.84.84V3.227a.75.75 0 0 1 .75-.75Zm-.911 7.5A.75.75 0 0 1 13.199 11a6 6 0 0 1-9.44.908l-.84-.84v1.68a.75.75 0 0 1-1.5 0V9.567a.75.75 0 0 1 .75-.75h3.182a.75.75 0 0 1 0 1.5h-1.37l.84.841a4.5 4.5 0 0 0 7.08-.681.75.75 0 0 1 1.024-.274Z" clip-rule="evenodd"/></svg></button>
+        </div>
+      <% else %>
+        <p class="ck-meta-copy">No models available. <%= link_to "Add a provider", provider_credentials_path, class: "ck-link" %> or click refresh after configuring a provider.</p>
+      <% end %>
+      <% CompletionKit::ProviderCredential.find_each do |pc| %>
+        <%= turbo_stream_from "completion_kit_provider_#{pc.id}" %>
+      <% end %>
+      <p class="ck-field-hint" id="refresh-status" style="min-height: 1.2em; margin-top: -0.25rem; font-size: 0.75rem;">&nbsp;</p>
+    </div>
+
+    <div class="ck-actions">
+      <%= link_to "Cancel", prompts_path, class: ck_button_classes(:light, variant: :outline) %>
+      <%= form.submit(prompt.persisted? ? "Save prompt" : "Create prompt", class: ck_button_classes(:dark)) %>
+    </div>
+  </div>
+<% end %>

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

@@ -0,0 +1,13 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Prompts", prompts_path %></li>
+  <li><%= link_to @prompt.name, prompt_path(@prompt) %></li>
+  <li>Edit</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Edit prompt</h1>
+  </div>
+</section>
+
+<%= render "form", prompt: @prompt %>

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

@@ -0,0 +1,46 @@
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Prompts</h1>
+    <p class="ck-lead">Prompts sent to LLMs for completion. Each prompt is versioned so you can track changes and compare results over time.</p>
+  </div>
+  <div class="ck-actions">
+    <%= link_to "New prompt", new_prompt_path, class: ck_button_classes(:dark) %>
+  </div>
+</section>
+
+<% if @prompts.any? %>
+  <table class="ck-results-table">
+    <thead>
+      <tr>
+        <th>Name</th>
+        <th>Model</th>
+        <th>Runs</th>
+        <th>Last run</th>
+        <th></th>
+      </tr>
+    </thead>
+    <tbody>
+      <% @prompts.each do |prompt| %>
+        <tr onclick="window.location='<%= prompt_path(prompt) %>'" style="cursor: pointer;">
+          <td><strong><%= prompt.name %></strong> <span class="ck-chip ck-chip--soft"><%= prompt.version_label %></span></td>
+          <td><span class="ck-chip"><%= prompt.llm_model %></span></td>
+          <% family_runs = CompletionKit::Run.where(prompt_id: prompt.family_versions.select(:id)) %>
+          <td><%= family_runs.count %></td>
+          <td>
+            <% last_run = family_runs.order(created_at: :desc).first %>
+            <% if last_run %>
+              <%= time_ago_in_words(last_run.created_at) %> ago
+            <% else %>
+              Never
+            <% end %>
+          </td>
+          <td class="ck-results-table__arrow">&rarr;</td>
+        </tr>
+      <% end %>
+    </tbody>
+  </table>
+<% else %>
+  <div class="ck-empty">
+    No prompts yet. Create one to get started.
+  </div>
+<% end %>

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

@@ -0,0 +1,12 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Prompts", prompts_path %></li>
+  <li>New</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">New prompt</h1>
+  </div>
+</section>
+
+<%= render "form", prompt: @prompt %>

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

@@ -0,0 +1,156 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Prompts", prompts_path %></li>
+  <li><%= @prompt.name %></li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <div class="ck-inline">
+      <h1 class="ck-title"><%= @prompt.name %></h1>
+      <span class="ck-chip"><%= @prompt.llm_model %></span>
+    </div>
+    <% if @prompt.description.present? %>
+      <p class="ck-meta-copy"><%= @prompt.description %></p>
+    <% end %>
+    <div class="ck-endpoint">
+      <code class="ck-endpoint__url" id="prompt_endpoint"><%= request.base_url %><%= api_v1_prompt_path(@prompt.slug) %></code>
+      <button type="button" class="ck-icon-btn" title="Copy endpoint" onclick="navigator.clipboard.writeText(document.getElementById('prompt_endpoint').textContent)"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" width="14" height="14"><path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z"/><path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"/></svg></button>
+    </div>
+  </div>
+
+  <div class="ck-actions">
+    <% current = @prompt.family_versions.find_by(current: true) || @prompt %>
+    <%= link_to "Edit", edit_prompt_path(current), class: ck_button_classes(:light, variant: :outline) %>
+    <%= link_to "Run test", new_run_path(prompt_id: current.id), class: ck_button_classes(:dark) %>
+  </div>
+</section>
+
+<section>
+  <div class="ck-prompt-preview__header">
+    <p class="ck-kicker">Prompt</p>
+    <% judged_run = @runs.select { |r| r.prompt_id == @prompt.id && r.status == "completed" }.find { |r| r.responses.joins(:reviews).exists? } %>
+    <% if judged_run %>
+      <%= button_to "Suggest improvements", suggest_run_path(judged_run), method: :post, class: ck_button_classes(:light, variant: :outline) + " ck-button--sm", form_class: "inline-block" %>
+    <% else %>
+      <p class="ck-hint"><%= link_to "Run a test with judging configured", new_run_path(prompt_id: @prompt.id), class: "ck-link" %> to get AI-suggested improvements.</p>
+    <% end %>
+  </div>
+  <pre class="ck-code ck-code--dark"><%= @prompt.template %></pre>
+</section>
+
+<% versions = @prompt.family_versions %>
+<% if versions.size > 1 %>
+  <section class="ck-card--spaced">
+    <p class="ck-kicker">Versions</p>
+    <table class="ck-results-table" style="margin-top: 0.5rem;">
+      <thead>
+        <tr>
+          <th>Version</th>
+          <th>Model</th>
+          <th>Created</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <% versions.each do |v| %>
+          <tr>
+            <td><strong>v<%= v.version_number %></strong></td>
+            <td><span class="ck-chip ck-chip--soft"><%= v.llm_model %></span></td>
+            <td class="ck-meta-copy"><%= time_ago_in_words(v.created_at) %> ago</td>
+            <td>
+              <% if v.current? %>
+                <span class="ck-chip">Current</span>
+              <% else %>
+                <%= button_to "Publish", publish_prompt_path(v), method: :post, class: "ck-chip ck-chip--publish", form_class: "inline-block" %>
+              <% end %>
+            </td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </section>
+<% end %>
+
+<% if @runs.any? %>
+  <section class="ck-card--spaced">
+    <p class="ck-kicker">Runs</p>
+
+    <table class="ck-results-table" style="margin-top: 0.5rem;">
+      <thead>
+        <tr>
+          <th>Run</th>
+          <th>Version</th>
+          <th>Responses</th>
+          <th>Avg score</th>
+          <th>Metrics</th>
+          <th>When</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <% @runs.each do |run| %>
+          <tr onclick="window.location='<%= run_path(run) %>'" style="cursor: pointer;">
+            <td><span class="ck-run-name"><span class="<%= ck_run_dot(run) %>"></span><strong><%= run.name %></strong></span></td>
+            <td><span class="ck-chip ck-chip--soft">v<%= run.prompt.version_number %></span></td>
+            <td><%= run.responses.size %></td>
+            <td>
+              <% avg = run.avg_score %>
+              <% if avg %>
+                <span class="<%= ck_badge_classes(ck_score_kind(avg)) %>"><%= avg %></span>
+              <% else %>
+                &mdash;
+              <% end %>
+            </td>
+            <td>
+              <% metrics = run.metric_averages %>
+              <% if metrics.any? %>
+                <div class="ck-metric-bar ck-metric-bar--compact">
+                  <% metrics.each do |m| %>
+                    <span class="ck-metric-pip ck-metric-pip--<%= ck_score_kind(m[:avg]) %>">
+                      <span class="ck-metric-pip__bar"></span>
+                      <span class="ck-metric-pip__label"><%= m[:name] %> <strong><%= m[:avg] %></strong></span>
+                    </span>
+                  <% end %>
+                </div>
+              <% else %>
+                &mdash;
+              <% end %>
+            </td>
+            <td class="ck-meta-copy"><%= time_ago_in_words(run.created_at) %> ago</td>
+            <td class="ck-results-table__arrow">&rarr;</td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </section>
+<% end %>
+
+<% suggestions = CompletionKit::Suggestion.where(prompt_id: @prompt.family_versions.select(:id)).order(created_at: :desc) %>
+<% if suggestions.any? %>
+  <section class="ck-card--spaced">
+    <p class="ck-kicker">Suggestions</p>
+    <table class="ck-results-table" style="margin-top: 0.5rem;">
+      <thead>
+        <tr>
+          <th>Run</th>
+          <th>Reasoning</th>
+          <th>Applied</th>
+          <th>When</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <% suggestions.each do |s| %>
+          <tr onclick="window.location='<%= suggestion_run_path(s.run) %>'" style="cursor: pointer;">
+            <td><strong><%= s.run.name %></strong></td>
+            <td class="ck-meta-copy"><%= truncate(s.reasoning.to_s, length: 100) %></td>
+            <td><%= s.applied_at? ? content_tag(:span, "Applied", class: "ck-chip", style: "background: var(--ck-success-soft); color: var(--ck-success);") : "&mdash;".html_safe %></td>
+            <td class="ck-meta-copy"><%= time_ago_in_words(s.created_at) %> ago</td>
+            <td class="ck-results-table__arrow">&rarr;</td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </section>
+<% end %>
+

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

@@ -0,0 +1,30 @@
+<div id="discovery_status_<%= provider_credential.id %>">
+  <% if provider_credential.discovery_status == "discovering" %>
+    <div class="ck-discovery-bar">
+      <div class="ck-discovery-bar__label">
+        <% if provider_credential.discovery_total > 0 %>
+          Testing models&hellip; <%= provider_credential.discovery_current %>/<%= provider_credential.discovery_total %>
+        <% else %>
+          Fetching model list&hellip;
+        <% end %>
+      </div>
+      <% if provider_credential.discovery_total > 0 %>
+        <div class="ck-discovery-bar__track">
+          <div class="ck-discovery-bar__fill" style="width: <%= (provider_credential.discovery_current.to_f / provider_credential.discovery_total * 100).round %>%"></div>
+        </div>
+      <% else %>
+        <div class="ck-discovery-bar__track">
+          <div class="ck-discovery-bar__fill ck-discovery-bar__fill--indeterminate"></div>
+        </div>
+      <% end %>
+    </div>
+  <% elsif provider_credential.discovery_status == "failed" %>
+    <div class="ck-discovery-bar ck-discovery-bar--failed">
+      <div class="ck-discovery-bar__label">Model discovery failed</div>
+    </div>
+  <% elsif provider_credential.discovery_status == "completed" && local_assigns.fetch(:show_completed, true) %>
+    <div class="ck-discovery-bar ck-discovery-bar--completed">
+      <div class="ck-discovery-bar__label">Available models list updated <%= time_ago_in_words(provider_credential.updated_at) %> ago</div>
+    </div>
+  <% end %>
+</div>

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

@@ -0,0 +1,71 @@
+<%= form_with(model: provider_credential, local: true) do |form| %>
+  <% if provider_credential.errors.any? %>
+    <div class="ck-flash ck-flash--alert">
+      <p class="ck-flash__title"><%= pluralize(provider_credential.errors.count, "problem") %> prevented this provider credential from being saved.</p>
+      <ul class="ck-error-list">
+        <% provider_credential.errors.full_messages.each do |message| %>
+          <li><%= message %></li>
+        <% end %>
+      </ul>
+    </div>
+  <% end %>
+
+  <div class="ck-card ck-form-card">
+    <div class="ck-field">
+      <%= form.label :provider, class: "ck-label" %>
+      <%= form.select :provider, CompletionKit::ProviderCredential::PROVIDERS.map { |p| [CompletionKit::ProviderCredential::PROVIDER_LABELS[p] || p.titleize, p] }, {}, { class: "ck-input" } %>
+    </div>
+
+    <div class="ck-field">
+      <%= form.label :api_key, "API key", class: "ck-label" %>
+      <%= form.text_area :api_key, rows: 3, class: "ck-input ck-input--area ck-input--code", placeholder: "Paste the provider API key" %>
+    </div>
+
+    <div class="ck-field">
+      <%= form.label :api_endpoint, "API endpoint", class: "ck-label" %>
+      <%= form.text_field :api_endpoint, class: "ck-input", placeholder: "Only needed for Ollama or custom OpenAI-compatible endpoints" %>
+    </div>
+
+    <div class="ck-actions">
+      <%= link_to "Cancel", provider_credentials_path, class: ck_button_classes(:light, variant: :outline) %>
+      <%= form.submit(provider_credential.persisted? ? "Save provider" : "Create provider", class: ck_button_classes(:dark)) %>
+    </div>
+
+  </div>
+<% end %>
+
+<% if provider_credential.persisted? %>
+  <%= turbo_stream_from "completion_kit_provider_#{provider_credential.id}" %>
+
+  <% models = CompletionKit::Model.where(provider: provider_credential.provider).active.order(:model_id) %>
+  <% if models.any? || provider_credential.discovery_status.present? %>
+    <div class="ck-card ck-form-card__models">
+      <div class="ck-form-card__footer-header">
+        <%= render "discovery_status", provider_credential: provider_credential %>
+        <button type="button" class="ck-icon-btn" title="Refresh models" aria-label="Refresh available models" onclick="fetch('<%= refresh_provider_credential_path(provider_credential) %>', {method:'POST',headers:{'X-CSRF-Token':document.querySelector('meta[name=csrf-token]').content}})">
+          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" width="14" height="14" aria-hidden="true"><path fill-rule="evenodd" d="M13.836 2.477a.75.75 0 0 1 .75.75v3.182a.75.75 0 0 1-.75.75h-3.182a.75.75 0 0 1 0-1.5h1.37l-.84-.841a4.5 4.5 0 0 0-7.08.681.75.75 0 0 1-1.264-.808 6 6 0 0 1 9.44-.908l.84.84V3.227a.75.75 0 0 1 .75-.75Zm-.911 7.5A.75.75 0 0 1 13.199 11a6 6 0 0 1-9.44.908l-.84-.84v1.68a.75.75 0 0 1-1.5 0V9.567a.75.75 0 0 1 .75-.75h3.182a.75.75 0 0 1 0 1.5h-1.37l.84.841a4.5 4.5 0 0 0 7.08-.681.75.75 0 0 1 1.024-.274Z" clip-rule="evenodd"/></svg>
+        </button>
+      </div>
+
+      <% if models.any? %>
+        <details class="ck-model-list-details">
+          <summary class="ck-label" style="cursor: pointer; user-select: none;">Available models (<%= models.count %>)</summary>
+          <div class="ck-model-list">
+            <% models.each do |m| %>
+              <span class="ck-model-list__item">
+                <%= m.display_name || m.model_id %>
+                <% if m.supports_generation && m.supports_judging %>
+                  <span class="ck-model-list__badge">gen + judge</span>
+                <% elsif m.supports_generation %>
+                  <span class="ck-model-list__badge">gen</span>
+                <% elsif m.supports_judging %>
+                  <span class="ck-model-list__badge">judge</span>
+                <% end %>
+              </span>
+            <% end %>
+          </div>
+        </details>
+      <% end %>
+    </div>
+  <% end %>
+<% end %>

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

@@ -0,0 +1,12 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Settings", provider_credentials_path %></li>
+  <li>Edit</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Edit provider</h1>
+  </div>
+</section>
+
+<%= render "form", provider_credential: @provider_credential %>

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

@@ -0,0 +1,41 @@
+<% @provider_credentials.each do |pc| %>
+  <%= turbo_stream_from "completion_kit_provider_#{pc.id}" %>
+<% end %>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">Settings</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">
+    <%= link_to "New provider", new_provider_credential_path, class: ck_button_classes(:dark) %>
+  </div>
+</section>
+
+<% if @provider_credentials.any? %>
+  <% default_endpoints = {"openai" => "https://api.openai.com", "anthropic" => "https://api.anthropic.com"} %>
+  <div class="ck-provider-list">
+    <% @provider_credentials.each do |provider_credential| %>
+      <% masked_key = provider_credential.api_key.present? ? "#{provider_credential.api_key[0..6]}#{'•' * 12}#{provider_credential.api_key[-4..]}" : "—" %>
+      <a href="<%= edit_provider_credential_path(provider_credential) %>" class="ck-provider-card">
+        <div class="ck-provider-card__header">
+          <span class="ck-provider-card__name"><%= provider_credential.display_provider %></span>
+          <span class="ck-provider-card__key"><%= masked_key %></span>
+        </div>
+
+        <div class="ck-provider-card__meta">
+          <span><%= provider_credential.api_endpoint.presence || default_endpoints[provider_credential.provider] %></span>
+          <span><%= provider_credential.prompt_count %> prompts</span>
+          <span><%= provider_credential.judge_count %> judges</span>
+          <span><%= provider_credential.last_used_at ? "Used #{time_ago_in_words(provider_credential.last_used_at)} ago" : "Never used" %></span>
+        </div>
+
+        <%= render "discovery_status", provider_credential: provider_credential %>
+      </a>
+    <% end %>
+  </div>
+<% else %>
+  <div class="ck-empty">
+    No providers yet. Add one to start running prompts.
+  </div>
+<% end %>

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

@@ -0,0 +1,12 @@
+<ol class="ck-breadcrumb">
+  <li><%= link_to "Settings", provider_credentials_path %></li>
+  <li>New</li>
+</ol>
+
+<section class="ck-page-header">
+  <div>
+    <h1 class="ck-title">New provider</h1>
+  </div>
+</section>
+
+<%= render "form", provider_credential: @provider_credential %>