repoburg 1.3.199 → 1.3.202

package/agent-pane/frontend/src/components/TurnContent.tsx

@@ -9,6 +9,7 @@ import type { Turn, Item, DiscussionThread, Attachment } from '../types/index.ts
 import { runtimeIcon } from '../types/index.ts';
 import CollapsibleToolCalls, { isToolItem } from './CollapsibleToolCalls.tsx';
 import CommentableText from './CommentableText.tsx';
+import AskUserItem from './AskUserItem.tsx';
 
 marked.setOptions({ breaks: true, gfm: true });
 
@@ -306,6 +307,10 @@ function ItemCard({ item, runtimeType, turn, threads }: { item: Item; runtimeTyp
       );
     }
 
+    case 'ask_user': {
+      return <AskUserItem item={item} turn={turn} />;
+    }
+
     case 'background_task': {
       const data = item.data || {};
       const taskType = (data.task_type as string) || 'unknown';
@@ -427,15 +432,35 @@ function TurnContentBase({ turn, runtimeType, threads = [] }: Props) {
   // Intermediate = everything before final agent_message (or ALL items if running)
   const intermediateItems = hasFinalResponse ? turn.items.slice(0, lastAgentIdx) : turn.items;
 
+  // Fallback final response — some runtime turns (repoburg final-action
+  // rounds) never produce an agent_message item; their final text lives on
+  // turn.agent_response instead. Synthesize the final card from it.
+  const responseFallback: Item | null =
+    !hasFinalResponse && turn.status === 'completed' && turn.agent_response
+      ? {
+          id: `response-${turn.id}`,
+          turn_id: turn.id,
+          external_item_id: `response-${turn.id}`,
+          type: 'agent_message',
+          data: { text: turn.agent_response },
+          status: 'completed',
+          created_at: turn.created_at,
+          updated_at: turn.updated_at,
+        }
+      : null;
+
   // Filter out empty reasoning items (text is "" — signed-empty thinking blocks from Claude SDK).
   // These inflate the intermediate step count and render as empty cards.
   const visibleIntermediate = intermediateItems.filter(
     (item) => !(item.type === 'reasoning' && (!item.data?.text || item.data.text === '')),
   );
 
-  // Filter main flow: remove background_task items (they belong in Tasks panel).
+  // Filter main flow: remove background_task items (they belong in Tasks panel)
+  // and ask_user items (always-visible section below — the answer flow must
+  // never hide behind the collapsed intermediate section).
   const mainIntermediate = visibleIntermediate.filter((item) => {
     if (item.type === 'background_task') return false;
+    if (item.type === 'ask_user') return false;
     return true;
   });
 
@@ -517,11 +542,32 @@ function TurnContentBase({ turn, runtimeType, threads = [] }: Props) {
         </div>
       )}
 
+      {/* background_task cards — always visible in the turn flow (live sub-agent
+          / monitor lifecycle), outside the collapsible intermediate section.
+          Rendered before the final answer to match the chronological flow
+          (task ran, then the agent responded). Mirrors the Tasks panel entries
+          but inline with the conversation. */}
+      {turn.items.filter((i) => i.type === 'background_task').map((item) => (
+        <MemoItemCard key={`task-${item.id}`} item={item} runtimeType={runtimeType} turn={turn} threads={threads} />
+      ))}
+
       {/* Final agent message — always visible */}
       {hasFinalResponse && <MemoItemCard key={turn.items[lastAgentIdx].id} item={turn.items[lastAgentIdx]} runtimeType={runtimeType} turn={turn} threads={threads} />}
 
-      {/* Items after final agent message (rare — errors, etc.) */}
-      {hasFinalResponse && turn.items.slice(lastAgentIdx + 1).map((item) => <MemoItemCard key={item.id} item={item} runtimeType={runtimeType} turn={turn} threads={threads} />)}
+      {/* Fallback final response (turn.agent_response with no agent_message item). */}
+      {responseFallback && (
+        <MemoItemCard key={responseFallback.id} item={responseFallback} runtimeType={runtimeType} turn={turn} threads={threads} />
+      )}
+
+      {/* Items after final agent message (rare — errors, etc.; ask_user and
+          background_task render in the dedicated always-visible sections below). */}
+      {hasFinalResponse && turn.items.slice(lastAgentIdx + 1).filter((i) => i.type !== 'ask_user' && i.type !== 'background_task').map((item) => <MemoItemCard key={item.id} item={item} runtimeType={runtimeType} turn={turn} threads={threads} />)}
+
+      {/* ask_user cards — always visible + interactive, outside the collapsible
+          intermediate section (works even for ask_user-only turns). */}
+      {turn.items.filter((i) => i.type === 'ask_user').map((item) => (
+        <MemoItemCard key={`ask-${item.id}`} item={item} runtimeType={runtimeType} turn={turn} threads={threads} />
+      ))}
 
       {/* Pending state (no items at all) */}
       {turn.items.length === 0 && !turn.error && (turn.status === 'pending' || turn.status === 'running') && (

package/agent-pane/frontend/src/components/panels/ThreadsPanel.tsx

@@ -98,7 +98,7 @@ function ThreadCard({
     setShowQuoteBtn(false);
   }, []);
 
-  const handleConversationMouseUp = useCallback(() => {
+  const checkSelection = useCallback(() => {
     const container = conversationRef.current;
     if (!container) return;
     const sel = window.getSelection();
@@ -128,13 +128,46 @@ function ThreadCard({
     const selRect = range.getBoundingClientRect();
     const BUTTON_HEIGHT = 28;
     const GAP = 6;
+    const BUTTON_WIDTH_EST = 170;
+
+    // Detect backward selection via anchor (press) vs focus (release) order.
+    let backward = false;
+    if (sel.anchorNode && sel.focusNode) {
+      try {
+        const fr = document.createRange();
+        fr.setStart(sel.focusNode, sel.focusOffset);
+        fr.setEnd(sel.focusNode, sel.focusOffset);
+        const ar = document.createRange();
+        ar.setStart(sel.anchorNode, sel.anchorOffset);
+        ar.setEnd(sel.anchorNode, sel.anchorOffset);
+        backward = ar.compareBoundaryPoints(Range.START_TO_START, fr) > 0;
+      } catch {
+        backward = false;
+      }
+    }
+
     let btnY = selRect.top - BUTTON_HEIGHT - GAP;
     if (btnY < 8) btnY = selRect.bottom + GAP;
-    setQuoteBtnPos({ x: selRect.right, y: btnY });
+    let btnX = backward ? selRect.left - BUTTON_WIDTH_EST : selRect.right;
+    btnX = Math.max(8, Math.min(btnX, window.innerWidth - BUTTON_WIDTH_EST - 8));
+    setQuoteBtnPos({ x: btnX, y: btnY });
     setSelectedText(text);
     setShowQuoteBtn(true);
   }, []);
 
+  // Detect selections on mouseup anywhere in the document so that releasing
+  // the mouse in the surrounding padding (common with backward drags) still
+  // registers the quote button.
+  useEffect(() => {
+    function onDocMouseUp(e: MouseEvent) {
+      const t = e.target as HTMLElement | null;
+      if (t && t.closest('.selection-actions')) return;
+      checkSelection();
+    }
+    document.addEventListener('mouseup', onDocMouseUp);
+    return () => document.removeEventListener('mouseup', onDocMouseUp);
+  }, [checkSelection]);
+
   const handleQuoteClick = useCallback(() => {
     const formatted = `\n\`\`\`QUOTE\n${selectedText}\n\`\`\`\n\n`;
     setFollowup((prev) => prev + formatted);
@@ -180,7 +213,6 @@ function ThreadCard({
             className="thread-card-conversation"
             ref={conversationRef}
             onMouseDown={handleConversationMouseDown}
-            onMouseUp={handleConversationMouseUp}
           >
             {threadTurns.map((turn) => (
               <ThreadTurnView key={turn.id} turn={turn} />

package/agent-pane/frontend/src/components/panels/TurnsPanel.test.tsx

@@ -80,4 +80,52 @@ describe('TurnsPanel', () => {
     fireEvent.click(screen.getByText('Branch from Here'));
     expect(branchFromTurn).toHaveBeenCalledWith('s1', 't1');
   });
+
+  it('shows Restore Rewind for rewound non-repoburg sessions', () => {
+    const detail = makeDetail('s1', [makeTurn('t1', 's1'), makeTurn('t2', 's1')], {
+      runtime_type: 'codex',
+      rewound_at_turn_id: 't1',
+    });
+    resetStore({ activeSessionId: 's1', sessionDetails: { s1: detail } });
+    render(<TurnsPanel />);
+    fireEvent.contextMenu(document.querySelector('.turn-item')!);
+    expect(screen.getByText('Restore Rewind')).toBeInTheDocument();
+  });
+
+  it('hides Restore Rewind for rewound repoburg sessions (hard delete — no restore)', () => {
+    const detail = makeDetail('s1', [makeTurn('t1', 's1'), makeTurn('t2', 's1')], {
+      runtime_type: 'repoburg',
+      rewound_at_turn_id: 't1',
+    });
+    resetStore({ activeSessionId: 's1', sessionDetails: { s1: detail } });
+    render(<TurnsPanel />);
+    fireEvent.contextMenu(document.querySelector('.turn-item')!);
+    expect(screen.queryByText('Restore Rewind')).not.toBeInTheDocument();
+  });
+
+  it('repoburg rewind confirm says the runtime history is permanently deleted', () => {
+    const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(false);
+    const rewindToTurn = vi.fn();
+    const detail = makeDetail('s1', [makeTurn('t1', 's1'), makeTurn('t2', 's1')], {
+      runtime_type: 'repoburg',
+    });
+    resetStore({ activeSessionId: 's1', sessionDetails: { s1: detail }, rewindToTurn });
+    render(<TurnsPanel />);
+    fireEvent.contextMenu(document.querySelectorAll('.turn-item')[0]);
+    fireEvent.click(screen.getByText('Rewind to Here'));
+    expect(confirmSpy).toHaveBeenCalledWith(
+      'Rewind to this turn? Runtime history after this point is PERMANENTLY deleted and cannot be restored.',
+    );
+    expect(rewindToTurn).not.toHaveBeenCalled();
+  });
+
+  it('non-repoburg rewind confirm keeps the restore-later copy', () => {
+    const confirmSpy = vi.spyOn(window, 'confirm').mockReturnValue(false);
+    const detail = makeDetail('s1', [makeTurn('t1', 's1'), makeTurn('t2', 's1')]);
+    resetStore({ activeSessionId: 's1', sessionDetails: { s1: detail } });
+    render(<TurnsPanel />);
+    fireEvent.contextMenu(document.querySelectorAll('.turn-item')[0]);
+    fireEvent.click(screen.getByText('Rewind to Here'));
+    expect(confirmSpy).toHaveBeenCalledWith('Rewind to this turn? Hidden turns can be restored later.');
+  });
 });

package/agent-pane/frontend/src/components/panels/TurnsPanel.tsx

@@ -26,6 +26,11 @@ export default function TurnsPanel() {
   const turns = detail?.turns ?? [];
   const isRunning = detail?.is_running === 1;
   const isRewound = !!detail?.rewound_at_turn_id;
+  // Repoburg rewind = platform-parity hard delete — no restore, permanent copy.
+  const isRepoburg = detail?.runtime_type === 'repoburg';
+  const rewindConfirm = isRepoburg
+    ? 'Rewind to this turn? Runtime history after this point is PERMANENTLY deleted and cannot be restored.'
+    : 'Rewind to this turn? Hidden turns can be restored later.';
 
   const [ctxMenu, setCtxMenu] = useState<TurnContextMenu | null>(null);
   const ctxRef = useRef<HTMLDivElement>(null);
@@ -91,7 +96,7 @@ export default function TurnsPanel() {
             className={`ctx-menu-item ${ctxMenu.isLast || isRunning || ctxMenu.isSlashCommand ? 'ctx-disabled' : ''}`}
             onClick={() => {
               if (ctxMenu.isLast || isRunning || ctxMenu.isSlashCommand) return;
-              if (window.confirm('Rewind to this turn? Hidden turns can be restored later.')) {
+              if (window.confirm(rewindConfirm)) {
                 rewindToTurn(activeSessionId!, ctxMenu.turnId);
               }
               setCtxMenu(null);
@@ -99,7 +104,7 @@ export default function TurnsPanel() {
           >
             <Rewind size={12} /> Rewind to Here{ctxMenu.isSlashCommand ? ' (slash command)' : ''}
           </div>
-          {isRewound && (
+          {isRewound && !isRepoburg && (
             <div
               className="ctx-menu-item"
               onClick={() => {

package/agent-pane/frontend/src/constants/models.ts

@@ -94,6 +94,43 @@ export const PROVIDERS: ProviderDef[] = [
       },
     ],
   },
+  {
+    id: 'repoburg',
+    label: 'Repoburg',
+    available: true,
+    // Curated fallback list — live sessions load the full catalog dynamically
+    // from GET /api/providers/repoburg/models (repoburg backend model registry).
+    models: [
+      {
+        slug: 'ollama/glm-5.3:cloud',
+        displayName: 'GLM-5.3',
+        description: 'Ollama Cloud',
+        defaultReasoning: 'medium',
+        reasoningLevels: [LEVELS.low, LEVELS.medium, LEVELS.high],
+      },
+      {
+        slug: 'ollama/glm-5.3-flash:cloud',
+        displayName: 'GLM-5.3 Flash',
+        description: 'Ollama Cloud — fast',
+        defaultReasoning: 'medium',
+        reasoningLevels: [LEVELS.low, LEVELS.medium, LEVELS.high],
+      },
+      {
+        slug: 'ollama/minimax-m3:cloud',
+        displayName: 'MiniMax M3',
+        description: 'Ollama Cloud',
+        defaultReasoning: 'medium',
+        reasoningLevels: [LEVELS.low, LEVELS.medium, LEVELS.high],
+      },
+      {
+        slug: 'ollama/deepseek-v4-pro:cloud',
+        displayName: 'DeepSeek V4 Pro',
+        description: 'Ollama Cloud',
+        defaultReasoning: 'medium',
+        reasoningLevels: [LEVELS.low, LEVELS.medium, LEVELS.high],
+      },
+    ],
+  },
 ];
 
 /** Get provider by ID. */

package/agent-pane/frontend/src/hooks/useResizable.test.ts

@@ -0,0 +1,97 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { renderHook, act } from '@testing-library/react';
+import { useResizable } from './useResizable.ts';
+
+/** Helper: simulate a native pointer event on window with a clientX.
+ *  jsdom doesn't implement PointerEvent; MouseEvent carries clientX which is
+ *  all the hook reads, so we use it as a stand-in. */
+function fireWindowPointer(type: 'pointermove' | 'pointerup', clientX: number): void {
+  window.dispatchEvent(new MouseEvent(type, { clientX, bubbles: true }));
+}
+
+/** Build a minimal React.PointerEvent-like object for onPointerDown. */
+function pointerDown(clientX: number) {
+  return {
+    clientX,
+    preventDefault: vi.fn(),
+    stopPropagation: vi.fn(),
+  } as unknown as React.PointerEvent;
+}
+
+describe('useResizable', () => {
+  beforeEach(() => {
+    document.body.classList.remove('is-resizing');
+  });
+
+  it('grows left-side width when dragging right (+delta)', () => {
+    const getWidth = vi.fn(() => 240);
+    const setWidth = vi.fn();
+    const { result } = renderHook(() =>
+      useResizable({ side: 'left', minWidth: 160, maxWidth: 480, getWidth, setWidth }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(pointerDown(100));
+    });
+    expect(result.current.dragging).toBe(true);
+    expect(document.body.classList.contains('is-resizing')).toBe(true);
+
+    act(() => fireWindowPointer('pointermove', 150)); // +50
+    expect(setWidth).toHaveBeenLastCalledWith(290);
+
+    act(() => fireWindowPointer('pointerup', 150));
+    expect(result.current.dragging).toBe(false);
+    expect(document.body.classList.contains('is-resizing')).toBe(false);
+  });
+
+  it('shrinks right-side width when dragging right (-delta)', () => {
+    const getWidth = vi.fn(() => 300);
+    const setWidth = vi.fn();
+    const { result } = renderHook(() =>
+      useResizable({ side: 'right', minWidth: 220, maxWidth: 600, getWidth, setWidth }),
+    );
+
+    act(() => {
+      result.current.onPointerDown(pointerDown(200));
+    });
+    act(() => fireWindowPointer('pointermove', 260)); // +60
+    expect(setWidth).toHaveBeenLastCalledWith(240);
+    act(() => fireWindowPointer('pointerup', 260));
+  });
+
+  it('clamps to maxWidth on left side', () => {
+    const getWidth = vi.fn(() => 460);
+    const setWidth = vi.fn();
+    const { result } = renderHook(() =>
+      useResizable({ side: 'left', minWidth: 160, maxWidth: 480, getWidth, setWidth }),
+    );
+    act(() => result.current.onPointerDown(pointerDown(0)));
+    act(() => fireWindowPointer('pointermove', 1000));
+    expect(setWidth).toHaveBeenLastCalledWith(480);
+    act(() => fireWindowPointer('pointerup', 1000));
+  });
+
+  it('clamps to minWidth on right side', () => {
+    const getWidth = vi.fn(() => 230);
+    const setWidth = vi.fn();
+    const { result } = renderHook(() =>
+      useResizable({ side: 'right', minWidth: 220, maxWidth: 600, getWidth, setWidth }),
+    );
+    act(() => result.current.onPointerDown(pointerDown(0)));
+    act(() => fireWindowPointer('pointermove', 5000)); // dragging far right shrinks right panel
+    expect(setWidth).toHaveBeenLastCalledWith(220);
+    act(() => fireWindowPointer('pointerup', 5000));
+  });
+
+  it('stops listening after pointerup', () => {
+    const getWidth = vi.fn(() => 240);
+    const setWidth = vi.fn();
+    const { result } = renderHook(() =>
+      useResizable({ side: 'left', minWidth: 160, maxWidth: 480, getWidth, setWidth }),
+    );
+    act(() => result.current.onPointerDown(pointerDown(0)));
+    act(() => fireWindowPointer('pointerup', 0));
+    act(() => fireWindowPointer('pointermove', 300));
+    expect(setWidth).not.toHaveBeenCalled();
+  });
+});

package/agent-pane/frontend/src/hooks/useResizable.ts

@@ -0,0 +1,75 @@
+import { useCallback, useRef, useState } from 'react';
+
+export type ResizeSide = 'left' | 'right';
+
+interface UseResizableOptions {
+  /** Which edge is being dragged: 'left' grows when dragging right, 'right' grows when dragging left. */
+  side: ResizeSide;
+  minWidth: number;
+  maxWidth: number;
+  /** Current width (px) — read live inside the pointer handlers via a ref. */
+  getWidth: () => number;
+  /** Commit a new width (already clamped by the hook). */
+  setWidth: (w: number) => void;
+}
+
+export interface UseResizableResult {
+  /** Attach to the drag handle element. */
+  onPointerDown: (e: React.PointerEvent) => void;
+  /** True while a drag for this handle is in progress. */
+  dragging: boolean;
+}
+
+/**
+ * Dependency-free horizontal resize handle. Returns a pointerdown handler to
+ * attach to a thin handle element; while dragging it updates the store width
+ * (clamped to [min, max]) on every pointermove and cleans up on pointerup.
+ *
+ * Uses window listeners so the drag continues even when the cursor leaves the
+ * handle (standard desktop-app behavior).
+ */
+export function useResizable({
+  side,
+  minWidth,
+  maxWidth,
+  getWidth,
+  setWidth,
+}: UseResizableOptions): UseResizableResult {
+  const [dragging, setDragging] = useState(false);
+  // Captured at drag start; the listeners close over these refs.
+  const startX = useRef(0);
+  const startWidth = useRef(0);
+
+  const onPointerMove = useCallback(
+    (e: PointerEvent) => {
+      const delta = e.clientX - startX.current;
+      const next = side === 'left' ? startWidth.current + delta : startWidth.current - delta;
+      const clamped = Math.min(maxWidth, Math.max(minWidth, next));
+      setWidth(clamped);
+    },
+    [side, minWidth, maxWidth, setWidth],
+  );
+
+  const onPointerUp = useCallback(() => {
+    window.removeEventListener('pointermove', onPointerMove);
+    window.removeEventListener('pointerup', onPointerUp);
+    document.body.classList.remove('is-resizing');
+    setDragging(false);
+  }, [onPointerMove]);
+
+  const onPointerDown = useCallback(
+    (e: React.PointerEvent) => {
+      e.preventDefault();
+      e.stopPropagation();
+      startX.current = e.clientX;
+      startWidth.current = getWidth();
+      setDragging(true);
+      document.body.classList.add('is-resizing');
+      window.addEventListener('pointermove', onPointerMove);
+      window.addEventListener('pointerup', onPointerUp);
+    },
+    [getWidth, onPointerMove, onPointerUp],
+  );
+
+  return { onPointerDown, dragging };
+}

package/agent-pane/frontend/src/store/store.test.ts

@@ -438,6 +438,25 @@ describe('onTurnCompleted', () => {
     expect(useStore.getState().sessionDetails['s1'].has_unreviewed).toBe(1);
     expect(useStore.getState().sessions[0].has_unreviewed).toBe(1);
   });
+it('stores the response text when provided and not already streamed', () => {
+    const turn = makeTurn('t1', 's1', { status: 'running' });
+    const detail = makeDetail('s1', [turn], { is_running: 1 });
+    resetStore({ sessionDetails: { s1: detail }, sessions: [makeSession('s1', { is_running: 1 })] });
+
+    useStore.getState().onTurnCompleted('s1', 't1', makeUsage(), true, 'Confirmed: done.');
+
+    expect(useStore.getState().sessionDetails['s1'].turns[0].agent_response).toBe('Confirmed: done.');
+  });
+
+  it('keeps streamed agent_response over the event response', () => {
+    const turn = makeTurn('t1', 's1', { status: 'running', agent_response: 'streamed text' });
+    const detail = makeDetail('s1', [turn], { is_running: 1 });
+    resetStore({ sessionDetails: { s1: detail }, sessions: [makeSession('s1', { is_running: 1 })] });
+
+    useStore.getState().onTurnCompleted('s1', 't1', makeUsage(), true, 'event text');
+
+    expect(useStore.getState().sessionDetails['s1'].turns[0].agent_response).toBe('streamed text');
+  });
 
   it('does not change has_unreviewed when hasUnreviewed is falsy', () => {
     const turn = makeTurn('t1', 's1', { status: 'running' });
@@ -1226,6 +1245,41 @@ describe('simple setters', () => {
 
 // === New tests: init ===
 
+describe('setSidebarWidth / setRightPanelWidth', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    resetStore();
+    vi.spyOn(Storage.prototype, 'setItem').mockImplementation(() => {});
+  });
+
+  it('clamps sidebar width to [SIDEBAR_MIN, SIDEBAR_MAX] and persists', () => {
+    const setItem = vi.mocked(Storage.prototype.setItem);
+    useStore.getState().setSidebarWidth(900);
+    expect(useStore.getState().sidebarWidth).toBe(480);
+    expect(setItem).toHaveBeenCalledWith('agentpane:sidebar-width', '480');
+
+    useStore.getState().setSidebarWidth(50);
+    expect(useStore.getState().sidebarWidth).toBe(160);
+    expect(setItem).toHaveBeenCalledWith('agentpane:sidebar-width', '160');
+  });
+
+  it('clamps right panel width to [RIGHT_PANEL_MIN, RIGHT_PANEL_MAX] and persists', () => {
+    const setItem = vi.mocked(Storage.prototype.setItem);
+    useStore.getState().setRightPanelWidth(9999);
+    expect(useStore.getState().rightPanelWidth).toBe(600);
+    expect(setItem).toHaveBeenCalledWith('agentpane:right-panel-width', '600');
+
+    useStore.getState().setRightPanelWidth(10);
+    expect(useStore.getState().rightPanelWidth).toBe(220);
+    expect(setItem).toHaveBeenCalledWith('agentpane:right-panel-width', '220');
+  });
+
+  it('rounds fractional widths', () => {
+    useStore.getState().setSidebarWidth(240.7);
+    expect(useStore.getState().sidebarWidth).toBe(241);
+  });
+});
+
 describe('init', () => {
   beforeEach(() => {
     vi.clearAllMocks();

package/agent-pane/frontend/src/store/uiSlice.ts

@@ -3,6 +3,30 @@ import type { LogEntry, RightTab, ChangesScope, ModelInfo } from '../types/index
 import type { StoreState, Toast } from './store.ts';
 import { fetchModels } from '../api/models.ts';
 
+/** Default + clamp bounds for resizable side panels (px). */
+export const SIDEBAR_MIN = 160;
+export const SIDEBAR_MAX = 480;
+export const SIDEBAR_DEFAULT = 240;
+export const RIGHT_PANEL_MIN = 220;
+export const RIGHT_PANEL_MAX = 600;
+export const RIGHT_PANEL_DEFAULT = 300;
+
+const SIDEBAR_KEY = 'agentpane:sidebar-width';
+const RIGHT_PANEL_KEY = 'agentpane:right-panel-width';
+
+/** Read a stored px width, falling back to `fallback` on missing/invalid data. */
+function readWidth(key: string, min: number, max: number, fallback: number): number {
+  try {
+    const raw = localStorage.getItem(key);
+    if (raw == null) return fallback;
+    const n = Number(raw);
+    if (!Number.isFinite(n)) return fallback;
+    return Math.min(max, Math.max(min, n));
+  } catch {
+    return fallback;
+  }
+}
+
 export type UiSlice = {
   activeRightTab: RightTab;
   changesScope: ChangesScope;
@@ -17,6 +41,8 @@ export type UiSlice = {
   models: ModelInfo[];
   modelsLoading: boolean;
   showModelSelector: boolean;
+  sidebarWidth: number;
+  rightPanelWidth: number;
 
   setActiveTurnIndex: (idx: number) => void;
   switchRightTab: (tab: RightTab) => void;
@@ -25,6 +51,8 @@ export type UiSlice = {
   setShowCommandPalette: (show: boolean) => void;
   setShowModelSelector: (show: boolean) => void;
   setSelectedChangePath: (path: string | null) => void;
+  setSidebarWidth: (w: number) => void;
+  setRightPanelWidth: (w: number) => void;
   addToast: (type: Toast['type'], message: string, undoAction?: () => void, undoLabel?: string) => void;
   removeToast: (id: string) => void;
   addLogEntry: (level: LogEntry['level'], message: string) => void;
@@ -45,6 +73,8 @@ export const createUiSlice: StateCreator<StoreState, [], [], UiSlice> = (set, ge
   models: [],
   modelsLoading: false,
   showModelSelector: false,
+  sidebarWidth: readWidth(SIDEBAR_KEY, SIDEBAR_MIN, SIDEBAR_MAX, SIDEBAR_DEFAULT),
+  rightPanelWidth: readWidth(RIGHT_PANEL_KEY, RIGHT_PANEL_MIN, RIGHT_PANEL_MAX, RIGHT_PANEL_DEFAULT),
 
   setActiveTurnIndex: (idx) => set({ activeTurnIndex: idx }),
   switchRightTab: (tab) => set({ activeRightTab: tab }),
@@ -54,6 +84,26 @@ export const createUiSlice: StateCreator<StoreState, [], [], UiSlice> = (set, ge
   setShowModelSelector: (show) => set({ showModelSelector: show }),
   setSelectedChangePath: (path) => set({ selectedChangePath: path }),
 
+  setSidebarWidth: (w) => {
+    const clamped = Math.min(SIDEBAR_MAX, Math.max(SIDEBAR_MIN, Math.round(w)));
+    set({ sidebarWidth: clamped });
+    try {
+      localStorage.setItem(SIDEBAR_KEY, String(clamped));
+    } catch {
+      /* ignore quota / disabled storage */
+    }
+  },
+
+  setRightPanelWidth: (w) => {
+    const clamped = Math.min(RIGHT_PANEL_MAX, Math.max(RIGHT_PANEL_MIN, Math.round(w)));
+    set({ rightPanelWidth: clamped });
+    try {
+      localStorage.setItem(RIGHT_PANEL_KEY, String(clamped));
+    } catch {
+      /* ignore quota / disabled storage */
+    }
+  },
+
   addToast: (type, message, undoAction, undoLabel) => {
     const id = Math.random().toString(36).slice(2, 9);
     set((state) => ({ toasts: [...state.toasts, { id, type, message, undoAction, undoLabel }] }));

package/agent-pane/frontend/src/store/wsSlice.ts

@@ -16,7 +16,7 @@ export type WsSlice = {
   onItemUpdated: (sessionId: string, turnId: string, item: Item) => void;
   onItemCompleted: (sessionId: string, turnId: string, item: Item) => void;
   onItemDelta: (sessionId: string, turnId: string, itemId: string, delta: string) => void;
-  onTurnCompleted: (sessionId: string, turnId: string, usage?: TokenUsage | null, hasUnreviewed?: boolean) => void;
+  onTurnCompleted: (sessionId: string, turnId: string, usage?: TokenUsage | null, hasUnreviewed?: boolean, response?: string) => void;
   onTokenUsageUpdated: (sessionId: string, turnId: string, usage: TokenUsage) => void;
   onContextUsageUpdated: (sessionId: string, ctx: ContextUsage) => void;
   onTurnFailed: (sessionId: string, turnId: string, error: string) => void;
@@ -141,7 +141,7 @@ export const createWsSlice: StateCreator<StoreState, [], [], WsSlice> = (set, ge
     });
   },
 
-  onTurnCompleted: (sessionId, turnId, usage, hasUnreviewed) => {
+  onTurnCompleted: (sessionId, turnId, usage, hasUnreviewed, response) => {
     const inTok = usage?.input_tokens ?? 0;
     const outTok = usage?.output_tokens ?? 0;
     get().addLogEntry('INFO', `turn:completed — ${inTok} in / ${outTok} out`);
@@ -160,7 +160,14 @@ export const createWsSlice: StateCreator<StoreState, [], [], WsSlice> = (set, ge
             has_unreviewed: hasUnreviewed ? 1 : detail.has_unreviewed,
             turns: detail.turns.map((t) =>
               t.id === turnId
-                ? { ...t, status: 'completed', token_usage: usage ?? t.token_usage ?? null }
+                ? {
+                    ...t,
+                    status: 'completed',
+                    token_usage: usage ?? t.token_usage ?? null,
+                    // Final text for turns that produce no agent_message item
+                    // (repoburg final-action rounds) — keep any streamed text.
+                    ...(response && !t.agent_response ? { agent_response: response } : {}),
+                  }
                 : t,
             ),
           },