@circuitwall/jarela 2.2.0 → 2.3.0

package/components/chat/useThreadData.ts

@@ -1,8 +1,8 @@
 "use client";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { api } from "@/api/client";
-import type { Message, SummaryTopicSegment } from "@/api/types";
-import { applyThreadMeta, type SystemNotice, type ThreadMetaApplier } from "./chat-helpers";
+import type { Message, SummaryTopicSegment, WarmChannelSummary } from "@/api/types";
+import { applyThreadMeta, type ThreadMetaApplier } from "./chat-helpers";
 
 interface Params {
   threadId: string | null;
@@ -13,9 +13,6 @@ export interface ThreadDataApi {
   messages: Message[];
   setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
   messagesRef: React.MutableRefObject<Message[]>;
-  notices: SystemNotice[];
-  setNotices: React.Dispatch<React.SetStateAction<SystemNotice[]>>;
-  addNotice: (text: string) => void;
   hasMore: boolean;
   setHasMore: React.Dispatch<React.SetStateAction<boolean>>;
   loadingMore: boolean;
@@ -30,8 +27,10 @@ export interface ThreadDataApi {
   warmSummarySourceMessages: number | null;
   warmSummarySourceChars: number | null;
   warmSummaryTopics: SummaryTopicSegment[] | null;
+  warmChannelSummaries: WarmChannelSummary[];
   warmSummaryPending: boolean;
   compactionPending: boolean;
+  manualCompactionPending: boolean;
   contextWindowTokens: number | null;
   metaApplier: ThreadMetaApplier;
   loadOlder: () => Promise<void>;
@@ -40,7 +39,6 @@ export interface ThreadDataApi {
 
 export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
   const [messages, setMessages] = useState<Message[]>([]);
-  const [notices, setNotices] = useState<SystemNotice[]>([]);
   const [hasMore, setHasMore] = useState(false);
   const [loadingMore, setLoadingMore] = useState(false);
   const [messagesLoading, setMessagesLoading] = useState(false);
@@ -54,8 +52,10 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
   const [warmSummarySourceMessages, setWarmSummarySourceMessages] = useState<number | null>(null);
   const [warmSummarySourceChars, setWarmSummarySourceChars] = useState<number | null>(null);
   const [warmSummaryTopics, setWarmSummaryTopics] = useState<SummaryTopicSegment[] | null>(null);
+  const [warmChannelSummaries, setWarmChannelSummaries] = useState<WarmChannelSummary[]>([]);
   const [warmSummaryPending, setWarmSummaryPending] = useState(false);
   const [compactionPending, setCompactionPending] = useState(false);
+  const [manualCompactionPending, setManualCompactionPending] = useState(false);
   const [contextWindowTokens, setContextWindowTokens] = useState<number | null>(null);
 
   const messagesRef = useRef<Message[]>([]);
@@ -66,18 +66,13 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
     setHotSince, setHotSinceSeq, setWarmSummary, setWarmSummaryBefore, setWarmSummaryBeforeSeq,
     setWarmSummaryComputedAt, setWarmSummarySourceMessages,
     setWarmSummarySourceChars, setContextWindowTokens, setWarmSummaryPending,
-    setCompactionPending, setWarmSummaryTopics,
+    setCompactionPending, setManualCompactionPending, setWarmSummaryTopics, setWarmChannelSummaries,
   };
 
-  const addNotice = useCallback((text: string) => {
-    setNotices((p) => [...p, { id: `notice-${Date.now()}`, text }]);
-  }, []);
-
   useEffect(() => {
     if (!threadId) {
       setMetadataThreadId(null);
       setMessages([]);
-      setNotices([]);
       setHasMore(false);
       setMessagesLoading(false);
       setHotSince(null);
@@ -89,8 +84,10 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
       setWarmSummarySourceMessages(null);
       setWarmSummarySourceChars(null);
       setWarmSummaryTopics(null);
+      setWarmChannelSummaries([]);
       setWarmSummaryPending(false);
       setCompactionPending(false);
+      setManualCompactionPending(false);
       setContextWindowTokens(null);
       return;
     }
@@ -108,8 +105,10 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
     setWarmSummarySourceMessages(null);
     setWarmSummarySourceChars(null);
     setWarmSummaryTopics(null);
+    setWarmChannelSummaries([]);
     setWarmSummaryPending(false);
     setCompactionPending(false);
+    setManualCompactionPending(false);
     setContextWindowTokens(null);
     api.threads.get(threadId).then((d) => {
       if (cancelled) return;
@@ -150,6 +149,7 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
       setWarmSummarySourceMessages(updated.warm_summary_source_messages);
       setWarmSummarySourceChars(updated.warm_summary_source_chars);
       setWarmSummaryTopics(updated.warm_summary_topics);
+      setWarmChannelSummaries(updated.warm_channel_summaries ?? []);
       setCompactionPending(updated.pending_hot_since_seq != null);
       const summaryFresh = updated.hot_since_seq != null
         && updated.warm_summary_before_seq === updated.hot_since_seq;
@@ -167,7 +167,7 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
     if (!threadId) return;
     const summaryFresh = hotSinceSeq !== null && warmSummaryBeforeSeq === hotSinceSeq;
     const summaryStale = warmSummaryPending && hotSinceSeq !== null && !summaryFresh;
-    if (!summaryStale && !compactionPending) {
+    if (!summaryStale && !compactionPending && !manualCompactionPending) {
       if (warmSummaryPending && hotSinceSeq !== null && summaryFresh) setWarmSummaryPending(false);
       return;
     }
@@ -190,7 +190,7 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
       window.clearInterval(timer);
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [threadId, warmSummaryPending, compactionPending, hotSince, hotSinceSeq, warmSummaryBefore, warmSummaryBeforeSeq]);
+  }, [threadId, warmSummaryPending, compactionPending, manualCompactionPending, hotSince, hotSinceSeq, warmSummaryBefore, warmSummaryBeforeSeq]);
 
   const loadOlder = useCallback(async () => {
     if (!threadId || loadingMore || !hasMore || messages.length === 0) return;
@@ -211,13 +211,13 @@ export function useThreadData({ threadId, attach }: Params): ThreadDataApi {
   }, [threadId, loadingMore, hasMore, messages.length]);
 
   return {
-    messages, setMessages, messagesRef, notices, setNotices, addNotice,
+    messages, setMessages, messagesRef,
     hasMore, setHasMore, loadingMore, messagesLoading,
     hotSince: metadataMatchesThread ? hotSince : null,
     hotSinceSeq: metadataMatchesThread ? hotSinceSeq : null,
     hotSinceSeqForRun: metadataMatchesThread ? hotSinceSeq : undefined,
     warmSummary, warmSummaryBefore, warmSummaryBeforeSeq, warmSummaryComputedAt,
-    warmSummarySourceMessages, warmSummarySourceChars, warmSummaryTopics, warmSummaryPending, compactionPending, contextWindowTokens,
+    warmSummarySourceMessages, warmSummarySourceChars, warmSummaryTopics, warmChannelSummaries, warmSummaryPending, compactionPending, manualCompactionPending, contextWindowTokens,
     metaApplier, loadOlder, setContextPin,
   };
 }

package/components/chat/workflow-step-retry.ts

@@ -0,0 +1,25 @@
+import { createContext, useContext } from "react";
+
+export interface WorkflowStepRetryRequest {
+  workflowId: string;
+  itemId: string;
+  label: string;
+}
+
+/** Sends a retry request for one workflow step; null when the surface cannot send messages. */
+export const WorkflowStepRetryContext = createContext<((request: WorkflowStepRetryRequest) => void) | null>(null);
+
+export function useWorkflowStepRetry() {
+  return useContext(WorkflowStepRetryContext);
+}
+
+export function workflowStepRetryMessage({ workflowId, itemId, label }: WorkflowStepRetryRequest): string {
+  const progressUpdate = workflowId === "version_adoption"
+    ? `Call \`workflow_progress\` with \`workflow_id: "version_adoption"\`, \`item_id: "${itemId}"\`, and \`status: "checking"\``
+    : `Call \`workflow_progress\` for workflow \`${workflowId}\` with the complete items snapshot, setting this step to \`checking\``;
+  return [
+    `Retry workflow step "${label}" (item \`${itemId}\`) in workflow \`${workflowId}\`.`,
+    `${progressUpdate}, then redo the step from its stated input and run its validation again.`,
+    "Finally mark it `done` with newly observed `validation_evidence`, or `needs_attention` with the reason. Leave the other steps unchanged.",
+  ].join(" ");
+}

package/components/models/ModelEditor.tsx

@@ -9,7 +9,7 @@ import { ModelEditorBody, ModelEditorOverlays } from "./model-editor/ModelEditor
 
 interface Props {
   model?: ModelConfig;
-  onSave: (name: string, data: Omit<ModelConfig, "name" | "created_at" | "updated_at">) => Promise<void>;
+  onSave: (name: string, data: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">) => Promise<void>;
   onClose: () => void;
 }
 

package/components/models/ModelsPanel.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { ArrowUpRight, Cpu, Plus, Star, Trash2 } from "lucide-react";
+import { ArrowUpRight, Cpu, Plus, Power, PowerOff, Star, Trash2 } from "lucide-react";
 import { HeaderAction, PanelHeader } from "@/components/ui/PanelHeader";
 import { useEffect, useRef, useState } from "react";
 import type { ModelConfig } from "@/api/types";
@@ -37,7 +37,7 @@ interface EnvEntry {
 }
 
 export function ModelsPanel() {
-  const { models, assignments, loading, create, update, remove, refresh } = useModels();
+  const { models, assignments, loading, create, update, setDefault, setEnabled, remove, refresh } = useModels();
   const { agents, loading: agentsLoading } = useAgents();
   const strategyOverrides = agents.filter((agent) => agent.usage_strategy != null);
   const [editing, setEditing] = useState<ModelConfig | null | "new">(null);
@@ -93,14 +93,28 @@ export function ModelsPanel() {
     return () => { cancelled = true; };
   }, []);
 
-  async function handleSave(name: string, data: Omit<ModelConfig, "name" | "created_at" | "updated_at">) {
+  async function handleSave(name: string, data: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">) {
     if (editing === "new") await create(name, data);
     else if (editing) await update(name, data);
     refresh();
   }
 
   async function handleSetDefault(m: ModelConfig) {
-    await update(m.name, { provider: m.provider, model_id: m.model_id, params: m.params, is_default: true });
+    setDeleteError(null);
+    try {
+      await setDefault(m.name);
+    } catch (e) {
+      setDeleteError(`Could not set "${m.name}" as default: ${errorMessage(e)}`);
+    }
+  }
+
+  async function handleToggleEnabled(m: ModelConfig) {
+    setDeleteError(null);
+    try {
+      await setEnabled(m.name, !m.enabled);
+    } catch (e) {
+      setDeleteError(`Could not ${m.enabled ? "disable" : "enable"} "${m.name}": ${errorMessage(e)}`);
+    }
   }
 
   async function handleRemove(name: string) {
@@ -283,14 +297,17 @@ export function ModelsPanel() {
           {models.map((m) => {
             const inUse = assignments.some((a) => a.model_config_name === m.name);
             return (
-            <div key={m.name} data-deep-link-id={m.name} onClick={() => setEditing(m)} className="flex items-center gap-3 py-2.5 border-b border-border/60 group cursor-pointer hover:bg-surface-3/30 transition-colors">
+            <div key={m.name} data-deep-link-id={m.name} onClick={() => setEditing(m)} className={`flex items-center gap-3 py-2.5 border-b border-border/60 group cursor-pointer hover:bg-surface-3/30 transition-colors ${m.enabled ? "" : "opacity-60"}`}>
               <span className="shrink-0 text-fg-subtle">
                 <ProviderLogo name={m.provider} size={22} />
               </span>
               <div className="flex-1 min-w-0">
                 <div className="flex items-center gap-2 mb-0.5">
-                  <span className="text-sm font-medium text-fg">{m.name}</span>
+                  <span className={`text-sm font-medium ${m.enabled ? "text-fg" : "text-fg-subtle line-through"}`}>{m.name}</span>
                   {m.is_default && <Star size={11} className="text-yellow-700 dark:text-yellow-400 fill-yellow-400 shrink-0" />}
+                  {!m.enabled && (
+                    <span className="text-xs px-1.5 py-0.5 rounded border bg-surface-2 text-fg-muted border-border">disabled</span>
+                  )}
                   <span className={`text-xs px-1.5 py-0.5 rounded border ${PROVIDER_COLORS[m.provider] ?? "bg-surface-2 text-fg-muted border-border"}`}>
                     {m.provider}
                   </span>
@@ -301,11 +318,20 @@ export function ModelsPanel() {
                 </div>
               </div>
               <div className="flex gap-1 opacity-40 group-hover:opacity-100 pointer-coarse:opacity-100 transition-opacity shrink-0">
-                {!m.is_default && (
-                  <button onClick={(e) => { e.stopPropagation(); handleSetDefault(m); }} className="p-1 text-fg-subtle hover:text-yellow-700 dark:hover:text-yellow-400 transition-colors" title="Set as default">
+                {!m.is_default && m.enabled && (
+                  <button onClick={(e) => { e.stopPropagation(); void handleSetDefault(m); }} className="p-1 text-fg-subtle hover:text-yellow-700 dark:hover:text-yellow-400 transition-colors" title="Set as default">
                     <Star size={13} />
                   </button>
                 )}
+                <button
+                  onClick={(e) => { e.stopPropagation(); void handleToggleEnabled(m); }}
+                  className="p-1 text-fg-subtle hover:text-fg transition-colors"
+                  title={m.enabled ? "Disable; hide from model selection" : "Enable; show in model selection"}
+                  aria-label={m.enabled ? `Disable ${m.name}` : `Enable ${m.name}`}
+                  aria-pressed={!m.enabled}
+                >
+                  {m.enabled ? <Power size={13} /> : <PowerOff size={13} />}
+                </button>
                 <button
                   onClick={(e) => { e.stopPropagation(); handleRemove(m.name); }}
                   className="p-1 text-fg-subtle hover:text-red-700 dark:hover:text-red-400 transition-colors"

package/components/models/model-editor/GitHubCopilotAuth.tsx

@@ -27,7 +27,7 @@ function AuthHeader({ status, polling, onSignIn, onSignOut }: HeaderProps) {
       <div className="text-fg-muted">
         <strong>GitHub Copilot sign-in</strong>
         <p className="text-fg-faint mt-0.5">
-          Unlocks full model context windows (vs. the 8k cap on raw PATs via GitHub Models).
+          Required for Copilot models; GitHub PAT authentication is no longer supported.
         </p>
       </div>
       {status?.signed_in ? (

package/components/models/model-editor/save-helpers.ts

@@ -33,7 +33,7 @@ export function buildPayload(form: ModelEditorForm) {
 
 export async function runProbeStep(
   form: ModelEditorForm,
-  payload: Omit<ModelConfig, "name" | "created_at" | "updated_at">,
+  payload: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">,
 ): Promise<boolean> {
   const probe = await api.models
     .probe(form.provider, payload.model_id, payload.params as Record<string, unknown>, undefined, form.credentialId ?? undefined)
@@ -50,7 +50,7 @@ export async function runProbeStep(
 
 export function shouldStageShrinkConfirm(
   form: ModelEditorForm,
-  result: { name: string; payload: Omit<ModelConfig, "name" | "created_at" | "updated_at"> },
+  result: { name: string; payload: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at"> },
 ): boolean {
   if (!form.model) return false;
   const oldCtx = Number(form.model.params.context_window_tokens) || 0;

package/components/models/model-editor/useModelEditorForm.ts

@@ -9,7 +9,7 @@ export type ShrinkPending =
   | {
       oldSnapshot: { provider: string; model_id: string; params: Record<string, unknown> };
       payloadName: string;
-      payload: Omit<ModelConfig, "name" | "created_at" | "updated_at">;
+      payload: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">;
     };
 
 export type ProbeResult = { ok: boolean; error?: string } | null;

package/components/models/model-editor/useModelSaveHandlers.ts

@@ -12,7 +12,7 @@ import {
 
 interface Args {
   form: ModelEditorForm;
-  onSave: (name: string, data: Omit<ModelConfig, "name" | "created_at" | "updated_at">) => Promise<void>;
+  onSave: (name: string, data: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">) => Promise<void>;
   onClose: () => void;
 }
 

package/components/setup/wizard/StepCredentials.tsx

@@ -200,7 +200,7 @@ export function StepCredentials({ definitions, integrations, onChanged }: StepCr
       icon={<KeyRound size={18} />}
       eyebrow="Step 2 · Credentials"
       title="Connect provider credentials in the UI first"
-      description="Use the built-in credential forms as the main setup path. They work for Claude, GPT, Gemini, Copilot, and other providers without depending on your shell environment."
+      description="Use the built-in credential forms as the main setup path for Claude, GPT, Gemini, and other providers. GitHub Copilot uses device-flow sign-in in the Models panel."
     >
       <div className="rounded-xl border border-accent/30 bg-accent/5 px-3 py-2.5 text-xs text-fg">
         <p className="font-medium">Recommended path</p>

package/components/setup/wizard/StepModel.tsx

@@ -21,7 +21,7 @@ export function StepModel({ models, onChanged }: StepModelProps) {
 
   async function handleSave(
     name: string,
-    data: Omit<ModelConfig, "name" | "created_at" | "updated_at">,
+    data: Omit<ModelConfig, "name" | "enabled" | "created_at" | "updated_at">,
   ) {
     setError(null);
     try {
@@ -35,12 +35,7 @@ export function StepModel({ models, onChanged }: StepModelProps) {
 
   async function handleSetDefault(m: ModelConfig) {
     try {
-      await api.models.update(m.name, {
-        provider: m.provider,
-        model_id: m.model_id,
-        params: m.params,
-        is_default: true,
-      });
+      await api.models.patch(m.name, { is_default: true });
       onChanged();
     } catch (e) {
       setError(errorMessage(e));
@@ -114,7 +109,7 @@ export function StepModel({ models, onChanged }: StepModelProps) {
                 <p className="truncate text-[11px] text-fg-faint">{m.model_id}</p>
               </div>
               <div className="flex shrink-0 items-center gap-0.5">
-                {!m.is_default && (
+                {!m.is_default && m.enabled !== false && (
                   <button
                     type="button"
                     onClick={(e) => { e.stopPropagation(); handleSetDefault(m); }}

package/components/ui/BootScreen.tsx

@@ -344,6 +344,20 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
     }
   }
 
+  async function handleAdoptionItemRetry(itemId: string) {
+    if (adoptionBusy || adoption?.status === "running") return;
+    setAdoptionBusy("retry");
+    try {
+      const next = await api.lifecycle.adoption.retryItem(itemId);
+      setAdoption(next);
+      adoptionRunStartedRef.current = null;
+    } catch {
+      setAdoption((prev) => prev ? { ...prev, error: "Could not retry that step." } : prev);
+    } finally {
+      setAdoptionBusy(null);
+    }
+  }
+
   // The agent rendered in the centered tile. During `loading` and
   // `pick` it's the default (so the user sees the same artwork as soon
   // as agents resolve). During `opening` it's whatever was picked.
@@ -539,6 +553,9 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
               summary={adoptionLiveLabel ?? adoption.summary}
               items={adoption.checklist}
               error={adoption.error}
+              onRetryItem={(item) => void handleAdoptionItemRetry(item.id)}
+              canRetryItem={(item) => item.id !== "fetch-changes"}
+              retryDisabled={adoptionBusy !== null || adoption.status === "running"}
             >
                 {adoption.status === "done" && (
                   <p className="mt-2 rounded-lg border border-border/50 bg-surface px-2 py-1 text-[10px] leading-snug text-fg-muted">

package/components/ui/WorkflowChecklist.tsx

@@ -1,4 +1,4 @@
-import { AlertTriangle, Check, LoaderCircle, Minus } from "lucide-react";
+import { AlertTriangle, Check, LoaderCircle, Minus, RotateCcw } from "lucide-react";
 import type { ReactNode } from "react";
 
 export type WorkflowChecklistStatus = "pending" | "checking" | "done" | "needs_attention" | "skipped";
@@ -12,6 +12,8 @@ export interface WorkflowChecklistItemView {
   output?: string;
   validation?: string;
   validation_evidence?: string;
+  /** Times this step has been started; shown when greater than one. */
+  attempts?: number;
 }
 
 interface Props {
@@ -22,9 +24,25 @@ interface Props {
   items: WorkflowChecklistItemView[];
   error?: string | null;
   compact?: boolean;
+  /** Retries a single finished or failed step; omitted hides the per-step retry button. */
+  onRetryItem?: (item: WorkflowChecklistItemView) => void;
+  canRetryItem?: (item: WorkflowChecklistItemView) => boolean;
+  retryDisabled?: boolean;
   children?: ReactNode;
 }
 
+const RETRYABLE_STATUSES: ReadonlySet<WorkflowChecklistStatus> = new Set(["done", "needs_attention", "skipped"]);
+
+export function isWorkflowItemRetryable(item: WorkflowChecklistItemView): boolean {
+  return RETRYABLE_STATUSES.has(item.status);
+}
+
+function statusLabel(status: WorkflowChecklistStatus): string {
+  if (status === "done") return "verified";
+  if (status === "needs_attention") return "needs attention";
+  return status;
+}
+
 function StatusIcon({ status }: { status: WorkflowChecklistStatus }) {
   if (status === "done") return <Check className="h-3 w-3" aria-hidden />;
   if (status === "checking") return <LoaderCircle className="h-3 w-3 animate-spin" aria-hidden />;
@@ -41,12 +59,19 @@ function statusClass(status: WorkflowChecklistStatus): string {
   return "border-border/60 bg-surface text-fg-faint";
 }
 
-export function WorkflowChecklist({ eyebrow, title, phaseLabel, summary, items, error, compact = false, children }: Props) {
+function itemTooltip(item: WorkflowChecklistItemView): string {
+  const note = item.status === "done" ? item.validation_evidence : item.reason;
+  return note ? `${item.label}\n${statusLabel(item.status)}: ${note}` : item.label;
+}
+
+export function WorkflowChecklist({ eyebrow, title, phaseLabel, summary, items, error, compact = false, onRetryItem, canRetryItem, retryDisabled = false, children }: Props) {
   return (
     <div className={compact ? "flex flex-col gap-1.5" : "absolute inset-x-0 top-0 flex flex-col gap-2 transition-opacity duration-300"}>
-      <p className="text-[10px] text-fg-faint uppercase tracking-wider text-center">
-        {eyebrow}
-      </p>
+      {!compact && (
+        <p className="text-[10px] text-fg-faint uppercase tracking-wider text-center">
+          {eyebrow}
+        </p>
+      )}
       <div className={compact
         ? "w-full rounded border border-border/40 bg-surface/60 px-2 py-1.5 text-left"
         : "w-full rounded-xl border border-border/60 bg-surface-2/70 px-3 py-2 text-left shadow-lg shadow-black/5"}>
@@ -56,39 +81,52 @@ export function WorkflowChecklist({ eyebrow, title, phaseLabel, summary, items,
             {phaseLabel}
           </span>
         </div>
-        <p className="mt-1 text-[11px] leading-snug text-fg-muted line-clamp-2">
-          {summary}
-        </p>
-        <div className={compact
-          ? "mt-1.5 flex max-h-32 flex-col gap-1 overflow-y-auto pr-1"
+        {!compact && summary && (
+          <p className="mt-1 text-[11px] leading-snug text-fg-muted line-clamp-2">
+            {summary}
+          </p>
+        )}
+        <ul className={compact
+          ? "mt-1.5 flex max-h-48 flex-col gap-0.5 overflow-y-auto pr-1"
           : "mt-2 flex max-h-32 flex-col gap-1 overflow-y-auto pr-1"}>
-          {items.map((item) => (
-            <div key={item.id} className={compact
-              ? "rounded border border-border/30 bg-surface-2/40 px-1.5 py-1 text-[10px] leading-tight text-fg-muted"
-              : "text-[10px] leading-tight text-fg-muted"}>
-              <div className="flex items-start gap-1.5">
+          {items.map((item) => {
+            const retryable = !!onRetryItem && isWorkflowItemRetryable(item) && (canRetryItem ? canRetryItem(item) : true);
+            return (
+              <li key={item.id} className="group flex items-center gap-1.5 text-[10px] leading-tight text-fg-muted">
                 <span
-                  aria-label={item.status}
-                  className={["mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded border", statusClass(item.status)].join(" ")}
+                  role="img"
+                  aria-label={statusLabel(item.status)}
+                  className={["flex h-4 w-4 shrink-0 items-center justify-center rounded border", statusClass(item.status)].join(" ")}
                 >
                   <StatusIcon status={item.status} />
                 </span>
-                <span className={compact ? "min-w-0 flex-1 truncate" : "line-clamp-2"} title={item.label}>{item.label}</span>
-              </div>
-              {(item.input || item.output || item.validation || item.validation_evidence) && (
-                <details className="mt-1 pl-5">
-                  <summary className="cursor-pointer text-fg-faint">Step contract</summary>
-                  <dl className="mt-1 grid grid-cols-[auto_minmax(0,1fr)] gap-x-2 gap-y-1">
-                    {item.input && <><dt className="text-fg-faint">Input</dt><dd className="break-words">{item.input}</dd></>}
-                    {item.output && <><dt className="text-fg-faint">Output</dt><dd className="break-words">{item.output}</dd></>}
-                    {item.validation && <><dt className="text-fg-faint">Validation</dt><dd className="break-words">{item.validation}</dd></>}
-                    {item.validation_evidence && <><dt className="text-fg-faint">Evidence</dt><dd className="break-words">{item.validation_evidence}</dd></>}
-                  </dl>
-                </details>
-              )}
-            </div>
-          ))}
-        </div>
+                <span className={compact ? "min-w-0 flex-1 truncate" : "min-w-0 flex-1 line-clamp-2"} title={itemTooltip(item)}>
+                  {item.label}
+                </span>
+                {(item.attempts ?? 0) > 1 && (
+                  <span className="shrink-0 text-[9px] tabular-nums text-fg-faint" title={`Attempt ${item.attempts}`}>
+                    attempt {item.attempts}
+                  </span>
+                )}
+                {retryable && (
+                  <button
+                    type="button"
+                    onClick={() => onRetryItem(item)}
+                    disabled={retryDisabled}
+                    aria-label={`Retry ${item.label}`}
+                    title={`Retry ${item.label}`}
+                    className={[
+                      "flex h-4 w-4 shrink-0 items-center justify-center rounded text-fg-faint hover:bg-surface-3 hover:text-fg disabled:opacity-40",
+                      item.status === "needs_attention" ? "" : "opacity-0 focus:opacity-100 group-hover:opacity-100",
+                    ].join(" ")}
+                  >
+                    <RotateCcw className="h-3 w-3" aria-hidden />
+                  </button>
+                )}
+              </li>
+            );
+          })}
+        </ul>
         {error && (
           <p className="mt-2 text-[10px] leading-tight text-red-400">{error}</p>
         )}

package/hooks/useModels.ts

@@ -15,6 +15,8 @@ export function useModels(): UnifiedHookResult<
     refresh: () => Promise<void>;
     create: (name: string, data: ModelConfigIn) => Promise<ModelConfig>;
     update: (name: string, data: ModelConfigIn) => Promise<ModelConfig>;
+    setDefault: (name: string) => Promise<ModelConfig>;
+    setEnabled: (name: string, enabled: boolean) => Promise<ModelConfig>;
     remove: (name: string) => Promise<void>;
     assign: (agent_id: string, model_config_name: string, tool_policy?: ToolPolicy) => Promise<TaskAssignment>;
     unassign: (agent_id: string) => Promise<void>;
@@ -61,6 +63,18 @@ export function useModels(): UnifiedHookResult<
     return m;
   }, [refreshModels]);
 
+  const setDefault = useCallback(async (name: string) => {
+    const m = await api.models.patch(name, { is_default: true });
+    await refreshModels();
+    return m;
+  }, [refreshModels]);
+
+  const setEnabled = useCallback(async (name: string, enabled: boolean) => {
+    const m = await api.models.patch(name, { enabled });
+    await refreshModels();
+    return m;
+  }, [refreshModels]);
+
   const remove = useCallback(async (name: string): Promise<void> => {
     await api.models.delete(name);
     await refreshModels();
@@ -82,7 +96,7 @@ export function useModels(): UnifiedHookResult<
   }, [setAssignments]);
 
   const state = { models, assignments, loading, error };
-  const commands = { refresh, create, update, remove, assign, unassign };
+  const commands = { refresh, create, update, setDefault, setEnabled, remove, assign, unassign };
 
   return {
     state,
@@ -94,6 +108,8 @@ export function useModels(): UnifiedHookResult<
     refresh,
     create,
     update,
+    setDefault,
+    setEnabled,
     remove,
     assign,
     unassign,