@nextclaw/ui 0.15.16 → 0.15.18

package/src/features/chat/features/conversation/components/__tests__/session-conversation-area.test.tsx

@@ -1,5 +1,5 @@
 import { memo, type ReactNode } from "react";
-import { render, screen } from "@testing-library/react";
+import { act, render, screen } from "@testing-library/react";
 import { MemoryRouter } from "react-router-dom";
 import { describe, expect, it, vi, beforeEach } from "vitest";
 
@@ -20,7 +20,6 @@ const mocks = vi.hoisted(() => {
     setAttachments: vi.fn(),
     addAttachments: vi.fn(() => []),
     removeAttachment: vi.fn(),
-    setSelectedModel: vi.fn(),
     setSelectedThinkingLevel: vi.fn(),
     syncSessionPreferences: vi.fn(),
     setPendingSessionType: vi.fn(),
@@ -43,9 +42,9 @@ const mocks = vi.hoisted(() => {
     sendError: null,
   };
   const inputQuery = {
-    defaultModel: undefined,
+    defaultModel: undefined as string | undefined,
     defaultProjectRoot: null,
-    fallbackPreferredModel: undefined,
+    fallbackPreferredModel: undefined as string | undefined,
     fallbackPreferredThinking: null,
     isProviderStateResolved: true,
     isSkillsLoading: false,
@@ -138,17 +137,20 @@ vi.mock(
   () => ({
     ChatConversationContent: ({
       bottomSlot,
+      isContextCompacting,
       messages,
       showWelcome,
       welcomeSlot,
     }: {
       bottomSlot?: ReactNode;
+      isContextCompacting?: boolean;
       messages: readonly unknown[];
       showWelcome: boolean;
       welcomeSlot?: ReactNode;
     }) => (
       <div
         data-testid="conversation-content"
+        data-context-compacting={String(Boolean(isContextCompacting))}
         data-show-welcome={String(showWelcome)}
       >
         {showWelcome ? (
@@ -264,7 +266,10 @@ describe("SessionConversationArea input boundary", () => {
     mocks.agent.isRunning = true;
     mocks.agent.isSending = true;
     mocks.agent.snapshot.contextWindow = null;
+    mocks.inputQuery.defaultModel = undefined;
+    mocks.inputQuery.fallbackPreferredModel = undefined;
     mocks.inputQuery.selectedSession = null;
+    mocks.inputQuery.sessionTypeState.selectedSessionType = "default";
   });
 
   it("passes running state without treating an active run as a send request in flight", () => {
@@ -297,6 +302,23 @@ describe("SessionConversationArea input boundary", () => {
     expect(mocks.inputRenderSpy).toHaveBeenCalledOnce();
   });
 
+  it("shows compaction feedback only for the active session", () => {
+    renderArea("session-1");
+    const inputProps = mocks.inputRenderSpy.mock.calls[0]?.[0] as {
+      onContextCompactingChange: (sessionId: string, isCompacting: boolean) => void;
+    };
+
+    act(() => inputProps.onContextCompactingChange("session-1", true));
+
+    expect(screen.getByTestId("conversation-content").dataset.contextCompacting)
+      .toBe("true");
+
+    act(() => inputProps.onContextCompactingChange("session-1", false));
+
+    expect(screen.getByTestId("conversation-content").dataset.contextCompacting)
+      .toBe("false");
+  });
+
   it("does not replace the welcome composer just because draft send starts", () => {
     renderArea(null);
 
@@ -330,6 +352,30 @@ describe("SessionConversationArea input boundary", () => {
     expect(mocks.initialPromptSpy).toHaveBeenCalledWith("每天整理项目风险");
   });
 
+  it("syncs draft preferences with the selected runtime context", () => {
+    mocks.inputQuery.defaultModel = "openai/gpt-5";
+    mocks.inputQuery.fallbackPreferredModel = "minimax/MiniMax-M3";
+    const rendered = renderArea(null);
+    mocks.inputActions.syncSessionPreferences.mockClear();
+
+    mocks.inputQuery.sessionTypeState.selectedSessionType = "codex";
+    rendered.rerender(
+      <MemoryRouter>
+        <SessionConversationArea sessionKey={null} />
+      </MemoryRouter>,
+    );
+
+    expect(mocks.inputActions.syncSessionPreferences).toHaveBeenCalledOnce();
+    expect(mocks.inputActions.syncSessionPreferences).toHaveBeenLastCalledWith(
+      expect.objectContaining({
+        defaultModel: "openai/gpt-5",
+        fallbackPreferredModel: "minimax/MiniMax-M3",
+        selectedSessionKey: null,
+        selectedSessionType: "codex",
+      }),
+    );
+  });
+
   it("surfaces selected-session failure previews at the conversation bottom", () => {
     mocks.inputQuery.selectedSession = {
       activityPreview: {

package/src/features/chat/features/conversation/components/session-conversation-area.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useLocation } from "react-router-dom";
 
 import { useAppPresenter } from "@/app/components/app-presenter-provider";
@@ -200,6 +200,23 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
     inputSnapshot,
     setPendingSessionType: inputActions.setPendingSessionType,
   });
+  const [compactingSessionIds, setCompactingSessionIds] = useState<ReadonlySet<string>>(
+    () => new Set(),
+  );
+  const handleContextCompactingChange = useCallback(
+    (compactingSessionId: string, isCompacting: boolean) => {
+      setCompactingSessionIds((current) => {
+        const next = new Set(current);
+        if (isCompacting) {
+          next.add(compactingSessionId);
+        } else {
+          next.delete(compactingSessionId);
+        }
+        return next;
+      });
+    },
+    [],
+  );
   useEffect(() => {
     inputActions.syncSessionPreferences({
       defaultModel: inputQuery.defaultModel,
@@ -208,6 +225,7 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
       modelOptions: inputQuery.modelOptions,
       selectedSessionExists: Boolean(inputQuery.selectedSession),
       selectedSessionKey: inputQuery.selectedSessionKey,
+      selectedSessionType: inputQuery.sessionTypeState.selectedSessionType,
       selectedSessionPreferredModel:
         inputQuery.selectedSession?.preferredModel ?? undefined,
       selectedSessionPreferredThinking:
@@ -221,6 +239,7 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
     inputQuery.modelOptions,
     inputQuery.selectedSession,
     inputQuery.selectedSessionKey,
+    inputQuery.sessionTypeState.selectedSessionType,
   ]);
   useSessionConversationDraftRouteState({
     sessionKey,
@@ -336,6 +355,7 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
         inputActions={inputActions}
         inputQuery={inputQuery}
         inputSnapshot={displayInputSnapshot}
+        onContextCompactingChange={handleContextCompactingChange}
         surface={surface}
       />
     ),
@@ -345,6 +365,7 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
       inputController,
       inputActions,
       inputQuery,
+      handleContextCompactingChange,
     ],
   );
   const showWelcome =
@@ -365,6 +386,9 @@ export function SessionConversationArea(props: SessionConversationAreaProps) {
         isHistoryLoading={agent.isHydrating}
         isLoadingPreviousMessages={agent.isLoadingPreviousMessages}
         isSending={controller.isSending}
+        isContextCompacting={Boolean(
+          sessionKey && compactingSessionIds.has(sessionKey),
+        )}
         bottomSlot={sessionFailureSlot}
         messages={agent.visibleMessages}
         sessionKey={sessionKey}

package/src/features/chat/features/conversation/components/session-conversation-input.tsx

@@ -192,6 +192,7 @@ type SessionConversationInputProps = {
   readonly inputActions: SessionConversationInputActions;
   readonly inputQuery: SessionConversationInputQuery;
   readonly inputSnapshot: SessionConversationInputSnapshot;
+  readonly onContextCompactingChange?: (sessionId: string, isCompacting: boolean) => void;
   readonly surface?: 'default' | 'embedded';
 };
 
@@ -202,6 +203,7 @@ export const SessionConversationInput = memo(function SessionConversationInput(p
     inputActions,
     inputQuery,
     inputSnapshot,
+    onContextCompactingChange,
     surface = 'default',
   } = props;
   const presenter = usePresenter();
@@ -225,6 +227,7 @@ export const SessionConversationInput = memo(function SessionConversationInput(p
   });
   const slashCommands = useSessionConversationSlashCommands({
     language,
+    onContextCompactingChange,
     selectedSessionKey: inputQuery.selectedSessionKey,
   });
   const handleSlashPanelAppSelect = useCallback(

package/src/features/chat/features/conversation/hooks/__tests__/use-session-conversation-input-state.test.tsx

@@ -36,6 +36,7 @@ describe('useSessionConversationInputState session preferences', () => {
         modelOptions: MODEL_OPTIONS,
         selectedSessionExists: true,
         selectedSessionKey: 'session-a',
+        selectedSessionType: 'native',
         selectedSessionPreferredModel: 'deepseek/deepseek-v4-flash',
       });
     });
@@ -46,6 +47,7 @@ describe('useSessionConversationInputState session preferences', () => {
         modelOptions: MODEL_OPTIONS,
         selectedSessionExists: false,
         selectedSessionKey: 'session-b',
+        selectedSessionType: 'native',
       });
     });
     expect(result.current.inputSnapshot.selectedModel).toBe('deepseek/deepseek-v4-flash');
@@ -55,9 +57,48 @@ describe('useSessionConversationInputState session preferences', () => {
         modelOptions: MODEL_OPTIONS,
         selectedSessionExists: true,
         selectedSessionKey: 'session-b',
+        selectedSessionType: 'native',
         selectedSessionPreferredModel: 'minimax/MiniMax-M3',
       });
     });
     expect(result.current.inputSnapshot.selectedModel).toBe('minimax/MiniMax-M3');
   });
+
+  it('prefers the runtime recent model and otherwise restores the runtime default in a draft', () => {
+    const { result } = renderHook(() => useSessionConversationInputState());
+
+    act(() => {
+      result.current.inputActions.syncSessionPreferences({
+        fallbackPreferredModel: 'deepseek/deepseek-v4-flash',
+        modelOptions: MODEL_OPTIONS,
+        selectedSessionExists: false,
+        selectedSessionKey: null,
+        selectedSessionType: 'native',
+      });
+    });
+    expect(result.current.inputSnapshot.selectedModel).toBe('deepseek/deepseek-v4-flash');
+
+    act(() => {
+      result.current.inputActions.syncSessionPreferences({
+        defaultModel: 'deepseek/deepseek-v4-flash',
+        fallbackPreferredModel: 'minimax/MiniMax-M3',
+        modelOptions: MODEL_OPTIONS,
+        selectedSessionExists: false,
+        selectedSessionKey: null,
+        selectedSessionType: 'codex',
+      });
+    });
+    expect(result.current.inputSnapshot.selectedModel).toBe('minimax/MiniMax-M3');
+
+    act(() => {
+      result.current.inputActions.syncSessionPreferences({
+        defaultModel: 'deepseek/deepseek-v4-flash',
+        modelOptions: MODEL_OPTIONS,
+        selectedSessionExists: false,
+        selectedSessionKey: null,
+        selectedSessionType: 'hermes',
+      });
+    });
+    expect(result.current.inputSnapshot.selectedModel).toBe('deepseek/deepseek-v4-flash');
+  });
 });

package/src/features/chat/features/conversation/hooks/__tests__/use-session-conversation-slash-commands.test.tsx

@@ -68,6 +68,34 @@ describe('useSessionConversationSlashCommands', () => {
     ));
   });
 
+  it('reports visible compaction state for the lifetime of the request', async () => {
+    let resolveRequest!: () => void;
+    mocks.compactNcpSessionContext.mockReturnValue(new Promise((resolve) => {
+      resolveRequest = () => resolve({
+        compacted: true,
+        sessionId: 'session-1',
+      });
+    }));
+    const onContextCompactingChange = vi.fn();
+    const { result } = renderHook(() => useSessionConversationSlashCommands({
+      language: 'en',
+      selectedSessionKey: 'session-1',
+      onContextCompactingChange,
+    }));
+
+    act(() => result.current.find((entry) => entry.key === 'compact-context')?.onSelect());
+
+    expect(onContextCompactingChange).toHaveBeenCalledWith('session-1', true);
+    expect(onContextCompactingChange).not.toHaveBeenCalledWith('session-1', false);
+
+    act(() => resolveRequest());
+
+    await waitFor(() => expect(onContextCompactingChange).toHaveBeenLastCalledWith(
+      'session-1',
+      false,
+    ));
+  });
+
   it('does not expose session commands before a session exists', () => {
     const { result } = renderHook(() => useSessionConversationSlashCommands({
       language: 'en',

package/src/features/chat/features/conversation/hooks/use-session-conversation-input-query.ts

@@ -124,7 +124,7 @@ export function useSessionConversationInputQuery(params: UseSessionConversationI
   );
 
   return useMemo(() => ({
-    defaultModel: config?.agents.defaults.model,
+    defaultModel: sessionTypeState.selectedSessionTypeOption?.recommendedModel ?? config?.agents.defaults.model,
     defaultProjectRoot,
     fallbackPreferredModel,
     fallbackPreferredThinking,

package/src/features/chat/features/conversation/hooks/use-session-conversation-input-state.ts

@@ -53,7 +53,6 @@ export type SessionConversationInputActions = {
   readonly setAttachments: (attachments: readonly NcpDraftAttachment[]) => void;
   readonly addAttachments: (attachments: readonly NcpDraftAttachment[]) => readonly NcpDraftAttachment[];
   readonly removeAttachment: (attachmentId: string) => void;
-  readonly setSelectedModel: (model: SessionConversationInputStateValue) => void;
   readonly setSelectedThinkingLevel: (level: ThinkingLevel | null) => void;
   readonly syncSessionPreferences: (params: SessionConversationPreferenceSyncParams) => void;
   readonly setPendingSessionType: (sessionType: SetStateAction<string>) => void;

package/src/features/chat/features/conversation/hooks/use-session-conversation-preference-actions.ts

@@ -16,6 +16,7 @@ export type SessionConversationPreferenceSyncParams = {
   readonly modelOptions: ChatModelOption[];
   readonly selectedSessionExists: boolean;
   readonly selectedSessionKey?: string | null;
+  readonly selectedSessionType: string;
   readonly selectedSessionPreferredModel?: string;
   readonly selectedSessionPreferredThinking?: ThinkingLevel | null;
 };
@@ -34,10 +35,7 @@ export const useSessionConversationPreferenceActions = ({
   selectedThinkingLevel: currentSelectedThinkingLevel,
   updatePreferences,
 }: SessionConversationPreferenceActionsParams) => {
-  const previousSessionKeyRef = useRef<string | null | undefined>(undefined);
-  const setSelectedModel = useCallback((selectedModel: ConversationPreferenceValue) => {
-    updatePreferences({ selectedModel });
-  }, [updatePreferences]);
+  const previousPreferenceContextRef = useRef<string | undefined>(undefined);
   const setSelectedThinkingLevel = useCallback((selectedThinkingLevel: ThinkingLevel | null) => {
     updatePreferences({ selectedThinkingLevel });
   }, [updatePreferences]);
@@ -48,19 +46,21 @@ export const useSessionConversationPreferenceActions = ({
     modelOptions,
     selectedSessionExists,
     selectedSessionKey: sessionKey,
+    selectedSessionType,
     selectedSessionPreferredModel,
     selectedSessionPreferredThinking,
   }: SessionConversationPreferenceSyncParams) => {
     const selectedSessionKey = sessionKey ?? null;
-    const sessionChanged = previousSessionKeyRef.current !== selectedSessionKey;
-    const preserveCurrentPreference = sessionChanged && Boolean(selectedSessionKey) && !selectedSessionExists;
+    const preferenceContextKey = JSON.stringify([selectedSessionType, selectedSessionKey]);
+    const preferenceContextChanged = previousPreferenceContextRef.current !== preferenceContextKey;
+    const preserveCurrentPreference = preferenceContextChanged && Boolean(selectedSessionKey) && !selectedSessionExists;
     const selectedModel = resolveSelectedModelValue({
       currentSelectedModel: currentSelectedModel ?? undefined,
       modelOptions,
       selectedSessionPreferredModel,
       fallbackPreferredModel,
       defaultModel,
-      preferSessionPreferredModel: sessionChanged,
+      preferSessionPreferredModel: preferenceContextChanged,
       preserveCurrentSelectedModelOnSessionChange: preserveCurrentPreference,
     });
     const modelOption = modelOptions.find((option) => option.value === selectedModel);
@@ -72,7 +72,7 @@ export const useSessionConversationPreferenceActions = ({
       fallbackPreferredThinking,
       defaultThinkingLevel:
         (modelOption?.thinkingCapability?.default as ThinkingLevel | null | undefined) ?? null,
-      preferSessionPreferredThinking: sessionChanged,
+      preferSessionPreferredThinking: preferenceContextChanged,
       preserveCurrentSelectedThinkingOnSessionChange: preserveCurrentPreference,
     });
     if (
@@ -82,13 +82,12 @@ export const useSessionConversationPreferenceActions = ({
       updatePreferences({ selectedModel, selectedThinkingLevel });
     }
     if (!selectedSessionKey || selectedSessionExists) {
-      previousSessionKeyRef.current = selectedSessionKey;
+      previousPreferenceContextRef.current = preferenceContextKey;
     }
   }, [currentSelectedModel, currentSelectedThinkingLevel, updatePreferences]);
 
   return useMemo(() => ({
-    setSelectedModel,
     setSelectedThinkingLevel,
     syncSessionPreferences,
-  }), [setSelectedModel, setSelectedThinkingLevel, syncSessionPreferences]);
+  }), [setSelectedThinkingLevel, syncSessionPreferences]);
 };

package/src/features/chat/features/conversation/hooks/use-session-conversation-slash-commands.ts

@@ -7,9 +7,10 @@ import type { ChatSlashCommandDescriptor } from '@/features/chat/features/input/
 
 export function useSessionConversationSlashCommands(params: {
   language: I18nLanguage;
+  onContextCompactingChange?: (sessionId: string, isCompacting: boolean) => void;
   selectedSessionKey?: string | null;
 }): readonly ChatSlashCommandDescriptor[] {
-  const { language, selectedSessionKey } = params;
+  const { language, onContextCompactingChange, selectedSessionKey } = params;
   const presenter = usePresenter();
   const compactingSessionIdsRef = useRef(new Set<string>());
   const compactContext = useCallback(async (sessionId: string) => {
@@ -17,6 +18,7 @@ export function useSessionConversationSlashCommands(params: {
       return;
     }
     compactingSessionIdsRef.current.add(sessionId);
+    onContextCompactingChange?.(sessionId, true);
     try {
       await compactNcpSessionContext(sessionId);
       toast.success(t('chatSlashCommandCompactContextSuccess', language));
@@ -25,8 +27,9 @@ export function useSessionConversationSlashCommands(params: {
       toast.error(`${t('chatSlashCommandCompactContextFailed', language)}: ${message}`);
     } finally {
       compactingSessionIdsRef.current.delete(sessionId);
+      onContextCompactingChange?.(sessionId, false);
     }
-  }, [language]);
+  }, [language, onContextCompactingChange]);
 
   return useMemo(() => {
     const sessionId = selectedSessionKey?.trim();

package/src/features/chat/features/message/components/chat-message-list.container.tsx

@@ -159,16 +159,19 @@ const renderChatPanelAppCard = (panelApp: ChatPanelAppCardViewModel) => (
   <ChatInlinePanelAppCard panelApp={panelApp} />
 );
 
-function ChatContextCompactionDivider({
+export function ChatContextCompactionDivider({
   checkpoint,
 }: {
-  checkpoint: ContextCompactionTimelineView;
+  checkpoint?: ContextCompactionTimelineView;
 }) {
-  const title = [
-    `${t("chatContextCompactionCoveredMessages")}: ${checkpoint.coveredSessionMessageCount}`,
-    `${t("chatContextCompactionOriginalTokens")}: ${checkpoint.originalEstimatedTokens}`,
-    `${t("chatContextCompactionProjectedTokens")}: ${checkpoint.projectedEstimatedTokens}`,
-  ].join("\n");
+  const isCompacting = !checkpoint || checkpoint.status === "compressing";
+  const title = checkpoint
+    ? [
+        `${t("chatContextCompactionCoveredMessages")}: ${checkpoint.coveredSessionMessageCount}`,
+        `${t("chatContextCompactionOriginalTokens")}: ${checkpoint.originalEstimatedTokens}`,
+        `${t("chatContextCompactionProjectedTokens")}: ${checkpoint.projectedEstimatedTokens}`,
+      ].join("\n")
+    : undefined;
   return (
     <div
       className="my-4 flex items-center gap-3 text-[11px] text-muted-foreground"
@@ -176,13 +179,13 @@ function ChatContextCompactionDivider({
     >
       <div className="h-px flex-1 bg-border" />
       <div className="inline-flex items-center gap-2 rounded-full border border-border bg-muted px-3 py-1">
-        {checkpoint.status === "compressing" ? (
+        {isCompacting ? (
           <span className="h-1.5 w-1.5 animate-pulse rounded-full bg-muted-foreground" />
         ) : (
           <span className="h-1.5 w-1.5 rounded-full bg-muted-foreground/45" />
         )}
         <span>
-          {checkpoint.status === "compressing"
+          {isCompacting
             ? t("chatContextCompactionCompressing")
             : t("chatContextCompactionCompressed")}
         </span>

package/src/features/chat/features/message/hooks/__tests__/use-chat-message-virtualizer.test.tsx

@@ -207,47 +207,55 @@ describe("useChatMessageVirtualizer", () => {
     expect(scrollElement.scrollTop - (anchored?.start ?? 0)).toBe(anchorOffset);
   });
 
-  it("keeps later rows anchored when the first visible row changes height", async () => {
-    const scrollElement = document.createElement("div");
-    Object.defineProperties(scrollElement, {
-      clientHeight: { configurable: true, value: 800 },
-      offsetHeight: { configurable: true, value: 800 },
-      offsetWidth: { configurable: true, value: 800 },
-      scrollTop: { configurable: true, writable: true, value: 0 },
-    });
-    scrollElement.scrollTo = vi.fn((options) => {
-      if (typeof options === "object" && options.top !== undefined) {
-        scrollElement.scrollTop = options.top;
-      }
-    });
-    const rows = Array.from({ length: 10 }, (_, index) => ({
-      key: `message:${index}`,
-    }));
-    const { result } = renderHook(() =>
-      useChatMessageVirtualizer({
-        rows,
-        scrollRef: { current: scrollElement },
-      }),
-    );
-    await waitFor(() =>
-      expect(
-        result.current.virtualizer.getVirtualItems().length,
-      ).toBeGreaterThan(0),
-    );
-    act(() => result.current.virtualizer.resizeItem(4, 220));
-    scrollElement.scrollTop = 900;
-    act(() => scrollElement.dispatchEvent(new Event("scroll")));
-    await waitFor(() =>
-      expect(result.current.virtualizer.scrollOffset).toBe(900),
-    );
-    const anchor = result.current.virtualizer.getVirtualItemForOffset(980);
-    const anchorTop = (anchor?.start ?? 0) - scrollElement.scrollTop;
+  it.each([11, 20])(
+    "does not reclaim sticky escape when the active row grows %d px from the bottom",
+    async (escapeDistance) => {
+      const scrollElement = document.createElement("div");
+      Object.defineProperties(scrollElement, {
+        clientHeight: { configurable: true, value: 800 },
+        offsetHeight: { configurable: true, value: 800 },
+        offsetWidth: { configurable: true, value: 800 },
+        scrollTop: { configurable: true, writable: true, value: 0 },
+      });
+      scrollElement.scrollTo = vi.fn((options) => {
+        if (typeof options === "object" && options.top !== undefined) {
+          scrollElement.scrollTop = options.top;
+        }
+      });
+      const rows = Array.from({ length: 10 }, (_, index) => ({
+        key: `message:${index}`,
+      }));
+      const { result } = renderHook(() =>
+        useChatMessageVirtualizer({
+          rows,
+          scrollRef: { current: scrollElement },
+          activeRowKey: "message:9",
+        }),
+      );
+      await waitFor(() =>
+        expect(
+          result.current.virtualizer.getVirtualItems().length,
+        ).toBeGreaterThan(0),
+      );
+      act(() => result.current.virtualizer.resizeItem(9, 1_000));
+      const escapedScrollTop =
+        result.current.virtualizer.getTotalSize() -
+        scrollElement.clientHeight -
+        escapeDistance;
+      scrollElement.scrollTop = escapedScrollTop;
+      act(() => scrollElement.dispatchEvent(new Event("scroll")));
+      await waitFor(() =>
+        expect(result.current.virtualizer.scrollOffset).toBe(escapedScrollTop),
+      );
 
-    act(() => result.current.virtualizer.resizeItem(4, 480));
+      act(() => result.current.virtualizer.resizeItem(9, 1_100));
 
-    const anchored = result.current.virtualizer.getVirtualItemForOffset(1_240);
-    expect(scrollElement.scrollTop).toBe(1_160);
-    expect(anchored?.key).toBe(anchor?.key);
-    expect((anchored?.start ?? 0) - scrollElement.scrollTop).toBe(anchorTop);
-  });
+      expect(scrollElement.scrollTop).toBe(escapedScrollTop);
+      expect(
+        result.current.virtualizer.getTotalSize() -
+          scrollElement.scrollTop -
+          scrollElement.clientHeight,
+      ).toBe(escapeDistance + 100);
+    },
+  );
 });

package/src/features/chat/features/message/hooks/use-chat-message-virtualizer.ts

@@ -53,7 +53,7 @@ export function useChatMessageVirtualizer(params: {
     },
   });
   virtualizer.shouldAdjustScrollPositionOnItemSizeChange = (item) =>
-    item.start < (virtualizer.scrollOffset ?? 0);
+    item.end <= (virtualizer.scrollOffset ?? 0);
   const containerRef = useCallback(
     (node: HTMLDivElement | null) => {
       sizeContainerRef.current = node;