@nextclaw/ui 0.11.16 → 0.11.18

package/src/components/chat/chat-sidebar-session-item.tsx

@@ -1,7 +1,9 @@
 import type { SessionEntryView } from '@/api/types';
+import { SessionContextIconNode } from '@/components/common/session-context-icon';
 import { SessionRunBadge } from '@/components/common/SessionRunBadge';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
+import { type SessionContextView } from '@/lib/session-context.utils';
 import type { SessionRunStatus } from '@/lib/session-run-status';
 import { cn } from '@/lib/utils';
 import { formatDateTime, t } from '@/lib/i18n';
@@ -11,7 +13,7 @@ type ChatSidebarSessionItemProps = {
   session: SessionEntryView;
   active: boolean;
   runStatus?: SessionRunStatus;
-  sessionTypeLabel: string | null;
+  context: SessionContextView;
   title: string;
   isEditing: boolean;
   draftLabel: string;
@@ -28,7 +30,7 @@ export function ChatSidebarSessionItem(props: ChatSidebarSessionItemProps) {
     session,
     active,
     runStatus,
-    sessionTypeLabel,
+    context,
     title,
     isEditing,
     draftLabel,
@@ -40,6 +42,8 @@ export function ChatSidebarSessionItem(props: ChatSidebarSessionItemProps) {
     onCancel
   } = props;
 
+  const iconTone = active ? 'text-gray-700' : 'text-gray-500';
+
   return (
     <div
       className={cn(
@@ -102,7 +106,7 @@ export function ChatSidebarSessionItem(props: ChatSidebarSessionItemProps) {
             <div className="grid grid-cols-[minmax(0,1fr)_0.875rem] items-center gap-1.5 pr-8">
               <span className="flex min-w-0 items-center gap-1.5">
                 <span className="truncate font-medium">{title}</span>
-                {sessionTypeLabel ? (
+                {context.label ? (
                   <span
                     className={cn(
                       'shrink-0 rounded-full border px-1.5 py-0.5 text-[10px] font-semibold leading-none',
@@ -111,7 +115,12 @@ export function ChatSidebarSessionItem(props: ChatSidebarSessionItemProps) {
                         : 'border-gray-200 bg-gray-100 text-gray-500'
                     )}
                   >
-                    {sessionTypeLabel}
+                    {context.label}
+                  </span>
+                ) : null}
+                {context.icon ? (
+                  <span className="inline-flex h-[1.125rem] w-[1.125rem] shrink-0 items-center justify-center">
+                    <SessionContextIconNode icon={context.icon} className={iconTone} />
                   </span>
                 ) : null}
               </span>

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

@@ -57,6 +57,8 @@ function buildChatMessageTexts(language: string) {
   return {
     copyCodeLabel: t("chatCodeCopy"),
     copiedCodeLabel: t("chatCodeCopied"),
+    copyMessageLabel: t("chatMessageCopy"),
+    copiedMessageLabel: t("chatMessageCopied"),
     typingLabel: t("chatTyping"),
   };
 }

package/src/components/chat/ncp/ncp-chat-page-data.ts

@@ -2,6 +2,7 @@ import { useMemo } from 'react';
 import type { Dispatch, SetStateAction } from 'react';
 import type { SessionEntryView, ThinkingLevel } from '@/api/types';
 import type { ChatModelOption } from '@/components/chat/chat-input.types';
+import { sessionMatchesQuery } from '@/components/chat/chat-session-display';
 import { adaptNcpSessionSummaries } from '@/components/chat/ncp/ncp-session-adapter';
 import { useChatSessionTypeState } from '@/components/chat/useChatSessionTypeState';
 import {
@@ -30,11 +31,7 @@ type UseNcpChatPageDataParams = {
 };
 
 function filterSessionsByQuery(sessions: SessionEntryView[], query: string): SessionEntryView[] {
-  const normalizedQuery = query.trim().toLowerCase();
-  if (!normalizedQuery) {
-    return sessions;
-  }
-  return sessions.filter((session) => session.key.toLowerCase().includes(normalizedQuery));
+  return sessions.filter((session) => sessionMatchesQuery(session, query));
 }
 
 export function filterModelOptionsBySessionType(params: {

package/src/components/chat/ncp/ncp-session-adapter.ts

@@ -76,6 +76,25 @@ function readNcpSessionType(summary: NcpSessionSummaryView): string {
   return readOptionalString(metadata.session_type) ?? readOptionalString(metadata.sessionType) ?? 'native';
 }
 
+function parseSessionContext(sessionKey: string): { channel?: string; type?: string } {
+  if (sessionKey === 'heartbeat') {
+    return { type: 'heartbeat' };
+  }
+  if (sessionKey.startsWith('cron:')) {
+    return { type: 'cron' };
+  }
+  if (sessionKey.startsWith('agent:')) {
+    const parts = sessionKey.split(':');
+    if (parts.length >= 3) {
+      const channel = parts[2];
+      if (channel && channel !== 'main' && channel !== 'direct') {
+        return { channel };
+      }
+    }
+  }
+  return {};
+}
+
 function mapToolStatus(part: Extract<NcpMessagePart, { type: 'tool-invocation' }>): ToolInvocationStatus {
   if (part.state === 'result') {
     return ToolInvocationStatus.RESULT;
@@ -188,11 +207,13 @@ export function adaptNcpSessionSummary(summary: NcpSessionSummaryView): SessionE
   const label = readNcpSessionLabel(summary);
   const preferredModel = readNcpSessionPreferredModel(summary);
   const preferredThinking = readNcpSessionPreferredThinking(summary);
+  const context = parseSessionContext(summary.sessionId);
   return {
     key: summary.sessionId,
     createdAt: summary.updatedAt,
     updatedAt: summary.updatedAt,
     ...(label ? { label } : {}),
+    ...context,
     ...(preferredModel ? { preferredModel } : {}),
     ...(preferredThinking ? { preferredThinking } : {}),
     sessionType: readNcpSessionType(summary),

package/src/components/chat/ncp/use-ncp-session-list-view.ts

@@ -1,6 +1,7 @@
 import { useMemo } from 'react';
 import type { SessionEntryView } from '@/api/types';
 import { adaptNcpSessionSummaries } from '@/components/chat/ncp/ncp-session-adapter';
+import { sessionMatchesQuery } from '@/components/chat/chat-session-display';
 import { useChatSessionListStore } from '@/components/chat/stores/chat-session-list.store';
 import { useNcpSessions } from '@/hooks/useConfig';
 import type { SessionRunStatus } from '@/lib/session-run-status';
@@ -11,12 +12,7 @@ export type NcpSessionListItemView = {
 };
 
 function filterSessionsByQuery(sessions: readonly SessionEntryView[], query: string): SessionEntryView[] {
-  const normalizedQuery = query.trim().toLowerCase();
-  if (!normalizedQuery) {
-    return [...sessions];
-  }
-
-  return sessions.filter((session) => session.key.toLowerCase().includes(normalizedQuery));
+  return sessions.filter((session) => sessionMatchesQuery(session, query));
 }
 
 export function useNcpSessionListView(params: { limit?: number } = {}) {

package/src/components/common/session-context-icon.tsx

@@ -0,0 +1,30 @@
+import { type SessionContextIcon } from '@/lib/session-context.utils';
+import { LogoBadge } from '@/components/common/LogoBadge';
+import { getChannelLogo } from '@/lib/logos';
+import { cn } from '@/lib/utils';
+import { AlarmClock, Bot, HeartPulse } from 'lucide-react';
+
+export function SessionContextIconNode({ icon, className }: { icon: SessionContextIcon; className?: string }) {
+  if (icon.kind === 'channel-logo') {
+    return <ChannelLogoIcon channel={icon.channel} className={className} />;
+  }
+  if (icon.icon === 'heartbeat') {
+    return <HeartPulse className={cn('h-3.5 w-3.5', className)} />;
+  }
+  return <AlarmClock className={cn('h-3.5 w-3.5', className)} />;
+}
+
+function ChannelLogoIcon(
+  { channel, className }: { channel: string; className?: string }
+) {
+  const logoSrc = getChannelLogo(channel);
+  return (
+    <LogoBadge
+      name={channel}
+      src={logoSrc}
+      className={cn('h-4 w-4 rounded-[4px] border border-gray-200/80 bg-white', className)}
+      imgClassName="h-3 w-3 object-contain"
+      fallback={<Bot className="h-3 w-3 text-gray-500" />}
+    />
+  );
+}

package/src/components/config/ChannelForm.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { useConfig, useConfigMeta, useConfigSchema, useUpdateChannel, useExecuteConfigAction } from '@/hooks/useConfig';
 import { Button } from '@/components/ui/button';
 import { StatusDot } from '@/components/ui/status-dot';
@@ -13,7 +13,7 @@ import { resolveChannelTutorialUrl } from '@/lib/channel-tutorials';
 import { getChannelLogo } from '@/lib/logos';
 import { CONFIG_DETAIL_CARD_CLASS, CONFIG_EMPTY_DETAIL_CARD_CLASS } from './config-layout';
 import { ChannelFormFieldsSection } from './channel-form-fields-section';
-import { buildChannelFields } from './channel-form-fields';
+import { buildChannelFormDefinitions, type ChannelField, type ChannelFormBlock, type ChannelFormFieldSection } from './channel-form-fields';
 import { WeixinChannelAuthSection } from './weixin-channel-auth-section';
 
 type ChannelFormProps = {
@@ -50,6 +50,16 @@ function buildScopeDraft(scope: string, value: Record<string, unknown>): Record<
   return output;
 }
 
+function resolveFieldsForSection(fields: ChannelField[], section: ChannelFormFieldSection): ChannelField[] {
+  if (section === 'all') {
+    return fields;
+  }
+  if (section === 'primary') {
+    return fields.filter((field) => field.section === 'primary');
+  }
+  return fields.filter((field) => field.section !== 'primary');
+}
+
 export function ChannelForm({ channelName }: ChannelFormProps) {
   const { data: config } = useConfig();
   const { data: meta } = useConfigMeta();
@@ -62,7 +72,10 @@ export function ChannelForm({ channelName }: ChannelFormProps) {
   const [runningActionId, setRunningActionId] = useState<string | null>(null);
 
   const channelConfig = channelName ? config?.channels[channelName] : null;
-  const fields = channelName ? buildChannelFields()[channelName] ?? [] : [];
+  const channelDefinitions = useMemo(() => buildChannelFormDefinitions(), []);
+  const channelDefinition = channelName ? channelDefinitions[channelName] : undefined;
+  const fields = channelDefinition?.fields ?? [];
+  const layoutBlocks = channelDefinition?.layout ?? [{ type: 'fields', section: 'all' } satisfies ChannelFormBlock];
   const uiHints = schema?.uiHints;
   const scope = channelName ? `channels.${channelName}` : null;
   const actions = schema?.actions?.filter((action) => action.scope === scope) ?? [];
@@ -71,14 +84,12 @@ export function ChannelForm({ channelName }: ChannelFormProps) {
     : channelName;
   const channelMeta = meta?.channels.find((item) => item.name === channelName);
   const tutorialUrl = channelMeta ? resolveChannelTutorialUrl(channelMeta) : undefined;
-  const isWeixinChannel = channelName === 'weixin';
 
   useEffect(() => {
     if (channelConfig) {
       setFormData({ ...channelConfig });
       const nextDrafts: Record<string, string> = {};
-      const currentFields = channelName ? buildChannelFields()[channelName] ?? [] : [];
-      currentFields
+      fields
         .filter((field) => field.type === 'json')
         .forEach((field) => {
           const value = channelConfig[field.name];
@@ -89,7 +100,7 @@ export function ChannelForm({ channelName }: ChannelFormProps) {
       setFormData({});
       setJsonDrafts({});
     }
-  }, [channelConfig, channelName]);
+  }, [channelConfig, fields]);
 
   const updateField = (name: string, value: unknown) => {
     setFormData((prev) => ({ ...prev, [name]: value }));
@@ -193,7 +204,7 @@ export function ChannelForm({ channelName }: ChannelFormProps) {
     );
   }
 
-  const enabled = Boolean(channelConfig.enabled);
+  const enabled = typeof formData.enabled === 'boolean' ? formData.enabled : Boolean(channelConfig.enabled);
 
   return (
     <div className={CONFIG_DETAIL_CARD_CLASS}>
@@ -230,45 +241,66 @@ export function ChannelForm({ channelName }: ChannelFormProps) {
 
       <form onSubmit={handleSubmit} className="flex min-h-0 flex-1 flex-col">
         <div className="min-h-0 flex-1 space-y-6 overflow-y-auto overscroll-contain px-6 py-5">
-          {isWeixinChannel ? (
-            <>
-              <WeixinChannelAuthSection
-                channelConfig={channelConfig}
-                formData={formData}
-                disabled={updateChannel.isPending || Boolean(runningActionId)}
-              />
-              <details className="group rounded-2xl border border-gray-200/80 bg-white">
-                <summary className="flex cursor-pointer list-none items-center justify-between gap-3 px-5 py-4 text-sm font-medium text-gray-900">
-                  <div>
-                    <p>{t('weixinAuthAdvancedTitle')}</p>
-                    <p className="mt-1 text-xs font-normal text-gray-500">{t('weixinAuthAdvancedDescription')}</p>
-                  </div>
-                  <ChevronDown className="h-4 w-4 text-gray-400 transition-transform group-open:rotate-180" />
-                </summary>
-                <div className="space-y-6 border-t border-gray-100 px-5 py-5">
+          {layoutBlocks.map((block, index) => {
+            if (block.type === 'fields') {
+              const blockFields = resolveFieldsForSection(fields, block.section);
+              if (blockFields.length === 0) {
+                return null;
+              }
+              if (!block.collapsible) {
+                return (
                   <ChannelFormFieldsSection
+                    key={`${block.type}-${block.section}-${index}`}
                     channelName={channelName}
-                    fields={fields}
+                    fields={blockFields}
                     formData={formData}
                     jsonDrafts={jsonDrafts}
                     setJsonDrafts={setJsonDrafts}
                     updateField={updateField}
                     uiHints={uiHints}
                   />
-                </div>
-              </details>
-            </>
-          ) : (
-            <ChannelFormFieldsSection
-              channelName={channelName}
-              fields={fields}
-              formData={formData}
-              jsonDrafts={jsonDrafts}
-              setJsonDrafts={setJsonDrafts}
-              updateField={updateField}
-              uiHints={uiHints}
-            />
-          )}
+                );
+              }
+              return (
+                <details key={`${block.type}-${block.section}-${index}`} className="group rounded-2xl border border-gray-200/80 bg-white">
+                  <summary className="flex cursor-pointer list-none items-center justify-between gap-3 px-5 py-4 text-sm font-medium text-gray-900">
+                    <div>
+                      <p>{block.collapsible.title}</p>
+                      {block.collapsible.description ? (
+                        <p className="mt-1 text-xs font-normal text-gray-500">{block.collapsible.description}</p>
+                      ) : null}
+                    </div>
+                    <ChevronDown className="h-4 w-4 text-gray-400 transition-transform group-open:rotate-180" />
+                  </summary>
+                  <div className="space-y-6 border-t border-gray-100 px-5 py-5">
+                    <ChannelFormFieldsSection
+                      channelName={channelName}
+                      fields={blockFields}
+                      formData={formData}
+                      jsonDrafts={jsonDrafts}
+                      setJsonDrafts={setJsonDrafts}
+                      updateField={updateField}
+                      uiHints={uiHints}
+                    />
+                  </div>
+                </details>
+              );
+            }
+
+            if (block.sectionId === 'weixin-auth') {
+              return (
+                <WeixinChannelAuthSection
+                  key={`${block.type}-${block.sectionId}-${index}`}
+                  channelConfig={channelConfig}
+                  formData={formData}
+                  channelEnabled={enabled}
+                  disabled={updateChannel.isPending || Boolean(runningActionId)}
+                />
+              );
+            }
+
+            return null;
+          })}
         </div>
 
         <div className="flex flex-wrap items-center justify-between gap-3 border-t border-gray-100 px-6 py-4">

package/src/components/config/SessionsConfig.tsx

@@ -7,7 +7,7 @@ import { Input } from '@/components/ui/input';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
 import { SessionRunBadge } from '@/components/common/SessionRunBadge';
 import { adaptNcpSessionSummaries } from '@/components/chat/ncp/ncp-session-adapter';
-import { sessionDisplayName } from '@/components/chat/chat-session-display';
+import { sessionDisplayName, sessionMatchesQuery } from '@/components/chat/chat-session-display';
 import { cn } from '@/lib/utils';
 import { formatDateShort, formatDateTime, t } from '@/lib/i18n';
 import { PageLayout, PageHeader } from '@/components/layout/page-layout';
@@ -167,15 +167,11 @@ export function SessionsConfig() {
   const sessionEntries = useMemo(() => adaptNcpSessionSummaries(sessionSummaries), [sessionSummaries]);
   const sessionSummaryById = useMemo(() => new Map(sessionSummaries.map((session) => [session.sessionId, session])), [sessionSummaries]);
   const filteredSessions = useMemo(() => {
-    const normalizedQuery = query.trim().toLowerCase();
     return sessionEntries.filter((session) => {
       if (selectedChannel !== 'all' && resolveChannelFromSessionKey(session.key) !== selectedChannel) {
         return false;
       }
-      if (!normalizedQuery) {
-        return true;
-      }
-      return session.key.toLowerCase().includes(normalizedQuery) || sessionDisplayName(session).toLowerCase().includes(normalizedQuery);
+      return sessionMatchesQuery(session, query);
     });
   }, [query, selectedChannel, sessionEntries]);
   const selectedSession = useMemo(

package/src/components/config/channel-form-fields.test.ts

@@ -0,0 +1,28 @@
+import { describe, expect, it } from 'vitest';
+import { buildChannelFormDefinitions } from './channel-form-fields';
+
+describe('buildChannelFormDefinitions', () => {
+  it('keeps default channels on a single all-fields layout', () => {
+    const definitions = buildChannelFormDefinitions();
+
+    expect(definitions.telegram?.layout).toBeUndefined();
+    expect(definitions.telegram?.fields.some((field) => field.name === 'enabled')).toBe(true);
+  });
+
+  it('declares weixin layout blocks instead of relying on form-level branching', () => {
+    const definitions = buildChannelFormDefinitions();
+
+    expect(definitions.weixin?.layout).toEqual([
+      { type: 'fields', section: 'primary' },
+      { type: 'custom', sectionId: 'weixin-auth' },
+      {
+        type: 'fields',
+        section: 'advanced',
+        collapsible: {
+          title: 'Advanced settings',
+          description: 'Expand these fields only when you need to customize the API base URL, account mapping, or allowlist.'
+        }
+      }
+    ]);
+  });
+});

package/src/components/config/channel-form-fields.ts

@@ -2,7 +2,31 @@ import { t } from '@/lib/i18n';
 
 export type ChannelFieldType = 'boolean' | 'text' | 'email' | 'password' | 'number' | 'tags' | 'select' | 'json';
 export type ChannelOption = { value: string; label: string };
-export type ChannelField = { name: string; type: ChannelFieldType; label: string; options?: ChannelOption[] };
+export type ChannelField = {
+  name: string;
+  type: ChannelFieldType;
+  label: string;
+  options?: ChannelOption[];
+  section?: 'primary' | 'advanced';
+};
+export type ChannelFormFieldSection = 'all' | 'primary' | 'advanced';
+export type ChannelFormBlock =
+  | {
+    type: 'fields';
+    section: ChannelFormFieldSection;
+    collapsible?: {
+      title: string;
+      description?: string;
+    };
+  }
+  | {
+    type: 'custom';
+    sectionId: string;
+  };
+export type ChannelFormDefinition = {
+  fields: ChannelField[];
+  layout?: ChannelFormBlock[];
+};
 
 const DM_POLICY_OPTIONS: ChannelOption[] = [
   { value: 'pairing', label: 'pairing' },
@@ -24,9 +48,10 @@ const STREAMING_MODE_OPTIONS: ChannelOption[] = [
   { value: 'progress', label: 'progress' }
 ];
 
-export function buildChannelFields(): Record<string, ChannelField[]> {
+export function buildChannelFormDefinitions(): Record<string, ChannelFormDefinition> {
   return {
-    telegram: [
+    telegram: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'token', type: 'password', label: t('botToken') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') },
@@ -38,8 +63,10 @@ export function buildChannelFields(): Record<string, ChannelField[]> {
       { name: 'requireMention', type: 'boolean', label: t('requireMention') },
       { name: 'mentionPatterns', type: 'tags', label: t('mentionPatterns') },
       { name: 'groups', type: 'json', label: t('groupRulesJson') }
-    ],
-    discord: [
+      ]
+    },
+    discord: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'token', type: 'password', label: t('botToken') },
       { name: 'allowBots', type: 'boolean', label: t('allowBotMessages') },
@@ -58,13 +85,17 @@ export function buildChannelFields(): Record<string, ChannelField[]> {
       { name: 'requireMention', type: 'boolean', label: t('requireMention') },
       { name: 'mentionPatterns', type: 'tags', label: t('mentionPatterns') },
       { name: 'groups', type: 'json', label: t('groupRulesJson') }
-    ],
-    whatsapp: [
+      ]
+    },
+    whatsapp: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'bridgeUrl', type: 'text', label: t('bridgeUrl') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') }
-    ],
-    feishu: [
+      ]
+    },
+    feishu: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'appId', type: 'text', label: t('appId') },
       { name: 'appSecret', type: 'password', label: t('appSecret') },
@@ -79,14 +110,18 @@ export function buildChannelFields(): Record<string, ChannelField[]> {
       { name: 'mentionPatterns', type: 'tags', label: t('mentionPatterns') },
       { name: 'groups', type: 'json', label: t('groupRulesJson') },
       { name: 'accounts', type: 'json', label: t('accountsJson') }
-    ],
-    dingtalk: [
+      ]
+    },
+    dingtalk: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'clientId', type: 'text', label: t('clientId') },
       { name: 'clientSecret', type: 'password', label: t('clientSecret') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') }
-    ],
-    wecom: [
+      ]
+    },
+    wecom: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'corpId', type: 'text', label: t('corpId') },
       { name: 'agentId', type: 'text', label: t('agentId') },
@@ -95,24 +130,42 @@ export function buildChannelFields(): Record<string, ChannelField[]> {
       { name: 'callbackPort', type: 'number', label: t('callbackPort') },
       { name: 'callbackPath', type: 'text', label: t('callbackPath') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') }
-    ],
-    weixin: [
-      { name: 'enabled', type: 'boolean', label: t('enabled') },
-      { name: 'defaultAccountId', type: 'text', label: t('defaultAccountId') },
-      { name: 'baseUrl', type: 'text', label: t('baseUrl') },
-      { name: 'pollTimeoutMs', type: 'number', label: t('pollTimeoutMs') },
-      { name: 'allowFrom', type: 'tags', label: t('allowFrom') },
-      { name: 'accounts', type: 'json', label: t('accountsJson') }
-    ],
-    slack: [
+      ]
+    },
+    weixin: {
+      fields: [
+        { name: 'enabled', type: 'boolean', label: t('enabled'), section: 'primary' },
+        { name: 'defaultAccountId', type: 'text', label: t('defaultAccountId') },
+        { name: 'baseUrl', type: 'text', label: t('baseUrl') },
+        { name: 'pollTimeoutMs', type: 'number', label: t('pollTimeoutMs') },
+        { name: 'allowFrom', type: 'tags', label: t('allowFrom') },
+        { name: 'accounts', type: 'json', label: t('accountsJson') }
+      ],
+      layout: [
+        { type: 'fields', section: 'primary' },
+        { type: 'custom', sectionId: 'weixin-auth' },
+        {
+          type: 'fields',
+          section: 'advanced',
+          collapsible: {
+            title: t('weixinAuthAdvancedTitle'),
+            description: t('weixinAuthAdvancedDescription')
+          }
+        }
+      ]
+    },
+    slack: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'mode', type: 'text', label: t('mode') },
       { name: 'webhookPath', type: 'text', label: t('webhookPath') },
       { name: 'allowBots', type: 'boolean', label: t('allowBotMessages') },
       { name: 'botToken', type: 'password', label: t('botToken') },
       { name: 'appToken', type: 'password', label: t('appToken') }
-    ],
-    email: [
+      ]
+    },
+    email: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'consentGranted', type: 'boolean', label: t('consentGranted') },
       { name: 'imapHost', type: 'text', label: t('imapHost') },
@@ -120,20 +173,32 @@ export function buildChannelFields(): Record<string, ChannelField[]> {
       { name: 'imapUsername', type: 'text', label: t('imapUsername') },
       { name: 'imapPassword', type: 'password', label: t('imapPassword') },
       { name: 'fromAddress', type: 'email', label: t('fromAddress') }
-    ],
-    mochat: [
+      ]
+    },
+    mochat: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'baseUrl', type: 'text', label: t('baseUrl') },
       { name: 'clawToken', type: 'password', label: t('clawToken') },
       { name: 'agentUserId', type: 'text', label: t('agentUserId') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') }
-    ],
-    qq: [
+      ]
+    },
+    qq: {
+      fields: [
       { name: 'enabled', type: 'boolean', label: t('enabled') },
       { name: 'appId', type: 'text', label: t('appId') },
       { name: 'secret', type: 'password', label: t('appSecret') },
       { name: 'markdownSupport', type: 'boolean', label: t('markdownSupport') },
       { name: 'allowFrom', type: 'tags', label: t('allowFrom') }
-    ]
+      ]
+    }
   };
 }
+
+export function buildChannelFields(): Record<string, ChannelField[]> {
+  const definitions = buildChannelFormDefinitions();
+  return Object.fromEntries(
+    Object.entries(definitions).map(([channelName, definition]) => [channelName, definition.fields])
+  );
+}

package/src/components/config/weixin-channel-auth-section.test.tsx

@@ -59,6 +59,7 @@ describe('WeixinChannelAuthSection', () => {
       <WeixinChannelAuthSection
         channelConfig={{ enabled: false }}
         formData={{}}
+        channelEnabled={false}
       />
     );
 
@@ -80,6 +81,7 @@ describe('WeixinChannelAuthSection', () => {
           }
         }}
         formData={{}}
+        channelEnabled={true}
       />
     );
 
@@ -88,4 +90,28 @@ describe('WeixinChannelAuthSection', () => {
       expect(screen.getByRole('button', { name: 'Reconnect with QR' })).toBeTruthy();
     });
   });
+
+  it('shows connected-but-inactive state when account is authorized but channel is disabled', async () => {
+    render(
+      <WeixinChannelAuthSection
+        channelConfig={{
+          enabled: false,
+          defaultAccountId: 'bot-1@im.bot',
+          accounts: {
+            'bot-1@im.bot': {
+              enabled: true
+            }
+          }
+        }}
+        formData={{ enabled: false }}
+        channelEnabled={false}
+      />
+    );
+
+    expect(screen.getByText('Connected, but channel inactive')).toBeTruthy();
+    expect(
+      screen.getByText('This account is connected, but the channel is inactive. Turn on Enabled before it can send or receive messages.')
+    ).toBeTruthy();
+    expect(screen.getByRole('button', { name: 'Reconnect with QR' })).toBeTruthy();
+  });
 });