fix(chat): remove auto scroll quick setting

2026-07-01 18:13:03 +08:00 · 2026-06-29 22:38:16 +03:00
parent 37ef891945
commit 19b59e701e
19 changed files with 13 additions and 55 deletions
--- a/src/components/chat/hooks/useChatSessionState.ts
+++ b/src/components/chat/hooks/useChatSessionState.ts
@@ -18,7 +18,6 @@ interface UseChatSessionStateArgs {
  selectedSession: ProjectSession | null;
  ws: WebSocket | null;
  sendMessage: (message: unknown) => void;
-  autoScrollToBottom?: boolean;
  externalMessageUpdate?: number;
  newSessionTrigger?: number;
  processingSessions?: SessionActivityMap;
@@ -96,7 +95,6 @@ export function useChatSessionState({
  selectedSession,
  ws,
  sendMessage,
-  autoScrollToBottom,
  externalMessageUpdate,
  newSessionTrigger,
  processingSessions,
@@ -589,7 +587,7 @@ export function useChatSessionState({
        if (!isProcessing) {
          await sessionStore.refreshFromServer(selectedSession.id);

-          if (Boolean(autoScrollToBottom) && isNearBottom()) {
+          if (isNearBottom()) {
            setTimeout(() => scrollToBottom(), 200);
          }
        }
@@ -600,7 +598,6 @@ export function useChatSessionState({

    reloadExternalMessages();
  }, [
-    autoScrollToBottom,
    externalMessageUpdate,
    isNearBottom,
    scrollToBottom,
@@ -732,10 +729,9 @@ export function useChatSessionState({
  }, [chatMessages, visibleMessageCount]);

  useEffect(() => {
-    if (!autoScrollToBottom && scrollContainerRef.current) {
-      const container = scrollContainerRef.current;
-      scrollPositionRef.current = { height: container.scrollHeight, top: container.scrollTop };
-    }
+    const container = scrollContainerRef.current;
+    if (!container) return;
+    scrollPositionRef.current = { height: container.scrollHeight, top: container.scrollTop };
  });

  useEffect(() => {
@@ -743,8 +739,8 @@ export function useChatSessionState({
    if (isLoadingMoreRef.current || isLoadingMoreMessages || pendingScrollRestoreRef.current) return;
    if (searchScrollActiveRef.current) return;

-    if (autoScrollToBottom) {
-      if (!isUserScrolledUp) setTimeout(() => scrollToBottom(), 50);
+    if (!isUserScrolledUp) {
+      setTimeout(() => scrollToBottom(), 50);
      return;
    }

@@ -754,7 +750,7 @@ export function useChatSessionState({
    const newHeight = container.scrollHeight;
    const heightDiff = newHeight - prevHeight;
    if (heightDiff > 0 && prevTop > 0) container.scrollTop = prevTop + heightDiff;
-  }, [autoScrollToBottom, chatMessages.length, isLoadingMoreMessages, isUserScrolledUp, scrollToBottom]);
+  }, [chatMessages.length, isLoadingMoreMessages, isUserScrolledUp, scrollToBottom]);

  useEffect(() => {
    const container = scrollContainerRef.current;
--- a/src/components/chat/types/types.ts
+++ b/src/components/chat/types/types.ts
@@ -129,7 +129,6 @@ export interface ChatInterfaceProps {
  autoExpandTools?: boolean;
  showRawParameters?: boolean;
  showThinking?: boolean;
-  autoScrollToBottom?: boolean;
  sendByCtrlEnter?: boolean;
  externalMessageUpdate?: number;
  newSessionTrigger?: number;
--- a/src/components/chat/view/ChatInterface.tsx
+++ b/src/components/chat/view/ChatInterface.tsx
@@ -34,7 +34,6 @@ function ChatInterface({
  autoExpandTools,
  showRawParameters,
  showThinking,
-  autoScrollToBottom,
  sendByCtrlEnter,
  externalMessageUpdate,
  newSessionTrigger,
@@ -125,7 +124,6 @@ function ChatInterface({
    selectedSession,
    ws,
    sendMessage,
-    autoScrollToBottom,
    externalMessageUpdate,
    newSessionTrigger,
    processingSessions,
--- a/src/components/main-content/view/MainContent.tsx
+++ b/src/components/main-content/view/MainContent.tsx
@@ -54,7 +54,7 @@ function MainContent({
  newSessionTrigger,
 }: MainContentProps) {
  const { preferences } = useUiPreferences();
-  const { autoExpandTools, showRawParameters, showThinking, autoScrollToBottom, sendByCtrlEnter } = preferences;
+  const { autoExpandTools, showRawParameters, showThinking, sendByCtrlEnter } = preferences;

  const { currentProject, setCurrentProject } = useTaskMaster() as TaskMasterContextValue;
  const { tasksEnabled, isTaskMasterInstalled } = useTasksSettings() as TasksSettingsContextValue;
@@ -173,7 +173,6 @@ function MainContent({
                autoExpandTools={autoExpandTools}
                showRawParameters={showRawParameters}
                showThinking={showThinking}
-                autoScrollToBottom={autoScrollToBottom}
                sendByCtrlEnter={sendByCtrlEnter}
                externalMessageUpdate={externalMessageUpdate}
                newSessionTrigger={newSessionTrigger}
--- a/src/components/quick-settings-panel/constants.ts
+++ b/src/components/quick-settings-panel/constants.ts
@@ -1,11 +1,11 @@
 import {
-  ArrowDown,
  Brain,
  Eye,
  Languages,
  Maximize2,
  Mic,
 } from 'lucide-react';
+
 import type { PreferenceToggleItem } from './types';

 export const HANDLE_POSITION_STORAGE_KEY = 'quickSettingsHandlePosition';
@@ -41,14 +41,6 @@ export const TOOL_DISPLAY_TOGGLES: PreferenceToggleItem[] = [
  },
 ];

-export const VIEW_OPTION_TOGGLES: PreferenceToggleItem[] = [
-  {
-    key: 'autoScrollToBottom',
-    labelKey: 'quickSettings.autoScrollToBottom',
-    icon: ArrowDown,
-  },
-];
-
 export const INPUT_SETTING_TOGGLES: PreferenceToggleItem[] = [
  {
    key: 'sendByCtrlEnter',
--- a/src/components/quick-settings-panel/types.ts
+++ b/src/components/quick-settings-panel/types.ts
@@ -5,7 +5,6 @@ export type PreferenceToggleKey =
  | 'autoExpandTools'
  | 'showRawParameters'
  | 'showThinking'
-  | 'autoScrollToBottom'
  | 'sendByCtrlEnter'
  | 'voiceEnabled';

--- a/src/components/quick-settings-panel/view/QuickSettingsContent.tsx
+++ b/src/components/quick-settings-panel/view/QuickSettingsContent.tsx
@@ -1,18 +1,19 @@
 import { Moon, Sun } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
+
 import { DarkModeToggle } from '../../../shared/view/ui';
 import LanguageSelector from '../../../shared/view/ui/LanguageSelector';
 import {
  INPUT_SETTING_TOGGLES,
  SETTING_ROW_CLASS,
  TOOL_DISPLAY_TOGGLES,
-  VIEW_OPTION_TOGGLES,
 } from '../constants';
 import type {
  PreferenceToggleItem,
  PreferenceToggleKey,
  QuickSettingsPreferences,
 } from '../types';
+
 import QuickSettingsSection from './QuickSettingsSection';
 import QuickSettingsToggleRow from './QuickSettingsToggleRow';

@@ -65,10 +66,6 @@ export default function QuickSettingsContent({
        {renderToggleRows(TOOL_DISPLAY_TOGGLES)}
      </QuickSettingsSection>

-      <QuickSettingsSection title={t('quickSettings.sections.viewOptions')}>
-        {renderToggleRows(VIEW_OPTION_TOGGLES)}
-      </QuickSettingsSection>
-
      <QuickSettingsSection title={t('quickSettings.sections.inputSettings')}>
        {renderToggleRows(inputSettingToggles)}
        <p className="ml-3 text-xs text-gray-500 dark:text-gray-400">
--- a/src/components/quick-settings-panel/view/QuickSettingsPanelView.tsx
+++ b/src/components/quick-settings-panel/view/QuickSettingsPanelView.tsx
@@ -1,10 +1,12 @@
 import { useCallback, useMemo, useState } from 'react';
 import type { MouseEvent as ReactMouseEvent } from 'react';
+
 import { useDeviceSettings } from '../../../hooks/useDeviceSettings';
 import { useUiPreferences } from '../../../hooks/useUiPreferences';
 import { useTheme } from '../../../contexts/ThemeContext';
 import { useQuickSettingsDrag } from '../hooks/useQuickSettingsDrag';
 import type { PreferenceToggleKey, QuickSettingsPreferences } from '../types';
+
 import QuickSettingsContent from './QuickSettingsContent';
 import QuickSettingsHandle from './QuickSettingsHandle';
 import QuickSettingsPanelHeader from './QuickSettingsPanelHeader';
@@ -25,12 +27,10 @@ export default function QuickSettingsPanelView() {
    autoExpandTools: preferences.autoExpandTools,
    showRawParameters: preferences.showRawParameters,
    showThinking: preferences.showThinking,
-    autoScrollToBottom: preferences.autoScrollToBottom,
    sendByCtrlEnter: preferences.sendByCtrlEnter,
    voiceEnabled: preferences.voiceEnabled,
  }), [
    preferences.autoExpandTools,
-    preferences.autoScrollToBottom,
    preferences.sendByCtrlEnter,
    preferences.showRawParameters,
    preferences.showThinking,
--- a/src/hooks/useUiPreferences.ts
+++ b/src/hooks/useUiPreferences.ts
@@ -4,7 +4,6 @@ type UiPreferences = {
  autoExpandTools: boolean;
  showRawParameters: boolean;
  showThinking: boolean;
-  autoScrollToBottom: boolean;
  sendByCtrlEnter: boolean;
  sidebarVisible: boolean;
  voiceEnabled: boolean;
@@ -37,7 +36,6 @@ const DEFAULTS: UiPreferences = {
  autoExpandTools: false,
  showRawParameters: false,
  showThinking: true,
-  autoScrollToBottom: true,
  sendByCtrlEnter: false,
  sidebarVisible: true,
  voiceEnabled: false,
--- a/src/i18n/locales/de/settings.json
+++ b/src/i18n/locales/de/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "Darstellung",
      "toolDisplay": "Werkzeuganzeige",
-      "viewOptions": "Anzeigeoptionen",
      "inputSettings": "Eingabeeinstellungen"
    },
    "darkMode": "Darkmode",
    "autoExpandTools": "Werkzeuge automatisch erweitern",
    "showRawParameters": "Rohe Parameter anzeigen",
    "showThinking": "Denken anzeigen",
-    "autoScrollToBottom": "Automatisch nach unten scrollen",
    "sendByCtrlEnter": "Mit Strg+Enter senden",
    "sendByCtrlEnterDescription": "Wenn aktiviert, sendet Strg+Enter die Nachricht anstelle von Enter. Dies ist nützlich für IME-Benutzer:innen, um versehentliches Senden zu vermeiden.",
    "dragHandle": {
--- a/src/i18n/locales/en/settings.json
+++ b/src/i18n/locales/en/settings.json
@@ -70,14 +70,12 @@
    "sections": {
      "appearance": "Appearance",
      "toolDisplay": "Tool Display",
-      "viewOptions": "View Options",
      "inputSettings": "Input Settings"
    },
    "darkMode": "Dark Mode",
    "autoExpandTools": "Auto-expand tools",
    "showRawParameters": "Show raw parameters",
    "showThinking": "Show thinking",
-    "autoScrollToBottom": "Auto-scroll to bottom",
    "sendByCtrlEnter": "Send by Ctrl+Enter",
    "voiceEnabled": "Voice (mic + read aloud)",
    "sendByCtrlEnterDescription": "When enabled, pressing Ctrl+Enter will send the message instead of just Enter. This is useful for IME users to avoid accidental sends.",
--- a/src/i18n/locales/fr/settings.json
+++ b/src/i18n/locales/fr/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "Apparence",
      "toolDisplay": "Affichage des outils",
-      "viewOptions": "Options d'affichage",
      "inputSettings": "Paramètres de saisie"
    },
    "darkMode": "Mode sombre",
    "autoExpandTools": "Développer automatiquement les outils",
    "showRawParameters": "Afficher les paramètres bruts",
    "showThinking": "Afficher la réflexion",
-    "autoScrollToBottom": "Défilement automatique vers le bas",
    "sendByCtrlEnter": "Envoyer avec Ctrl+Entrée",
    "sendByCtrlEnterDescription": "Lorsqu'activé, appuyer sur Ctrl+Entrée envoie le message au lieu de simplement Entrée. Utile pour les utilisateurs IME pour éviter les envois accidentels.",
    "dragHandle": {
--- a/src/i18n/locales/it/settings.json
+++ b/src/i18n/locales/it/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "Aspetto",
      "toolDisplay": "Visualizzazione strumenti",
-      "viewOptions": "Opzioni visualizzazione",
      "inputSettings": "Impostazioni input"
    },
    "darkMode": "Modalità scura",
    "autoExpandTools": "Espandi strumenti automaticamente",
    "showRawParameters": "Mostra parametri grezzi",
    "showThinking": "Mostra ragionamento",
-    "autoScrollToBottom": "Scorrimento automatico in basso",
    "sendByCtrlEnter": "Invia con Ctrl+Invio",
    "sendByCtrlEnterDescription": "Se abilitato, premere Ctrl+Invio invierà il messaggio invece di Invio. Utile per gli utenti IME per evitare invii accidentali.",
    "dragHandle": {
--- a/src/i18n/locales/ja/settings.json
+++ b/src/i18n/locales/ja/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "外観",
      "toolDisplay": "ツール表示",
-      "viewOptions": "表示オプション",
      "inputSettings": "入力設定"
    },
    "darkMode": "ダークモード",
    "autoExpandTools": "ツールを自動展開",
    "showRawParameters": "生パラメータを表示",
    "showThinking": "思考を表示",
-    "autoScrollToBottom": "自動スクロール",
    "sendByCtrlEnter": "Ctrl+Enterで送信",
    "sendByCtrlEnterDescription": "有効にすると、Enterではなく Ctrl+Enter でメッセージを送信します。IMEユーザーの誤送信防止に便利です。",
    "dragHandle": {
--- a/src/i18n/locales/ko/settings.json
+++ b/src/i18n/locales/ko/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "외관",
      "toolDisplay": "도구 표시",
-      "viewOptions": "보기 옵션",
      "inputSettings": "입력 설정"
    },
    "darkMode": "다크 모드",
    "autoExpandTools": "도구 자동 펼치기",
    "showRawParameters": "Raw 파라미터 표시",
    "showThinking": "생각 과정 표시",
-    "autoScrollToBottom": "자동 스크롤",
    "sendByCtrlEnter": "Ctrl+Enter로 전송",
    "sendByCtrlEnterDescription": "활성화하면 Enter 대신 Ctrl+Enter로 메시지를 전송합니다. IME 사용자가 실수로 전송하는 것을 방지하는 데 유용합니다.",
    "dragHandle": {
--- a/src/i18n/locales/ru/settings.json
+++ b/src/i18n/locales/ru/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "Внешний вид",
      "toolDisplay": "Отображение инструментов",
-      "viewOptions": "Параметры просмотра",
      "inputSettings": "Настройки ввода"
    },
    "darkMode": "Темная тема",
    "autoExpandTools": "Автоматически разворачивать инструменты",
    "showRawParameters": "Показывать сырые параметры",
    "showThinking": "Показывать размышления",
-    "autoScrollToBottom": "Автопрокрутка вниз",
    "sendByCtrlEnter": "Отправка по Ctrl+Enter",
    "sendByCtrlEnterDescription": "Когда включено, нажатие Ctrl+Enter будет отправлять сообщение вместо просто Enter. Это полезно для пользователей IME, чтобы избежать случайной отправки.",
    "dragHandle": {
--- a/src/i18n/locales/tr/settings.json
+++ b/src/i18n/locales/tr/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "Görünüm",
      "toolDisplay": "Araç Gösterimi",
-      "viewOptions": "Görünüm Seçenekleri",
      "inputSettings": "Girdi Ayarları"
    },
    "darkMode": "Koyu Mod",
    "autoExpandTools": "Araçları otomatik genişlet",
    "showRawParameters": "Ham parametreleri göster",
    "showThinking": "Düşünmeyi göster",
-    "autoScrollToBottom": "Otomatik en alta kaydır",
    "sendByCtrlEnter": "Ctrl+Enter ile gönder",
    "sendByCtrlEnterDescription": "Etkinleştirildiğinde, Ctrl+Enter'a basmak yalnız Enter yerine mesajı gönderir. IME (girdi metot düzenleyici) kullananlar için yanlışlıkla göndermeyi önler.",
    "dragHandle": {
--- a/src/i18n/locales/zh-CN/settings.json
+++ b/src/i18n/locales/zh-CN/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "外观",
      "toolDisplay": "工具显示",
-      "viewOptions": "视图选项",
      "inputSettings": "输入设置"
    },
    "darkMode": "深色模式",
    "autoExpandTools": "自动展开工具",
    "showRawParameters": "显示原始参数",
    "showThinking": "显示思考过程",
-    "autoScrollToBottom": "自动滚动到底部",
    "sendByCtrlEnter": "使用 Ctrl+Enter 发送",
    "sendByCtrlEnterDescription": "启用后，按 Ctrl+Enter 发送消息，而不是仅按 Enter。这对于使用输入法的用户可以避免意外发送。",
    "dragHandle": {
--- a/src/i18n/locales/zh-TW/settings.json
+++ b/src/i18n/locales/zh-TW/settings.json
@@ -54,14 +54,12 @@
    "sections": {
      "appearance": "外觀",
      "toolDisplay": "工具顯示",
-      "viewOptions": "檢視選項",
      "inputSettings": "輸入設定"
    },
    "darkMode": "深色模式",
    "autoExpandTools": "自動展開工具",
    "showRawParameters": "顯示原始參數",
    "showThinking": "顯示思考過程",
-    "autoScrollToBottom": "自動捲動到底部",
    "sendByCtrlEnter": "使用 Ctrl+Enter 傳送",
    "sendByCtrlEnterDescription": "啟用後，按 Ctrl+Enter 傳送訊息，而不是僅按 Enter。這對於使用輸入法的使用者可以避免意外傳送。",
    "dragHandle": {