ompchamber 1.2.0 → 2.0.0

package/src/client/hooks/chat/timeline/scroll.ts

@@ -19,6 +19,12 @@
  * the tail disengages it (the scroll fight is gone — they can read while the
  * AI generates); scrolling back near the tail, or clicking the scroll-bottom
  * button, re-engages it. Programmatic jumps (`scrollTo`) never flip the mode.
+ *
+ * `jumpToBottom` is the unconditional bypass (`follow` is re-engaged, geometry
+ * is re-baselined, and the paging trigger stands down for a moment) — the
+ * button's jump, the open-session jump, and the send jump all go through it.
+ * `follow` lives across session switches, so an open jump that honoured it was
+ * simply refused for a session opened after the user had scrolled up.
  */
 
 import type { RefObject } from 'preact/compat';
@@ -27,6 +33,13 @@ import { useCallback, useEffect, useRef, useState } from 'preact/hooks';
 /** Distance from the tail, in pixels, that still counts as "at the bottom". */
 const FOLLOW_BOTTOM_THRESHOLD_PX = 100;
 
+/** How long a bottom jump counts as settling. The scroll handler reads "the
+ *  viewport is at the top, fetch older history" from geometry, and a jump that
+ *  STARTS at the top (the button, on a session scrolled back to its head)
+ *  passes through those first pixels — so the paging trigger stands down for
+ *  the jump's duration instead of paging a window the jump must then outrun. */
+const JUMP_SETTLE_MS = 1000;
+
 export interface ChatTimelineScrollOptions {
   /** Called when the viewport reaches the top (history paging trigger).
    *  Ref-indirect; the hook never depends on the callback's identity. */
@@ -41,15 +54,29 @@ export interface ChatTimelineScrollResult {
   isScrolling: boolean;
   /** Streaming auto-scroll gates on this: pinned to the tail = true. */
   followRef: RefObject<boolean>;
+  /** Bottom jumps issued so far. A paging request stamps its viewport anchor
+   *  with this and drops the anchor once it has moved on — otherwise a window
+   *  that lands AFTER the user asked for the tail writes `scrollTop` straight
+   *  over the jump (reproduced: the jump stopped ~26k px short of the tail and
+   *  only the next click reached it, once no window was left to page in). */
+  jumpCountRef: RefObject<number>;
+  /** True while a bottom jump is settling ({@link JUMP_SETTLE_MS}); history
+   *  paging stands down meanwhile. */
+  jumpActiveRef: RefObject<boolean>;
   handleScroll: () => void;
   scrollToBottom: (behavior?: ScrollBehavior) => void;
-  /** Jump to the tail and re-engage follow mode (scroll-bottom button). */
+  /** Jump to the tail and re-engage follow mode (scroll-bottom button, the
+   *  session-open jump, the post-send jump). */
   jumpToBottom: (behavior?: ScrollBehavior) => void;
 }
 
 /** Distance from the top that counts as "reached the history boundary". */
 const SCROLL_TOP_TRIGGER_PX = 40;
 
+/** Pending timeout handle. Named here rather than re-derived per ref because
+ *  the DOM and Bun/Node typings disagree on what `setTimeout` returns. */
+type TimeoutHandle = ReturnType<typeof setTimeout>;
+
 export function useChatTimelineScroll(options: ChatTimelineScrollOptions = {}): ChatTimelineScrollResult {
   const onScrollTopRef = useRef<(() => void) | undefined>(options.onScrollTop);
   onScrollTopRef.current = options.onScrollTop ?? onScrollTopRef.current;
@@ -57,17 +84,33 @@ export function useChatTimelineScroll(options: ChatTimelineScrollOptions = {}):
   const [contentNode, setContentNode] = useState<HTMLDivElement | null>(null);
   const [showScrollBottom, setShowScrollBottom] = useState(false);
   const [isScrolling, setIsScrolling] = useState(false);
-  const scrollTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const scrollTimerRef = useRef<TimeoutHandle>();
   // True while the viewport is (or should stay) pinned to the tail. A ref, not
   // state: scroll chunks read it every frame and a flip must not re-render.
   const followRef = useRef(true);
   // Previous scrollTop, for upward-scroll detection in handleScroll.
   const lastScrollTopRef = useRef(0);
+  // Bottom-jump bookkeeping; see ChatTimelineScrollResult for each ref.
+  const jumpCountRef = useRef(0);
+  const jumpActiveRef = useRef(false);
+  const jumpTimerRef = useRef<TimeoutHandle>();
 
   const contentRef = useCallback((node: HTMLDivElement | null) => {
     setContentNode(node);
   }, []);
 
+  /** Move the viewport to the tail unconditionally, then re-baseline the
+   *  upward-scroll detector. Both matter: `scrollTo` applies the new position
+   *  for 'instant', and the previous session's (larger) scrollTop would
+   *  otherwise read as the user scrolling UP on the very event this jump
+   *  produces — disengaging follow and cancelling a jump in flight. */
+  const pinToBottom = useCallback((behavior: ScrollBehavior) => {
+    const el = scrollRef.current;
+    if (!el) return;
+    el.scrollTo({ top: el.scrollHeight, behavior });
+    lastScrollTopRef.current = el.scrollTop;
+  }, []);
+
   const syncFollowBottom = useCallback(() => {
     const el = scrollRef.current;
     if (!el) return;
@@ -83,7 +126,12 @@ export function useChatTimelineScroll(options: ChatTimelineScrollOptions = {}):
       // increasing scrollTop, so a geometry check alone would flip the flag
       // mid-animation as content outgrows the animation. Re-engage whenever
       // the viewport is back near the tail, whichever way it got there.
-      if (el.scrollTop < lastScrollTopRef.current - 1) followRef.current = false;
+      if (el.scrollTop < lastScrollTopRef.current - 1) {
+        followRef.current = false;
+        // The user took the viewport back: a jump still settling must not keep
+        // re-pinning the tail under them.
+        jumpActiveRef.current = false;
+      }
       if (el.scrollHeight - el.scrollTop - el.clientHeight < FOLLOW_BOTTOM_THRESHOLD_PX) followRef.current = true;
       lastScrollTopRef.current = el.scrollTop;
       // History paging: the viewport hit the top — ask for the older window.
@@ -92,43 +140,68 @@ export function useChatTimelineScroll(options: ChatTimelineScrollOptions = {}):
     }
     syncFollowBottom();
     setIsScrolling(true);
-    if (scrollTimerRef.current) clearTimeout(scrollTimerRef.current);
+    clearTimeout(scrollTimerRef.current);
     scrollTimerRef.current = setTimeout(() => setIsScrolling(false), 600);
   }, [syncFollowBottom]);
 
   const scrollToBottom = useCallback((behavior: ScrollBehavior = 'smooth') => {
-    const el = scrollRef.current;
-    if (!el) return;
     // Follow-gated: a stream chunk in read mode (user scrolled away) must not
     // yank the viewport down. jumpToBottom is the explicit bypass.
     if (!followRef.current) return;
-    el.scrollTo({ top: el.scrollHeight, behavior });
-  }, []);
+    pinToBottom(behavior);
+  }, [pinToBottom]);
 
   const jumpToBottom = useCallback((behavior: ScrollBehavior = 'smooth') => {
-    const el = scrollRef.current;
-    if (!el) return;
+    if (!scrollRef.current) return;
     followRef.current = true;
-    el.scrollTo({ top: el.scrollHeight, behavior });
-  }, []);
+    jumpActiveRef.current = true;
+    jumpCountRef.current += 1;
+    clearTimeout(jumpTimerRef.current);
+    jumpTimerRef.current = setTimeout(() => { jumpActiveRef.current = false; }, JUMP_SETTLE_MS);
+    pinToBottom(behavior);
+  }, [pinToBottom]);
 
-  // Re-sync whenever an observed box changes size. `contentNode` is a dep so the
-  // observer is rebuilt when the timeline mounts — a session picked from the
-  // workspace picker swaps the whole subtree in, and the callback ref fires
-  // before this effect, so the node is always available here.
+  // Geometry, not events: content that grows without the user scrolling
+  // (history prepending, an accordion expanding, an image decoding, a late
+  // Shiki/mermaid layout, the panel resizing) never fires `scroll`, so nothing
+  // else notices the tail moving away. While the viewport is pinned that growth
+  // is exactly when to re-pin it — a prepended window shifts the tail down by
+  // its own height, which strands a jump target measured a frame earlier (and
+  // a one-shot open jump by anything that lays out late). Unpinned (the user
+  // reading back) nothing is touched: the prepend anchor owns the position.
+  //
+  // `contentNode` is a dep so the observer is rebuilt when the timeline mounts
+  // — a session picked from the workspace picker swaps the whole subtree in,
+  // and the callback ref fires before this effect, so the node is always
+  // available here.
   useEffect(() => {
     syncFollowBottom();
     if (typeof ResizeObserver === 'undefined') return;
     const container = scrollRef.current;
-    const observer = new ResizeObserver(syncFollowBottom);
+    const observer = new ResizeObserver(() => {
+      if (followRef.current) pinToBottom('instant');
+      syncFollowBottom();
+    });
     if (container) observer.observe(container);
     if (contentNode) observer.observe(contentNode);
     return () => observer.disconnect();
-  }, [contentNode, syncFollowBottom]);
+  }, [contentNode, pinToBottom, syncFollowBottom]);
 
   useEffect(() => () => {
-    if (scrollTimerRef.current) clearTimeout(scrollTimerRef.current);
+    clearTimeout(scrollTimerRef.current);
+    clearTimeout(jumpTimerRef.current);
   }, []);
 
-  return { scrollRef, contentRef, showScrollBottom, isScrolling, followRef, handleScroll, scrollToBottom, jumpToBottom };
+  return {
+    scrollRef,
+    contentRef,
+    showScrollBottom,
+    isScrolling,
+    followRef,
+    jumpCountRef,
+    jumpActiveRef,
+    handleScroll,
+    scrollToBottom,
+    jumpToBottom,
+  };
 }

package/src/client/hooks/chat/timeline/session-load.ts

@@ -60,10 +60,14 @@ export interface UseSessionLoadDeps {
   /** Scroll container of the timeline: lets loadOlder preserve the viewport
    *  position when older rows are prepended above it. */
   scrollRef?: RefObject<HTMLDivElement>;
+  /** Scroll hook's bottom-jump guard and counter, forwarded to the pagination
+   *  hook: a jump to the tail outranks an in-flight older window. */
+  jumpActiveRef?: RefObject<boolean>;
+  jumpCountRef?: RefObject<number>;
 }
 
 export function useSessionLoad(deps: UseSessionLoadDeps) {
-  const { sessionId, setLocalMessages, setGenerating, isGeneratingRef, aiPlaceholderIdRef, localMessagesRef, optimisticUserIdRef, cancelStreamingCoalescer, metaRefreshedRef, scrollRef } = deps;
+  const { sessionId, setLocalMessages, setGenerating, isGeneratingRef, aiPlaceholderIdRef, localMessagesRef, optimisticUserIdRef, cancelStreamingCoalescer, metaRefreshedRef, scrollRef, jumpActiveRef, jumpCountRef } = deps;
 
   const [sessionData, setSessionData] = useState<SessionDataShape | null>(null);
   const [sessionLoading, setSessionLoading] = useState(false);
@@ -99,6 +103,8 @@ export function useSessionLoad(deps: UseSessionLoadDeps) {
     sessionIdRef,
     setLocalMessages,
     scrollRef,
+    jumpActiveRef,
+    jumpCountRef,
   });
 
   /** Re-fetch the session's title/metadata after the omp JSONL has been

package/src/client/hooks/chat/timeline/session-pagination.test.ts

@@ -0,0 +1,167 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The prepend anchor vs. a bottom jump. The anchor exists to hold a READING
+ * position when older history is paged in above the viewport, and it writes
+ * `scrollTop` directly (which CSS `scroll-behavior: smooth` then animates). A
+ * window that landed after the user asked for the tail therefore wrote
+ * `scrollTop` straight over the jump: reproduced live in the chamber against a
+ * session with older pages — the viewport stopped ~26k px short of the tail
+ * (the anchor's own target), and only the next click reached the bottom, once
+ * no window was left to page in.
+ *
+ * Runs against a real DOM (happy-dom) because the hook is a Preact hook;
+ * geometry and `fetch` are faked (happy-dom does no layout and no network).
+ */
+
+import { afterAll, beforeAll, beforeEach, describe, expect, test } from 'bun:test';
+import { Window } from 'happy-dom';
+import type { Dispatch, SetStateAction } from 'preact/compat';
+import type { h as PreactH, render as PreactRender } from 'preact';
+import type { act as PreactAct } from 'preact/test-utils';
+import type { useSessionPagination as UsePagination, SessionPagination } from '@/client/hooks/chat/timeline/session-pagination';
+import type { ChatMessageData } from '@/shared/types';
+
+let useSessionPagination: typeof UsePagination;
+let h: typeof PreactH;
+let render: typeof PreactRender;
+let act: typeof PreactAct;
+
+let win: Window;
+let container: HTMLDivElement;
+let scrollEl: HTMLDivElement;
+/** Prepend this many pixels of older rows when the stubbed window resolves. */
+let prependHeightPx = 1000;
+let fetchCount = 0;
+
+const geometry = { top: 0, height: 5000, viewport: 500 };
+
+function installScroller(el: HTMLDivElement) {
+  Object.defineProperty(el, 'scrollHeight', { get: () => geometry.height, configurable: true });
+  Object.defineProperty(el, 'clientHeight', { get: () => geometry.viewport, configurable: true });
+  Object.defineProperty(el, 'scrollTop', {
+    get: () => geometry.top,
+    set: (value: number) => {
+      geometry.top = Math.max(0, Math.min(value, geometry.height - geometry.viewport));
+    },
+    configurable: true,
+  });
+  Object.defineProperty(el, 'scrollTo', { value: () => {}, configurable: true });
+}
+
+/** The two refs the scroll hook owns and the pagination hook reads. */
+const jumpActiveRef = { current: false };
+const jumpCountRef = { current: 0 };
+const sessionIdRef = { current: 's1' };
+const scrollRef: { current: HTMLDivElement | null } = { current: null };
+/** The hook prepends through this; the commit under test comes from its own
+ *  prepend tick, so recording the update is all this needs to do. */
+const setLocalMessages: Dispatch<SetStateAction<ChatMessageData[]>> = () => {};
+
+let pagination: SessionPagination;
+
+function Probe() {
+  pagination = useSessionPagination({
+    sessionId: 's1',
+    sessionIdRef,
+    setLocalMessages,
+    scrollRef,
+    jumpActiveRef,
+    jumpCountRef,
+  });
+  return null;
+}
+
+/** A window that prepends `prependHeightPx` of older rows when it lands. */
+function stubWindowFetch() {
+  (globalThis as Record<string, unknown>).fetch = async () => {
+    fetchCount += 1;
+    // The prepend commit is where the anchor reads the new scrollHeight.
+    geometry.height += prependHeightPx;
+    return {
+      ok: true,
+      json: async () => ({
+        session: { messages: [{ id: 'old-1', role: 'user', content: 'old' }] },
+        hasMore: false,
+        oldestIndex: 0,
+      }),
+    };
+  };
+}
+
+async function settle() {
+  for (let i = 0; i < 10; i++) await Promise.resolve();
+  await act(async () => { for (let i = 0; i < 10; i++) await Promise.resolve(); });
+}
+
+beforeAll(async () => {
+  win = new Window({ url: 'http://localhost' });
+  for (const key of ['window', 'document', 'navigator', 'Node', 'Element', 'HTMLElement', 'Event'] as const) {
+    (globalThis as Record<string, unknown>)[key] = (win as unknown as Record<string, unknown>)[key];
+  }
+  // Static imports cannot work here: Preact binds its environment at module
+  // evaluation time, so the modules below must load after those DOM globals.
+  ({ useSessionPagination } = await import('@/client/hooks/chat/timeline/session-pagination'));
+  ({ h, render } = await import('preact'));
+  ({ act } = await import('preact/test-utils'));
+});
+
+afterAll(() => {
+  delete (globalThis as Record<string, unknown>).fetch;
+  for (const key of ['window', 'document', 'navigator', 'Node', 'Element', 'HTMLElement', 'Event']) {
+    delete (globalThis as Record<string, unknown>)[key];
+  }
+});
+
+beforeEach(async () => {
+  geometry.top = 0;
+  geometry.height = 5000;
+  fetchCount = 0;
+  jumpActiveRef.current = false;
+  jumpCountRef.current = 0;
+  stubWindowFetch();
+  container = document.createElement('div');
+  document.body.appendChild(container);
+  scrollEl = document.createElement('div');
+  installScroller(scrollEl);
+  scrollRef.current = scrollEl;
+  await act(async () => { render(h(Probe, {}), container); });
+  await act(async () => { pagination.applyWindow(true, 100); });
+});
+
+describe('prepend anchor vs bottom jump', () => {
+  test('holds the reading position when the user has not asked for the tail', async () => {
+    await act(async () => { pagination.loadOlder(); });
+    await settle();
+
+    expect(fetchCount).toBe(1);
+    expect(geometry.height).toBe(6000);
+    // prevTop (0) + the prepended height: the rows being read stay put.
+    expect(scrollEl.scrollTop).toBe(1000);
+  });
+
+  test('is dropped when the user asked for the tail after the request went out', async () => {
+    const requested = pagination.loadOlder();
+    // The user clicks scroll-to-bottom while the window is still in flight.
+    jumpCountRef.current += 1;
+    await requested;
+    await settle();
+
+    expect(fetchCount).toBe(1);
+    expect(geometry.height).toBe(6000);
+    // The jump owns the position; the anchor wrote nothing over it.
+    expect(scrollEl.scrollTop).toBe(0);
+  });
+
+  test('a jump in flight blocks the paging trigger', async () => {
+    jumpActiveRef.current = true;
+    await act(async () => { pagination.loadOlder(); });
+    await settle();
+
+    expect(fetchCount).toBe(0);
+    expect(geometry.height).toBe(5000);
+  });
+});

package/src/client/hooks/chat/timeline/session-pagination.ts

@@ -31,6 +31,15 @@ export interface UseSessionPaginationDeps {
   /** Scroll container of the timeline: lets loadOlder preserve the viewport
    *  position when older rows are prepended above it. */
   scrollRef?: RefObject<HTMLDivElement>;
+  /** Scroll hook's bottom-jump guard: history paging stands down while a jump
+   *  to the tail is settling, so the jump does not race a window it never
+   *  asked for (the jump starts at the top, where the trigger lives). */
+  jumpActiveRef?: RefObject<boolean>;
+  /** Scroll hook's bottom-jump counter: a page request stamps its viewport
+   *  anchor with the count it saw and drops the anchor when it has moved on.
+   *  The anchor exists to hold a READING position, and applying it over a jump
+   *  the user asked for parked the viewport back where they used to be. */
+  jumpCountRef?: RefObject<number>;
 }
 
 export interface SessionPagination {
@@ -67,7 +76,7 @@ interface WindowPayload {
 }
 
 export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPagination {
-  const { sessionId, sessionIdRef, setLocalMessages, scrollRef } = deps;
+  const { sessionId, sessionIdRef, setLocalMessages, scrollRef, jumpActiveRef: bottomJumpActiveRef, jumpCountRef } = deps;
 
   const [hasMore, setHasMore] = useState(false);
   const [oldestIndex, setOldestIndex] = useState(0);
@@ -83,14 +92,14 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
   // the scroll handler would read "the user reached the top" and page an extra
   // window nobody asked for — and that window's own scroll anchor would fight
   // the jump's.
-  const jumpActiveRef = useRef(false);
+  const railJumpActiveRef = useRef(false);
   // Live cursor: a jump walks it across several requests, and state does not
   // update between iterations of that loop.
   const oldestIndexRef = useRef(0);
   oldestIndexRef.current = oldestIndex;
   // Set while prepending older rows; the layout effect below re-anchors the
   // viewport to the content the user was reading instead of jumping.
-  const pendingScrollAnchorRef = useRef<{ prevHeight: number; prevTop: number } | null>(null);
+  const pendingScrollAnchorRef = useRef<{ prevHeight: number; prevTop: number; jumpCount: number } | null>(null);
 
   const resetPages = useCallback(() => {
     setHasMore(false);
@@ -101,6 +110,10 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
     loadingOlderRef.current = false;
     setLoadingOlder(false);
     setLoadOlderError(false);
+    // A recorded anchor belongs to the previous session's geometry, and its
+    // request was dropped on the switch — applying it would write THAT window's
+    // offset into this session's scrollTop.
+    pendingScrollAnchorRef.current = null;
   }, []);
 
   const applyWindow = useCallback((hasMoreFromLoad: unknown, oldestIndexFromLoad: unknown) => {
@@ -119,11 +132,15 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
     return { messages: data.session?.messages ?? [], hasMore: data.hasMore, oldestIndex: data.oldestIndex };
   }, [sessionId]);
 
-  /** Record the viewport geometry an older-window prepend is about to shift. */
+  /** Record the viewport geometry an older-window prepend is about to shift,
+   *  stamped with the bottom-jump count so the anchor can be dropped if the
+   *  user asked for the tail after this request went out. */
   const anchorViewport = useCallback(() => {
     const el = scrollRef?.current;
-    if (el) pendingScrollAnchorRef.current = { prevHeight: el.scrollHeight, prevTop: el.scrollTop };
-  }, [scrollRef]);
+    if (el) {
+      pendingScrollAnchorRef.current = { prevHeight: el.scrollHeight, prevTop: el.scrollTop, jumpCount: jumpCountRef?.current ?? 0 };
+    }
+  }, [scrollRef, jumpCountRef]);
 
   /** Drop the jump's scroll-handler guard once its target scroll has settled.
    *  Until then the viewport is still near the top of history (where the paging
@@ -132,7 +149,7 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
   const releaseJumpGuard = useCallback(() => {
     const el = scrollRef?.current;
     if (!el) {
-      jumpActiveRef.current = false;
+      railJumpActiveRef.current = false;
       return;
     }
     let lastTop = el.scrollTop;
@@ -145,7 +162,7 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
       }
       // A few still frames = the smooth scroll is done (or never started).
       if (settledFrames >= 5) {
-        jumpActiveRef.current = false;
+        railJumpActiveRef.current = false;
         return;
       }
       requestAnimationFrame(watch);
@@ -162,7 +179,11 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
    *  placeholder, and blocking it made the button feel dead mid-run. */
   const loadOlder = useCallback(() => {
     if (!sessionId || sessionId.startsWith('new-')) return;
-    if (!hasMore || loadingOlderRef.current || jumpActiveRef.current) return;
+    if (!hasMore || loadingOlderRef.current || railJumpActiveRef.current) return;
+    // A jump to the tail starts at the top, where this trigger lives: paging a
+    // window then is work the jump never asked for, and the window's own
+    // anchor would race the jump's landing.
+    if (bottomJumpActiveRef?.current) return;
     loadingOlderRef.current = true;
     setLoadingOlder(true);
     setLoadOlderError(false);
@@ -204,7 +225,7 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
         loadingOlderRef.current = false;
         setLoadingOlder(false);
       });
-  }, [sessionId, sessionIdRef, hasMore, oldestIndex, fetchWindow, anchorViewport, setLocalMessages, applyWindow]);
+  }, [sessionId, sessionIdRef, hasMore, oldestIndex, fetchWindow, anchorViewport, setLocalMessages, applyWindow, bottomJumpActiveRef]);
 
   /**
    * Walk the cursor down until the row with `id` is mounted, prepending every
@@ -226,7 +247,7 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
     if (loadingOlderRef.current) return false;
     const requestedSessionId = sessionId;
     loadingOlderRef.current = true;
-    jumpActiveRef.current = true;
+    railJumpActiveRef.current = true;
     setLoadingOlder(true);
     setLoadOlderError(false);
     // No viewport anchor here, deliberately: the anchor exists to hold the
@@ -283,6 +304,11 @@ export function useSessionPagination(deps: UseSessionPaginationDeps): SessionPag
     const el = scrollRef?.current;
     if (!el) return;
     pendingScrollAnchorRef.current = null;
+    // The user asked for the tail after this window was requested: holding the
+    // old reading position would write scrollTop straight over that jump (a
+    // window landing mid-jump parked the viewport ~26k px short of the tail).
+    // The jump's own landing, plus the scroll hook's re-pin, owns the position.
+    if (anchor.jumpCount !== (jumpCountRef?.current ?? 0)) return;
     const delta = el.scrollHeight - anchor.prevHeight;
     if (delta > 0) el.scrollTop = anchor.prevTop + delta;
   }, [prependTick, scrollRef]);

package/src/client/hooks/settings/providers.ts

@@ -254,9 +254,40 @@ export function useProviderSettings({
     (models) => models.map((m) => (m.id === modelId ? { ...m, isVisible: !m.isVisible } : m)),
   );
 
-  const handleSaveModelConfig = (modelId: string, updates: Partial<ProviderModel>) => updateSelectedModels(
-    (models) => models.map((m) => (m.id === modelId ? { ...m, ...updates } : m)),
-  );
+  /**
+   * Save the per-model knobs omp honours (`models.yml` modelOverrides). The
+   * overlay still stores the display value so the dialog reopens where the user
+   * left it, but omp only reads the override — writing just the overlay was the
+   * bug that made these controls inert.
+   */
+  const handleSaveModelConfig = async (modelId: string, updates: Partial<ProviderModel>) => {
+    if (!selectedProvider) return;
+    const provider = selectedProvider;
+    updateSelectedModels((models) => models.map((m) => (m.id === modelId ? { ...m, ...updates } : m)));
+
+    const body: Record<string, unknown> = { provider: provider.slug, modelId };
+    if ('maxTokens' in updates) body.maxTokens = updates.maxTokens ?? null;
+    if ('reasoningEffort' in updates) body.reasoningEffort = updates.reasoningEffort ?? null;
+    if (Object.keys(body).length === 2) return;
+
+    try {
+      const response = await fetch('/api/settings/model-override', {
+        method: 'PUT',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(body),
+      });
+      const data = await response.json() as { success?: boolean; written?: boolean; reason?: string; error?: string };
+      if (!response.ok) {
+        pushToast(data.error || 'Failed to save the model configuration.', 'error');
+        return;
+      }
+      if (data.written) notifyModelsUpdated();
+      else if (data.reason) pushToast(data.reason, 'error');
+    } catch (error) {
+      console.error('Failed to save model override:', error);
+      pushToast('Failed to save the model configuration.', 'error');
+    }
+  };
 
   return {
     providers,

package/src/client/hooks/ui/open-file.ts

@@ -5,6 +5,10 @@ export interface OpenFilePayload {
   name?: string;
   id?: number;
   content?: string;
+  /** Absolute workspace root the path belongs to; the panel defaults it to the active project. */
+  root?: string;
+  /** Repo picked in the panel, relative to `root` — the path's own scope when set. */
+  repo?: string;
 }
 
 /**
@@ -26,7 +30,9 @@ export function openFileInEditor(payloadOrPath: string | OpenFilePayload) {
         path: cleanPath,
         name: fileName,
         id: payload.id,
-        content: payload.content
+        content: payload.content,
+        root: payload.root,
+        repo: payload.repo,
       }
     })
   );