aimeat 1.15.1 → 1.16.2

package/dist/public/views/profile/agents/tab-quality.js

@@ -0,0 +1,213 @@
+/**
+ * @file tab-quality.js
+ * @description Quality tab for the expanded agent view. Reads the recomputed
+ *   GET /v1/agents/:name/statistics rollups and renders three sections:
+ *   Performance (task counts, success rate, make-time, durations by context),
+ *   Reviews by context (per-context star ratings + sample size + low-confidence
+ *   flag), and Custom metrics (whatever the agent published under
+ *   agents.<name>.statistics.custom.*). Quality READS statistics + reviews — it
+ *   is the evaluative lens over the objective data.
+ * @structure default export TabQuality({ agentName })
+ * @usage rendered by agent-card.js renderTabContent() for the 'quality' tab
+ * @version-history
+ *   v1.1.0 -- 2026-05-31 -- Add "Rate deliverables" list: completed tasks the owner
+ *     can rate inline via the shared RateModal (unrated first); refreshes the
+ *     rollups on submit.
+ *   v1.0.0 -- 2026-05-31 -- Initial Quality tab (per-context reviews + performance + custom)
+ */
+
+import { h } from 'preact';
+import { useState, useEffect, useRef } from 'preact/hooks';
+import htm from 'htm';
+import { t } from '/js/i18n.js';
+import { getAgentStatistics, listTasks, rateTask } from '/js/services/agent-tasks.js';
+import RateModal from './rate-modal.js';
+
+const html = htm.bind(h);
+
+/** Glyph row for an average star value (rounded to nearest whole star). */
+function starGlyphs(value) {
+  const full = Math.max(0, Math.min(5, Math.round(value)));
+  return '★★★★★'.slice(0, full) + '☆☆☆☆☆'.slice(0, 5 - full);
+}
+
+/** Localised context label, falling back to the raw enum value. */
+function ctxLabel(ctx) {
+  const key = `profile.agents.detail.quality.contexts.${ctx}`;
+  const label = t(key);
+  return label !== key ? label : ctx;
+}
+
+function fmtSeconds(secs) {
+  return `${Number(secs || 0).toLocaleString()}${t('profile.agents.detail.quality.seconds')}`;
+}
+
+export default function TabQuality({ agentName, showToast }) {
+  const [data, setData] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [doneTasks, setDoneTasks] = useState([]);
+  const [rateTarget, setRateTarget] = useState(null); // task being rated, or null
+  const [sendingRate, setSendingRate] = useState(false);
+
+  async function loadData() {
+    setLoading(true);
+    try {
+      const [statsResp, tasksResp] = await Promise.all([
+        getAgentStatistics(agentName),
+        listTasks(agentName, { status: 'done', per_page: 100 }).catch(() => null),
+      ]);
+      setData(statsResp?.data || null);
+      setDoneTasks(tasksResp?.data?.tasks || []);
+    } catch { setData(null); }
+    setLoading(false);
+  }
+
+  async function handleSubmitRate(body) {
+    if (!rateTarget) return;
+    setSendingRate(true);
+    try {
+      await rateTask(agentName, rateTarget.id, body);
+      showToast?.(t('profile.agents.tasks.rate.success'));
+      setRateTarget(null);
+      await loadData();
+    } catch (err) {
+      showToast?.(err.message || t('profile.agents.tasks.rate.error'), true);
+    }
+    setSendingRate(false);
+  }
+
+  useEffect(() => { loadData(); }, [agentName]);
+
+  // Live updates: refresh when a rating lands or tasks change.
+  const loadRef = useRef(loadData);
+  loadRef.current = loadData;
+  useEffect(() => {
+    const handler = () => loadRef.current();
+    window.addEventListener('aimeat-live-update', handler);
+    return () => window.removeEventListener('aimeat-live-update', handler);
+  }, []);
+
+  if (loading) {
+    return html`<div class="pf-agd-empty">${t('profile.loading')}</div>`;
+  }
+
+  const perf = data?.performance || {};
+  const reviews = data?.reviews || {};
+  const custom = data?.custom || [];
+  const byContext = reviews.byContext || {};
+  const contextKeys = Object.keys(byContext);
+  const durByContext = perf.duration?.byContext || {};
+  const durKeys = Object.keys(durByContext);
+
+  return html`
+    <div class="pf-agd-quality">
+      <!-- Performance -->
+      <div class="pf-agd-section-title">${t('profile.agents.detail.quality.performanceTitle')}</div>
+      <div class="pf-agd-quality-desc">${t('profile.agents.detail.quality.performanceDesc')}</div>
+      <div class="pf-agd-stats-grid">
+        <div class="pf-agd-stat-card">
+          <div class="pf-agd-stat-value">${perf.tasks?.total ?? 0}</div>
+          <div class="pf-agd-stat-label">${t('profile.agents.detail.quality.tasksTotal')}</div>
+        </div>
+        <div class="pf-agd-stat-card">
+          <div class="pf-agd-stat-value">${perf.tasks?.completed ?? 0}</div>
+          <div class="pf-agd-stat-label">${t('profile.agents.detail.quality.tasksCompleted')}</div>
+        </div>
+        <div class="pf-agd-stat-card">
+          <div class="pf-agd-stat-value">${perf.tasks?.successRate != null ? `${Math.round(perf.tasks.successRate * 100)}%` : '-'}</div>
+          <div class="pf-agd-stat-label">${t('profile.agents.detail.quality.successRate')}</div>
+        </div>
+        <div class="pf-agd-stat-card">
+          <div class="pf-agd-stat-value">${fmtSeconds(perf.duration?.avgCompletionSeconds)}</div>
+          <div class="pf-agd-stat-label">${t('profile.agents.detail.quality.avgTime')}</div>
+        </div>
+        <div class="pf-agd-stat-card">
+          <div class="pf-agd-stat-value">${perf.events?.total ?? 0}</div>
+          <div class="pf-agd-stat-label">${t('profile.agents.detail.quality.events')}</div>
+        </div>
+      </div>
+      ${durKeys.length > 0 && html`
+        <div class="pf-agd-quality-durations">
+          ${durKeys.map(ctx => html`
+            <span key=${ctx} class="pf-agd-quality-dur-chip">
+              ${ctxLabel(ctx)}: ${fmtSeconds(durByContext[ctx].avgSeconds)} (${durByContext[ctx].count})
+            </span>
+          `)}
+        </div>
+      `}
+
+      <!-- Reviews by context -->
+      <div class="pf-agd-section-title">${t('profile.agents.detail.quality.reviewsTitle')}</div>
+      <div class="pf-agd-quality-desc">${t('profile.agents.detail.quality.reviewsDesc')}</div>
+      ${contextKeys.length === 0
+        ? html`<div class="pf-agd-empty">${t('profile.agents.detail.quality.noReviews')}</div>`
+        : html`
+          <div class="pf-agd-quality-reviews">
+            ${contextKeys.map(ctx => {
+              const s = byContext[ctx];
+              return html`
+                <div key=${ctx} class="pf-agd-quality-review-row">
+                  <div class="pf-agd-quality-review-head">
+                    <span class="pf-agd-quality-ctx">${ctxLabel(ctx)}</span>
+                    <span class="pf-agd-quality-stars">${starGlyphs(s.avgStars)}</span>
+                    <span class="pf-agd-quality-avg">${Number(s.avgStars).toFixed(1)}</span>
+                    <span class="pf-agd-quality-n">${t('profile.agents.detail.quality.ratings', { count: s.n })}</span>
+                    ${s.lowConfidence && html`<span class="pf-agd-quality-lowconf">${t('profile.agents.detail.quality.lowConfidence')}</span>`}
+                  </div>
+                  <div class="pf-agd-quality-review-meta">${t('profile.agents.detail.quality.grounded', { count: s.sourceGroundedN })}</div>
+                </div>
+              `;
+            })}
+            <div class="pf-agd-quality-overall">
+              ${t('profile.agents.detail.quality.overall')}: ${starGlyphs(reviews.overall?.avgStars || 0)} ${Number(reviews.overall?.avgStars || 0).toFixed(1)} (${t('profile.agents.detail.quality.ratings', { count: reviews.overall?.n || 0 })})
+            </div>
+          </div>
+        `}
+
+      <!-- Rate deliverables (completed tasks the owner can rate) -->
+      <div class="pf-agd-section-title">${t('profile.agents.detail.quality.pendingTitle')}</div>
+      <div class="pf-agd-quality-desc">${t('profile.agents.detail.quality.pendingDesc')}</div>
+      ${doneTasks.length === 0
+        ? html`<div class="pf-agd-empty">${t('profile.agents.detail.quality.allRated')}</div>`
+        : html`
+          <div class="pf-agd-quality-pending">
+            ${[...doneTasks].sort((a, b) => (a.rating ? 1 : 0) - (b.rating ? 1 : 0)).map(task => html`
+              <div key=${task.id} class="pf-agd-quality-pending-row">
+                <span class="pf-agd-quality-pending-title">${task.title || task.id}</span>
+                ${task.rating
+                  ? html`<span class="pf-agd-quality-pending-rated">${starGlyphs(task.rating.stars)} ${ctxLabel(task.rating.context)}</span>`
+                  : html`<span class="pf-agd-quality-pending-unrated">${t('profile.agents.detail.quality.unrated')}</span>`}
+                <button class="btn-outline btn-sm" onClick=${() => setRateTarget(task)}>
+                  ${task.rating ? t('profile.agents.tasks.rate.rerate') : t('profile.agents.tasks.rate.button')}
+                </button>
+              </div>
+            `)}
+          </div>
+        `}
+
+      <!-- Custom metrics -->
+      <div class="pf-agd-section-title">${t('profile.agents.detail.quality.customTitle')}</div>
+      <div class="pf-agd-quality-desc">${t('profile.agents.detail.quality.customDesc')}</div>
+      ${custom.length === 0
+        ? html`<div class="pf-agd-empty">${t('profile.agents.detail.quality.noCustom')}</div>`
+        : html`
+          <div class="pf-agd-quality-custom">
+            ${custom.map(c => html`
+              <div key=${c.key} class="pf-agd-quality-custom-row">
+                <span class="pf-agd-quality-custom-key">${c.key}</span>
+                <span class="pf-agd-quality-custom-val">${typeof c.value === 'object' ? JSON.stringify(c.value) : String(c.value)}</span>
+              </div>
+            `)}
+          </div>
+        `}
+
+      <${RateModal}
+        open=${!!rateTarget}
+        onClose=${() => setRateTarget(null)}
+        onSubmit=${handleSubmitRate}
+        submitting=${sendingRate}
+        existing=${rateTarget?.rating}
+      />
+    </div>
+  `;
+}

package/dist/public/views/profile/agents/tab-tasks.js

@@ -3,6 +3,8 @@
  * @description Tasks tab wrapper for agent detail tab-view.
  *   Delegates to the existing AgentTasksSubtab component.
  * @version-history
+ *   v1.1.0 -- 2026-06-01 -- Forward the `agent` object so the subtab can show the
+ *     max_concurrent_tasks runner config.
  *   v1.0.0 -- 2026-05-24 -- Initial creation for Agent Detail Tab-View
  */
 
@@ -12,6 +14,6 @@ import AgentTasksSubtab from '../agents-tasks-subtab.js';
 
 const html = htm.bind(h);
 
-export default function TabTasks({ agentName, session, showToast }) {
-  return html`<${AgentTasksSubtab} agentName=${agentName} session=${session} showToast=${showToast} />`;
+export default function TabTasks({ agent, agentName, session, showToast }) {
+  return html`<${AgentTasksSubtab} agent=${agent} agentName=${agentName} session=${session} showToast=${showToast} />`;
 }

package/dist/public/views/profile/agents-tasks-subtab.js

@@ -9,6 +9,17 @@
  *   - TaskItem -- task row with expand/collapse, todo list, start button
  *   - RequestChangesModal -- inline modal for owner to send a free-text change request
  * @version-history
+ *   v4.6.0 -- 2026-06-01 -- Add "max concurrent tasks" runner config (number input,
+ *     default 1) that PATCHes /v1/agents/:name/max-concurrent-tasks. Consumed by
+ *     the agent's runner (e.g. a CrewAI daemon) via the integration kit.
+ *   v4.5.0 -- 2026-05-31 -- Extract RateModal to shared ./agents/rate-modal.js
+ *     so the Quality tab can reuse it; no behaviour change here.
+ *   v4.4.0 -- 2026-05-31 -- Add owner "Rate deliverable" control on done tasks
+ *     (RateModal: stars + context + source-grounded + comment) wired to
+ *     POST /tasks/:id/rate; shows the current rating with a re-rate affordance.
+ *   v4.3.0 -- 2026-05-31 -- Add per-task "blur title" toggle in the collapsed
+ *     task row (eye icon). Hides a task title behind a CSS blur for screen
+ *     recordings; preference persists per task ID in localStorage (browser-only).
  *   v3.2.0 -- 2026-05-24 -- Add interactive filter pills, scope/rules display, migrate to pf-agd- CSS prefix
  *   v3.1.0 -- 2026-05-24 -- Fix: use correct locale key for empty state
  *   v3.0.0 -- 2026-05-22 -- Replace TaskCreateForm with TaskCreationBuilder (design spec split-panel)
@@ -38,11 +49,36 @@ const html = htm.bind(h);
 import { t } from '/js/i18n.js';
 import { timeAgo } from '/js/utils.js';
 import { apiGet, apiPost } from '/js/api.js';
-import { listTasks, deleteTask, startTask, listEvents, requestChanges, createTask } from '/js/services/agent-tasks.js';
+import { listTasks, deleteTask, startTask, listEvents, requestChanges, createTask, rateTask } from '/js/services/agent-tasks.js';
+import { setMaxConcurrentTasks } from '/js/services/agents.js';
 import { useConfirm, Modal } from '/components/Modal.js';
+import RateModal from './agents/rate-modal.js';
 
 const TASK_FILTERS = ['all', 'active', 'queued', 'completed', 'failed'];
 
+// Per-browser "blur the title" preference. Used when screen-recording the tab
+// so sensitive task titles can be hidden without affecting other viewers or
+// the server. Stored as an array of task IDs in localStorage; survives reloads
+// but never leaves this browser.
+const BLUR_STORAGE_KEY = 'aimeat.blurredTaskTitles';
+
+function readBlurredSet() {
+  try {
+    const parsed = JSON.parse(localStorage.getItem(BLUR_STORAGE_KEY));
+    return new Set(Array.isArray(parsed) ? parsed : []);
+  } catch { return new Set(); }
+}
+
+function isTaskBlurred(taskId) {
+  return readBlurredSet().has(taskId);
+}
+
+function setTaskBlurred(taskId, blurred) {
+  const set = readBlurredSet();
+  if (blurred) set.add(taskId); else set.delete(taskId);
+  try { localStorage.setItem(BLUR_STORAGE_KEY, JSON.stringify([...set])); } catch { /* storage full/blocked -- preference just won't persist */ }
+}
+
 // Character limits -- keep in sync with AgentTaskCreateSchema in
 // src/models/agent-task-schemas.ts (title max 256, description max 10000).
 // The agent crew reads task.description as its prompt, so that is the field
@@ -183,11 +219,23 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
   const [starting, setStarting] = useState(false);
   const [showRevisionModal, setShowRevisionModal] = useState(false);
   const [sendingRevision, setSendingRevision] = useState(false);
+  const [showRateModal, setShowRateModal] = useState(false);
+  const [sendingRate, setSendingRate] = useState(false);
   const [showOutdated, setShowOutdated] = useState(false);
   // Deliverable preview: null = not requested, {loading}|{notFound}|{value}.
   const [deliverable, setDeliverable] = useState(null);
+  // Local-only "hide the title" toggle (for screen recordings). Persisted per
+  // task ID in localStorage; see helpers at top of file.
+  const [blurred, setBlurred] = useState(() => isTaskBlurred(task.id));
   const { confirm, ConfirmUI } = useConfirm();
 
+  function handleToggleBlur(e) {
+    e.stopPropagation();
+    const next = !blurred;
+    setBlurred(next);
+    setTaskBlurred(task.id, next);
+  }
+
   // Fetch the task's published deliverable from the agent's memory namespace.
   // Uses the owner list endpoint (?agent=<gaii>&prefix=<key>) which returns the
   // value inline; if the exact key is gone, show that it no longer exists.
@@ -299,6 +347,24 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
     setShowRevisionModal(true);
   }
 
+  function handleOpenRate(e) {
+    e.stopPropagation();
+    setShowRateModal(true);
+  }
+
+  async function handleSubmitRate(body) {
+    setSendingRate(true);
+    try {
+      await rateTask(agentName, task.id, body);
+      showToast(t('profile.agents.tasks.rate.success'));
+      setShowRateModal(false);
+      onRefresh();
+    } catch (err) {
+      showToast(err.message || t('profile.agents.tasks.rate.error'), true);
+    }
+    setSendingRate(false);
+  }
+
   async function handleSubmitRevision(message) {
     setSendingRevision(true);
     try {
@@ -321,6 +387,8 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
   const isQueued = task.status === 'queued' || task.status === 'draft';
   const isRevisionRequested = task.status === 'revision_requested';
   const isActive = task.status === 'active';
+  const isDone = task.status === 'done';
+  const rating = task.rating;
   const canStart = isQueued && hasTodos;
   const canRequestChanges = task.status === 'queued' && hasTodos;
   const totalMinutes = todos.reduce((sum, td) => sum + (td.estimateMinutes || 0), 0);
@@ -338,7 +406,13 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
     <div>
       <div class="pf-agd-task-item" onClick=${handleExpand}>
         <div class="pf-agd-task-title-row">
-          <span class="pf-agd-task-title">${task.title || task.id}</span>
+          <button
+            class=${`pf-agd-blur-toggle ${blurred ? 'pf-agd-blur-toggle--on' : ''}`}
+            onClick=${handleToggleBlur}
+            title=${blurred ? t('profile.agents.tasks.unblurTitle') : t('profile.agents.tasks.blurTitle')}
+            aria-pressed=${blurred}
+          >${blurred ? '🙈' : '👁'}</button>
+          <span class=${`pf-agd-task-title ${blurred ? 'pf-agd-task-title--blurred' : ''}`}>${task.title || task.id}</span>
           ${progress && html`<span class="pf-agd-todo-progress">${progress}</span>`}
         </div>
         <div class="pf-agd-task-meta">
@@ -367,6 +441,21 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
             `}
           `}
 
+          ${isDone && html`
+            <div class="pf-agd-rate-row">
+              ${rating
+                ? html`
+                  <span class="pf-agd-rate-current">
+                    <span class="pf-agd-rate-current-stars">${'★★★★★'.slice(0, rating.stars)}${'☆☆☆☆☆'.slice(0, 5 - rating.stars)}</span>
+                    <span class="pf-agd-rate-current-ctx">${t(`profile.agents.detail.quality.contexts.${rating.context}`)}</span>
+                    ${rating.comment && html`<span class="pf-agd-rate-current-comment">${rating.comment}</span>`}
+                  </span>
+                  <button class="btn-ghost btn-sm" onClick=${handleOpenRate}>${t('profile.agents.tasks.rate.rerate')}</button>
+                `
+                : html`<button class="btn-outline btn-sm" onClick=${handleOpenRate}>${t('profile.agents.tasks.rate.button')}</button>`}
+            </div>
+          `}
+
           ${task.scope && html`
             <div class="pf-agd-info-row">
               <span class="pf-agd-info-label">${t('profile.agents.detail.tasks.scope')}</span>
@@ -497,17 +586,42 @@ function TaskItem({ task, agentName, showToast, onRefresh }) {
             onSubmit=${handleSubmitRevision}
             submitting=${sendingRevision}
           />
+          <${RateModal}
+            open=${showRateModal}
+            onClose=${() => setShowRateModal(false)}
+            onSubmit=${handleSubmitRate}
+            submitting=${sendingRate}
+            existing=${rating}
+          />
         </div>
       `}
     </div>
   `;
 }
 
-export default function AgentTasksSubtab({ agentName, showToast }) {
+export default function AgentTasksSubtab({ agent, agentName, showToast }) {
   const [tasks, setTasks] = useState(null);
   const [showCreate, setShowCreate] = useState(false);
   const [error, setError] = useState(null);
   const [filter, setFilter] = useState('all');
+  // Runner concurrency config (default 1 = serial). Saved to the agent via PATCH.
+  const [maxConcurrent, setMaxConcurrent] = useState(agent?.max_concurrent_tasks ?? 1);
+  const [savingConcurrency, setSavingConcurrency] = useState(false);
+
+  async function handleSaveConcurrency(next) {
+    const n = Math.max(1, Math.min(20, parseInt(next, 10) || 1));
+    setMaxConcurrent(n);
+    if (n === (agent?.max_concurrent_tasks ?? 1)) return;
+    setSavingConcurrency(true);
+    try {
+      await setMaxConcurrentTasks(agentName, n);
+      if (agent) agent.max_concurrent_tasks = n;
+      showToast?.(t('profile.agents.tasks.concurrency.saved'));
+    } catch (err) {
+      showToast?.(err.message || t('profile.agents.tasks.concurrency.error'), true);
+    }
+    setSavingConcurrency(false);
+  }
 
   async function loadTasks() {
     try {
@@ -563,6 +677,23 @@ export default function AgentTasksSubtab({ agentName, showToast }) {
         </button>
       </div>
 
+      <div class="pf-agd-concurrency">
+        <label class="pf-agd-concurrency-label" for="pf-agd-mct-${agentName}">
+          ${t('profile.agents.tasks.concurrency.label')}
+        </label>
+        <input
+          id="pf-agd-mct-${agentName}"
+          class="pf-agd-concurrency-input"
+          type="number"
+          min="1"
+          max="20"
+          value=${maxConcurrent}
+          disabled=${savingConcurrency}
+          onChange=${e => handleSaveConcurrency(e.target.value)}
+        />
+        <span class="pf-agd-concurrency-hint">${t('profile.agents.tasks.concurrency.hint')}</span>
+      </div>
+
       ${showCreate && html`
         <${TaskCreateForm} agentName=${agentName} showToast=${showToast} onCreated=${handleCreated} onCancel=${() => setShowCreate(false)} />
       `}