From b204029b57e6ca9e8725163d45832f51a7423094 Mon Sep 17 00:00:00 2001
From: chujieHong <2280628443@qq.com>
Date: Wed, 19 Aug 2026 16:22:08 +0800
Subject: [PATCH] fix(channels): add missing internal scroll to channels panel
 in fill layout

The Personalization channels tab clips overflowing cards when the page is
zoomed: the fill layout's fillChild is overflow:hidden and ChannelsPanel
had no flex:1 nor a scroll container between the toolbar and the card
grid, so cards pushed below the viewport could never be reached.

Mirror the Skills tabbedBody pattern: pin the toolbar, wrap the grid (and
the loading skeleton) in a scrollable body (flex:1, min-height:0,
overflow:auto, 8px top padding so card hover lift stays inside the
scrollport). Mobile keeps page-level scrolling via a max-width:767px
override, matching fillChild. The Experts ChannelCatalogDrawer embed is
unaffected (block wrapper makes flex:1 inert; auto-height overflow does
not scroll).
---
 CHANGELOG.md                                  |  1 +
 .../pages/Agent/Channels/ChannelsPanel.tsx    | 48 ++++++++++---------
 .../pages/Agent/Channels/index.module.less    | 19 ++++++++
 3 files changed, 46 insertions(+), 22 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9455df3079..776cb6f409 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,7 @@
 
 - 插件工具使用中文等非 ASCII 名称时 LLM 调用失败：主流 API 要求工具名匹配 `^[a-zA-Z0-9_-]{1,64}$`，现自动将非法名称转写为合法拼音名（`pypinyin` 缺失时退回下划线替换），冲突追加 `_2`/`_3` 后缀，并在工具描述前缀 `[原名: …]` 保留原名映射；`config_json.plugins` 配置键与插件内部仍使用原始名称，路由不受影响
 - 修复聊天页在"生成中"时于输入框持续打字导致消息列表上下轻微抖动的问题：输入框高度测量改为在离屏克隆节点上进行，不再瞬态改变页面布局
+- 修复个性化「通道」面板在页面放大后不出现纵向滚动条、被挤出的通道卡片无法查看的问题：工具栏固定、卡片网格改为内部滚动区（与技能面板一致），移动端仍整页滚动
 
 ## [0.9.24] - 2026-08-15
 
diff --git a/dashboard/src/pages/Agent/Channels/ChannelsPanel.tsx b/dashboard/src/pages/Agent/Channels/ChannelsPanel.tsx
index 9c0971f7a6..de4c6d091f 100644
--- a/dashboard/src/pages/Agent/Channels/ChannelsPanel.tsx
+++ b/dashboard/src/pages/Agent/Channels/ChannelsPanel.tsx
@@ -394,29 +394,33 @@ export default function ChannelsPanel({ agentId }: ChannelsPanelProps) {
       </div>
 
       {loading && channels.length === 0 ? (
-        <CardSkeleton count={10} />
+        <div className={styles.channelsBody}>
+          <CardSkeleton count={10} />
+        </div>
       ) : (
-        <div className={styles.channelsGrid}>
-          {CHANNEL_KEYS.map((key) => {
-            const row = channelByKind.get(key);
-            return (
-              <ChannelCard
-                key={key}
-                channelKey={key}
-                enabled={Boolean(row?.enabled)}
-                hasChannel={Boolean(row)}
-                isHover={hoverId === key}
-                enableLoading={enableLoadingKey === key}
-                testLoading={testState.loadingKey === key}
-                testResult={testState.results[key] ?? null}
-                runtime={row?.runtime}
-                onClick={() => handleCardClick(key)}
-                onMouseEnter={() => setHoverId(key)}
-                onMouseLeave={() => setHoverId(null)}
-                onToggleEnabled={handleToggleEnabled}
-              />
-            );
-          })}
+        <div className={styles.channelsBody}>
+          <div className={styles.channelsGrid}>
+            {CHANNEL_KEYS.map((key) => {
+              const row = channelByKind.get(key);
+              return (
+                <ChannelCard
+                  key={key}
+                  channelKey={key}
+                  enabled={Boolean(row?.enabled)}
+                  hasChannel={Boolean(row)}
+                  isHover={hoverId === key}
+                  enableLoading={enableLoadingKey === key}
+                  testLoading={testState.loadingKey === key}
+                  testResult={testState.results[key] ?? null}
+                  runtime={row?.runtime}
+                  onClick={() => handleCardClick(key)}
+                  onMouseEnter={() => setHoverId(key)}
+                  onMouseLeave={() => setHoverId(null)}
+                  onToggleEnabled={handleToggleEnabled}
+                />
+              );
+            })}
+          </div>
         </div>
       )}
 
diff --git a/dashboard/src/pages/Agent/Channels/index.module.less b/dashboard/src/pages/Agent/Channels/index.module.less
index 7370108cab..8f8b69e21f 100644
--- a/dashboard/src/pages/Agent/Channels/index.module.less
+++ b/dashboard/src/pages/Agent/Channels/index.module.less
@@ -10,6 +10,7 @@
   display: flex;
   flex-direction: column;
   gap: 12px;
+  flex: 1;
   min-height: 0;
 }
 
@@ -21,6 +22,24 @@
   flex-shrink: 0;
 }
 
+/* Scrollable body below the pinned toolbar (same pattern as Skills):
+   when the grid outgrows the viewport (page zoom), cards scroll instead
+   of being clipped by the fill layout's overflow:hidden. */
+.channelsBody {
+  flex: 1;
+  min-height: 0;
+  overflow: auto;
+  /* Keep card hover translateY(-2px) inside the scrollport. */
+  padding-top: 8px;
+
+  @media (max-width: 767px) {
+    flex: none;
+    min-height: 0;
+    overflow: visible;
+    padding-top: 0;
+  }
+}
+
 .channelsStats {
   color: var(--fn-text-secondary);
   font-size: 13px;