@nextclaw/ui 0.9.16 → 0.9.17

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

@@ -1,5 +1,6 @@
 import { useEffect, useMemo, useState } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
+import { toDataURL } from 'qrcode';
 import { Button } from '@/components/ui/button';
 import { formatDateTime, t } from '@/lib/i18n';
 import { cn } from '@/lib/utils';
@@ -51,12 +52,61 @@ export function WeixinChannelAuthSection({
   const pollChannelAuth = usePollChannelAuth();
   const [activeSession, setActiveSession] = useState<ChannelAuthStartResult | null>(null);
   const [authState, setAuthState] = useState<ChannelAuthPollResult | null>(null);
+  const [qrDataUrl, setQrDataUrl] = useState<string | null>(null);
 
   const connectedAccountIds = useMemo(() => resolveConnectedAccountIds(channelConfig), [channelConfig]);
   const primaryAccountId = connectedAccountIds[0];
   const baseUrl = resolveBaseUrl(formData, channelConfig);
   const hasConnectedAccount = connectedAccountIds.length > 0;
 
+  useEffect(() => {
+    if (!hasConnectedAccount) {
+      return;
+    }
+
+    setActiveSession(null);
+    setAuthState((prev) => {
+      if (prev?.status === 'authorized') {
+        return prev;
+      }
+      return {
+        channel: 'weixin',
+        status: 'authorized',
+        message: t('weixinAuthAuthorized'),
+        accountId: primaryAccountId ?? null
+      };
+    });
+  }, [hasConnectedAccount, primaryAccountId]);
+
+  useEffect(() => {
+    if (!activeSession) {
+      setQrDataUrl(null);
+      return;
+    }
+
+    let cancelled = false;
+
+    void toDataURL(activeSession.qrCodeUrl, {
+      errorCorrectionLevel: 'M',
+      margin: 1,
+      width: 480
+    })
+      .then((dataUrl: string) => {
+        if (!cancelled) {
+          setQrDataUrl(dataUrl);
+        }
+      })
+      .catch(() => {
+        if (!cancelled) {
+          setQrDataUrl(null);
+        }
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [activeSession]);
+
   useEffect(() => {
     if (!activeSession) {
       return;
@@ -210,7 +260,16 @@ export function WeixinChannelAuthSection({
           {activeSession ? (
             <div className="space-y-3">
               <div className="overflow-hidden rounded-2xl border border-gray-100 bg-white p-3">
-                <img src={activeSession.qrCodeUrl} alt={t('weixinAuthQrAlt')} className="mx-auto aspect-square w-full max-w-[240px] object-contain" />
+                {qrDataUrl ? (
+                  <img src={qrDataUrl} alt={t('weixinAuthQrAlt')} className="mx-auto aspect-square w-full max-w-[240px] object-contain" />
+                ) : (
+                  <div className="flex aspect-square w-full items-center justify-center rounded-xl bg-gray-50 text-gray-500">
+                    <div className="flex flex-col items-center gap-2 text-center">
+                      <Loader2 className="h-5 w-5 animate-spin" />
+                      <p className="text-xs">{t('weixinAuthStarting')}</p>
+                    </div>
+                  </div>
+                )}
               </div>
               <div className="space-y-1 text-xs text-gray-500">
                 <p>{authState?.message || activeSession.note || t('weixinAuthScanPrompt')}</p>

package/src/components/layout/Sidebar.tsx

@@ -122,147 +122,155 @@ export function Sidebar({ mode }: SidebarProps) {
   const navItems = mode === 'main' ? mainNavItems : settingsNavItems;
 
   return (
-    <aside className="w-[240px] shrink-0 flex flex-col h-full py-6 px-4 bg-secondary">
+    <aside className="w-[240px] shrink-0 flex h-full min-h-0 flex-col overflow-hidden bg-secondary px-4 py-6">
       {mode === 'settings' ? (
-        <div className="px-2 mb-6">
-          <NavLink
-            to="/chat"
-            className="group inline-flex items-center gap-2 rounded-lg border border-gray-200 bg-white px-2.5 py-1.5 text-xs font-medium text-gray-600 transition-colors hover:bg-gray-50 hover:text-gray-900"
+        <div className="shrink-0 px-2 pb-3">
+          <div
+            className="flex items-center gap-2 px-1 py-1"
+            data-testid="settings-sidebar-header"
           >
-            <ArrowLeft className="h-3.5 w-3.5 text-gray-500 group-hover:text-gray-800" />
-            <span>{t('backToMain')}</span>
-          </NavLink>
-          <div className="mt-5 px-1">
-            <div className="flex items-center gap-2.5">
-              <Settings className="h-5 w-5 text-gray-700" />
-              <h1 className="text-[28px] leading-none font-semibold tracking-[-0.02em] text-gray-900">{t('settings')}</h1>
-            </div>
+            <NavLink
+              to="/chat"
+              className="group inline-flex min-w-0 items-center gap-1.5 rounded-lg px-1 py-1 text-[12px] font-medium text-gray-500 transition-colors hover:text-gray-900"
+            >
+              <ArrowLeft className="h-3.5 w-3.5 shrink-0 text-gray-400 group-hover:text-gray-700" />
+              <span className="truncate">{t('backToMain')}</span>
+            </NavLink>
+            <span className="h-4 w-px shrink-0 bg-[#dddfe6]" aria-hidden="true" />
+            <h1 className="truncate text-[15px] font-semibold tracking-[-0.01em] text-gray-800">{t('settings')}</h1>
           </div>
         </div>
       ) : (
-        <div className="px-2 mb-8">
+        <div className="shrink-0 px-2 pb-8">
           <BrandHeader className="flex items-center gap-2.5 cursor-pointer" />
         </div>
       )}
 
-      {/* Navigation */}
-      <nav className="flex-1 flex flex-col">
-        <ul className="space-y-1">
-          {navItems.map((item) => {
-            const Icon = item.icon;
+      <div className="flex min-h-0 flex-1 flex-col">
+        {/* Navigation */}
+        <nav className="custom-scrollbar min-h-0 flex-1 overflow-y-auto pr-1">
+          <ul className="space-y-1 pb-4">
+            {navItems.map((item) => {
+              const Icon = item.icon;
 
-            return (
-              <li key={item.target}>
-                <NavLink
-                  to={item.target}
-                  className={({ isActive }) => cn(
-                    'group w-full flex items-center gap-3 px-3 py-2.5 rounded-xl text-[14px] font-medium transition-all duration-base',
-                    isActive
-                      ? 'bg-gray-200 text-gray-900 font-semibold shadow-sm'
-                      : 'text-gray-600 hover:bg-gray-200/60 hover:text-gray-900'
-                  )}
-                >
-                  {({ isActive }) => (
-                    <>
-                      <Icon className={cn(
-                        'h-[17px] w-[17px] transition-colors',
-                        isActive ? 'text-gray-900' : 'text-gray-500 group-hover:text-gray-800'
-                      )} />
-                      <span className="flex-1 text-left">{item.label}</span>
-                    </>
-                  )}
-                </NavLink>
-              </li>
+              return (
+                <li key={item.target}>
+                  <NavLink
+                    to={item.target}
+                    className={({ isActive }) =>
+                      cn(
+                        'group w-full flex items-center gap-3 rounded-xl px-3 py-2.5 text-[14px] font-medium transition-all duration-base',
+                        isActive
+                          ? 'bg-gray-200 text-gray-900 font-semibold shadow-sm'
+                          : 'text-gray-600 hover:bg-gray-200/60 hover:text-gray-900'
+                      )
+                    }
+                  >
+                    {({ isActive }) => (
+                      <>
+                        <Icon
+                          className={cn(
+                            'h-[17px] w-[17px] transition-colors',
+                            isActive ? 'text-gray-900' : 'text-gray-500 group-hover:text-gray-800'
+                          )}
+                        />
+                        <span className="flex-1 text-left">{item.label}</span>
+                      </>
+                    )}
+                  </NavLink>
+                </li>
               );
             })}
           </ul>
-      </nav>
+        </nav>
 
-      {/* Help Button */}
-      <div className="pt-3 border-t border-[#dde0ea] mt-3">
-        {mode === 'settings' ? (
-          <button
-            onClick={() => presenter.accountManager.openAccountPanel()}
-            className="mb-2 w-full rounded-xl px-3 py-2.5 text-left transition-all duration-base text-gray-600 hover:bg-[#e4e7ef] hover:text-gray-900"
-          >
-            <div className="flex items-start gap-3">
-              <KeyRound className={cn('mt-0.5 h-[17px] w-[17px]', accountConnected ? 'text-emerald-600' : 'text-gray-400')} />
-              <div className="min-w-0 flex-1">
-                <div className="flex items-center justify-between gap-3">
-                  <p className="truncate text-[14px] font-medium text-gray-900">
-                    {accountEmail || t('remoteAccountEntryManage')}
+        {/* Footer actions stay reachable while the nav scrolls independently. */}
+        <div className="mt-3 shrink-0 border-t border-[#dde0ea] bg-secondary pt-3">
+          {mode === 'settings' ? (
+            <button
+              onClick={() => presenter.accountManager.openAccountPanel()}
+              className="mb-2 w-full rounded-xl px-3 py-2.5 text-left text-gray-600 transition-all duration-base hover:bg-[#e4e7ef] hover:text-gray-900"
+              data-testid="settings-sidebar-account-entry"
+            >
+              <div className="flex items-start gap-3">
+                <KeyRound className="mt-0.5 h-[17px] w-[17px] shrink-0 text-gray-400" />
+                <div className="min-w-0 flex-1">
+                  <p className="truncate text-[14px] font-medium text-gray-600">
+                    {t('remoteAccountEntryManage')}
+                  </p>
+                  <p className="mt-1 truncate text-xs text-gray-500">
+                    {accountConnected ? accountEmail || t('remoteAccountEntryConnected') : t('remoteAccountEntryDisconnected')}
                   </p>
                 </div>
-                <p className="mt-1 truncate text-xs text-gray-500">
-                  {accountConnected ? t('remoteAccountEntryConnected') : t('remoteAccountEntryDisconnected')}
-                </p>
               </div>
+            </button>
+          ) : null}
+          {mode === 'main' && (
+            <div className="mb-2">
+              <NavLink
+                to="/settings"
+                className={({ isActive }) =>
+                  cn(
+                    'group w-full flex items-center gap-3 rounded-xl px-3 py-2.5 text-[14px] font-medium transition-all duration-base',
+                    isActive
+                      ? 'bg-gray-200 text-gray-900 font-semibold shadow-sm'
+                      : 'text-gray-600 hover:bg-[#e4e7ef] hover:text-gray-900'
+                  )
+                }
+              >
+                {({ isActive }) => (
+                  <>
+                    <Settings className={cn('h-[17px] w-[17px] transition-colors', isActive ? 'text-gray-900' : 'text-gray-500 group-hover:text-gray-800')} />
+                    <span className="flex-1 text-left">{t('settings')}</span>
+                  </>
+                )}
+              </NavLink>
             </div>
-          </button>
-        ) : null}
-        {mode === 'main' && (
+          )}
           <div className="mb-2">
-            <NavLink
-              to="/settings"
-              className={({ isActive }) => cn(
-                'group w-full flex items-center gap-3 px-3 py-2.5 rounded-xl text-[14px] font-medium transition-all duration-base',
-                isActive
-                  ? 'bg-gray-200 text-gray-900 font-semibold shadow-sm'
-                  : 'text-gray-600 hover:bg-[#e4e7ef] hover:text-gray-900'
-              )}
-            >
-              {({ isActive }) => (
-                <>
-                  <Settings className={cn('h-[17px] w-[17px] transition-colors', isActive ? 'text-gray-900' : 'text-gray-500 group-hover:text-gray-800')} />
-                  <span className="flex-1 text-left">{t('settings')}</span>
-                </>
-              )}
-            </NavLink>
+            <Select value={theme} onValueChange={(value) => handleThemeSwitch(value as UiTheme)}>
+              <SelectTrigger className="w-full h-auto rounded-xl border-0 bg-transparent px-3 py-2.5 text-[14px] font-medium text-gray-600 shadow-none hover:bg-[#e4e7ef] focus:ring-0">
+                <div className="flex min-w-0 items-center gap-3">
+                  <Palette className="h-[17px] w-[17px] text-gray-400" />
+                  <span className="text-left">{t('theme')}</span>
+                </div>
+                <span className="ml-auto text-xs text-gray-500">{currentThemeLabel}</span>
+              </SelectTrigger>
+              <SelectContent>
+                {THEME_OPTIONS.map((option) => (
+                  <SelectItem key={option.value} value={option.value} className="text-xs">
+                    {t(option.labelKey)}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
           </div>
-        )}
-        <div className="mb-2">
-          <Select value={theme} onValueChange={(value) => handleThemeSwitch(value as UiTheme)}>
-            <SelectTrigger className="w-full h-auto rounded-xl border-0 bg-transparent shadow-none px-3 py-2.5 text-[14px] font-medium text-gray-600 hover:bg-[#e4e7ef] focus:ring-0">
-              <div className="flex items-center gap-3 min-w-0">
-                <Palette className="h-[17px] w-[17px] text-gray-400" />
-                <span className="text-left">{t('theme')}</span>
-              </div>
-              <span className="ml-auto text-xs text-gray-500">{currentThemeLabel}</span>
-            </SelectTrigger>
-            <SelectContent>
-              {THEME_OPTIONS.map((option) => (
-                <SelectItem key={option.value} value={option.value} className="text-xs">
-                  {t(option.labelKey)}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
-        </div>
-        <div className="mb-2">
-          <Select value={language} onValueChange={(value) => handleLanguageSwitch(value as I18nLanguage)}>
-            <SelectTrigger className="w-full h-auto rounded-xl border-0 bg-transparent shadow-none px-3 py-2.5 text-[14px] font-medium text-gray-600 hover:bg-[#e4e7ef] focus:ring-0">
-              <div className="flex items-center gap-3 min-w-0">
-                <Languages className="h-[17px] w-[17px] text-gray-400" />
-                <span className="text-left">{t('language')}</span>
-              </div>
-              <span className="ml-auto text-xs text-gray-500">{currentLanguageLabel}</span>
-            </SelectTrigger>
-            <SelectContent>
-              {LANGUAGE_OPTIONS.map((option) => (
-                <SelectItem key={option.value} value={option.value} className="text-xs">
-                  {option.label}
-                </SelectItem>
-              ))}
-            </SelectContent>
-          </Select>
+          <div className="mb-2">
+            <Select value={language} onValueChange={(value) => handleLanguageSwitch(value as I18nLanguage)}>
+              <SelectTrigger className="w-full h-auto rounded-xl border-0 bg-transparent px-3 py-2.5 text-[14px] font-medium text-gray-600 shadow-none hover:bg-[#e4e7ef] focus:ring-0">
+                <div className="flex min-w-0 items-center gap-3">
+                  <Languages className="h-[17px] w-[17px] text-gray-400" />
+                  <span className="text-left">{t('language')}</span>
+                </div>
+                <span className="ml-auto text-xs text-gray-500">{currentLanguageLabel}</span>
+              </SelectTrigger>
+              <SelectContent>
+                {LANGUAGE_OPTIONS.map((option) => (
+                  <SelectItem key={option.value} value={option.value} className="text-xs">
+                    {option.label}
+                  </SelectItem>
+                ))}
+              </SelectContent>
+            </Select>
+          </div>
+          <button
+            onClick={() => docBrowser.open(undefined, { kind: 'docs', newTab: true, title: 'Docs' })}
+            className="flex w-full items-center gap-3 rounded-xl px-3 py-2.5 text-[14px] font-medium text-gray-600 transition-all duration-base hover:bg-[#e4e7ef] hover:text-gray-800"
+          >
+            <BookOpen className="h-[17px] w-[17px] text-gray-400" />
+            <span className="flex-1 text-left">{t('docBrowserHelp')}</span>
+          </button>
         </div>
-        <button
-          onClick={() => docBrowser.open(undefined, { kind: 'docs', newTab: true, title: 'Docs' })}
-          className="w-full flex items-center gap-3 px-3 py-2.5 rounded-xl text-[14px] font-medium transition-all duration-base text-gray-600 hover:bg-[#e4e7ef] hover:text-gray-800"
-        >
-          <BookOpen className="h-[17px] w-[17px] text-gray-400" />
-          <span className="flex-1 text-left">{t('docBrowserHelp')}</span>
-        </button>
       </div>
     </aside>
   );

package/src/components/layout/sidebar.layout.test.tsx

@@ -0,0 +1,99 @@
+import { render, screen } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
+import { describe, expect, it, vi } from 'vitest';
+import { Sidebar } from '@/components/layout/Sidebar';
+
+const mocks = vi.hoisted(() => ({
+  openAccountPanel: vi.fn(),
+  docOpen: vi.fn(),
+  remoteStatus: {
+    data: {
+      account: {
+        loggedIn: true,
+        email: 'user@example.com'
+      }
+    }
+  }
+}));
+
+vi.mock('@/components/doc-browser', () => ({
+  useDocBrowser: () => ({
+    open: mocks.docOpen
+  })
+}));
+
+vi.mock('@/presenter/app-presenter-context', () => ({
+  useAppPresenter: () => ({
+    accountManager: {
+      openAccountPanel: mocks.openAccountPanel
+    }
+  })
+}));
+
+vi.mock('@/hooks/useRemoteAccess', () => ({
+  useRemoteStatus: () => mocks.remoteStatus
+}));
+
+vi.mock('@/components/providers/I18nProvider', () => ({
+  useI18n: () => ({
+    language: 'en',
+    setLanguage: vi.fn()
+  })
+}));
+
+vi.mock('@/components/providers/ThemeProvider', () => ({
+  useTheme: () => ({
+    theme: 'warm',
+    setTheme: vi.fn()
+  })
+}));
+
+describe('Sidebar', () => {
+  it('keeps the settings sidebar bounded and lets the navigation scroll independently', () => {
+    const { container } = render(
+      <MemoryRouter initialEntries={['/model']}>
+        <Sidebar mode="settings" />
+      </MemoryRouter>
+    );
+
+    const aside = container.querySelector('aside');
+    const nav = container.querySelector('nav');
+
+    expect(aside?.className).toContain('min-h-0');
+    expect(aside?.className).toContain('overflow-hidden');
+    expect(nav?.className).toContain('flex-1');
+    expect(nav?.className).toContain('min-h-0');
+    expect(nav?.className).toContain('overflow-y-auto');
+  });
+
+  it('uses a compact single-row header for settings mode', () => {
+    render(
+      <MemoryRouter initialEntries={['/model']}>
+        <Sidebar mode="settings" />
+      </MemoryRouter>
+    );
+
+    const header = screen.getByTestId('settings-sidebar-header');
+
+    expect(header).toBeTruthy();
+    expect(screen.getByRole('heading', { name: 'Settings' })).toBeTruthy();
+    expect(screen.getByRole('link', { name: 'Back to Main' })).toBeTruthy();
+    expect(header.className).not.toContain('bg-white');
+    expect(header.className).not.toContain('rounded-2xl');
+  });
+
+  it('renders the account entry with the same neutral visual tone as other footer items', () => {
+    render(
+      <MemoryRouter initialEntries={['/model']}>
+        <Sidebar mode="settings" />
+      </MemoryRouter>
+    );
+
+    const accountEntry = screen.getByTestId('settings-sidebar-account-entry');
+
+    expect(accountEntry).toBeTruthy();
+    expect(screen.getByText('Account and Device Entry')).toBeTruthy();
+    expect(screen.getByText('user@example.com')).toBeTruthy();
+    expect(accountEntry.className).toContain('text-gray-600');
+  });
+});

package/src/qrcode.d.ts

@@ -0,0 +1,10 @@
+declare module 'qrcode' {
+  export function toDataURL(
+    text: string,
+    options?: {
+      errorCorrectionLevel?: 'L' | 'M' | 'Q' | 'H';
+      margin?: number;
+      width?: number;
+    }
+  ): Promise<string>;
+}

package/dist/assets/ChannelsList-DhM0gvDV.js

@@ -1 +0,0 @@
-import{r as A,j as t,X as se,K as ne,aq as le,b1 as re,b2 as oe,b3 as ie,a0 as ce,g as G,f as me,b4 as _,ae as de,b5 as ue,ai as H,e as k,a3 as pe,i as xe,G as be,H as ye}from"./vendor-DJt0Azq5.js";import{Z as he,t as e,c as T,I as F,S as ge,e as we,f as fe,g as je,h as ve,$ as K,B as U,n as Ae,u as z,a as J,b as Q,a0 as Ne,a1 as Ce}from"./index-CgqD0Jfg.js";import{S as W}from"./status-dot-BCUTVN2R.js";import{L as Y}from"./LogoBadge-nqabOtgk.js";import{h as D}from"./config-hints-CApS3K_7.js";import{c as Se,b as ke,a as Ie,C as Pe}from"./config-layout-BHnOoweL.js";import{L as Te}from"./label-B-TkPZRF.js";import{S as Fe}from"./switch-Bp2mda29.js";import{T as Me}from"./tabs-custom-BE8yZ2kE.js";import{P as Le,a as Ue}from"./page-layout-BTVBRo6H.js";function V(a){var o,r;const n=he();return((o=a.tutorialUrls)==null?void 0:o[n])||((r=a.tutorialUrls)==null?void 0:r.default)||a.tutorialUrl}const De={telegram:"telegram.svg",slack:"slack.svg",discord:"discord.svg",whatsapp:"whatsapp.svg",qq:"qq.svg",feishu:"feishu.svg",dingtalk:"dingtalk.svg",wecom:"wecom.svg",weixin:"weixin.svg",mochat:"mochat.svg",email:"email.svg"};function Ee(a,n){const l=n.toLowerCase(),o=a[l];return o?`/logos/${o}`:null}function X(a){return Ee(De,a)}function Oe({value:a,onChange:n,className:l,placeholder:o=""}){const[r,u]=A.useState(""),i=m=>{m.key==="Enter"&&r.trim()?(m.preventDefault(),n([...a,r.trim()]),u("")):m.key==="Backspace"&&!r&&a.length>0&&n(a.slice(0,-1))},s=m=>{n(a.filter((w,y)=>y!==m))};return t.jsxs("div",{className:T("flex flex-wrap gap-2 p-2 border rounded-md min-h-[42px]",l),children:[a.map((m,w)=>t.jsxs("span",{className:"inline-flex items-center gap-1 px-2 py-1 bg-primary text-primary-foreground rounded text-sm",children:[m,t.jsx("button",{type:"button",onClick:()=>s(w),className:"hover:text-red-300 transition-colors",children:t.jsx(se,{className:"h-3 w-3"})})]},w)),t.jsx("input",{type:"text",value:r,onChange:m=>u(m.target.value),onKeyDown:i,className:"flex-1 outline-none min-w-[100px] bg-transparent text-sm",placeholder:o||e("enterTag")})]})}function _e(a){return a.includes("token")||a.includes("secret")||a.includes("password")?t.jsx(ne,{className:"h-3.5 w-3.5 text-gray-500"}):a.includes("url")||a.includes("host")?t.jsx(le,{className:"h-3.5 w-3.5 text-gray-500"}):a.includes("email")||a.includes("mail")?t.jsx(re,{className:"h-3.5 w-3.5 text-gray-500"}):a.includes("id")||a.includes("from")?t.jsx(oe,{className:"h-3.5 w-3.5 text-gray-500"}):a==="enabled"||a==="consentGranted"?t.jsx(ie,{className:"h-3.5 w-3.5 text-gray-500"}):t.jsx(ce,{className:"h-3.5 w-3.5 text-gray-500"})}function q({channelName:a,fields:n,formData:l,jsonDrafts:o,setJsonDrafts:r,updateField:u,uiHints:i}){return t.jsx(t.Fragment,{children:n.map(s=>{const m=D(`channels.${a}.${s.name}`,i),w=(m==null?void 0:m.label)??s.label,y=m==null?void 0:m.placeholder;return t.jsxs("div",{className:"space-y-2.5",children:[t.jsxs(Te,{htmlFor:s.name,className:"flex items-center gap-2 text-sm font-medium text-gray-900",children:[_e(s.name),w]}),s.type==="boolean"&&t.jsxs("div",{className:"flex items-center justify-between rounded-xl bg-gray-50 p-3",children:[t.jsx("span",{className:"text-sm text-gray-500",children:l[s.name]?e("enabled"):e("disabled")}),t.jsx(Fe,{id:s.name,checked:l[s.name]||!1,onCheckedChange:c=>u(s.name,c),className:"data-[state=checked]:bg-emerald-500"})]}),(s.type==="text"||s.type==="email")&&t.jsx(F,{id:s.name,type:s.type,value:l[s.name]||"",onChange:c=>u(s.name,c.target.value),placeholder:y,className:"rounded-xl"}),s.type==="password"&&t.jsx(F,{id:s.name,type:"password",value:l[s.name]||"",onChange:c=>u(s.name,c.target.value),placeholder:y??e("leaveBlankToKeepUnchanged"),className:"rounded-xl"}),s.type==="number"&&t.jsx(F,{id:s.name,type:"number",value:l[s.name]||0,onChange:c=>u(s.name,parseInt(c.target.value,10)||0),placeholder:y,className:"rounded-xl"}),s.type==="tags"&&t.jsx(Oe,{value:l[s.name]||[],onChange:c=>u(s.name,c)}),s.type==="select"&&t.jsxs(ge,{value:l[s.name]||"",onValueChange:c=>u(s.name,c),children:[t.jsx(we,{className:"rounded-xl",children:t.jsx(fe,{})}),t.jsx(je,{children:(s.options??[]).map(c=>t.jsx(ve,{value:c.value,children:c.label},c.value))})]}),s.type==="json"&&t.jsx("textarea",{id:s.name,value:o[s.name]??"{}",onChange:c=>r(f=>({...f,[s.name]:c.target.value})),className:"min-h-[120px] w-full resize-none rounded-lg border border-gray-200 bg-white px-3 py-2 text-xs font-mono"})]},s.name)})})}const B=[{value:"pairing",label:"pairing"},{value:"allowlist",label:"allowlist"},{value:"open",label:"open"},{value:"disabled",label:"disabled"}],R=[{value:"open",label:"open"},{value:"allowlist",label:"allowlist"},{value:"disabled",label:"disabled"}],qe=[{value:"off",label:"off"},{value:"partial",label:"partial"},{value:"block",label:"block"},{value:"progress",label:"progress"}];function $(){return{telegram:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"token",type:"password",label:e("botToken")},{name:"allowFrom",type:"tags",label:e("allowFrom")},{name:"proxy",type:"text",label:e("proxy")},{name:"accountId",type:"text",label:e("accountId")},{name:"dmPolicy",type:"select",label:e("dmPolicy"),options:B},{name:"groupPolicy",type:"select",label:e("groupPolicy"),options:R},{name:"groupAllowFrom",type:"tags",label:e("groupAllowFrom")},{name:"requireMention",type:"boolean",label:e("requireMention")},{name:"mentionPatterns",type:"tags",label:e("mentionPatterns")},{name:"groups",type:"json",label:e("groupRulesJson")}],discord:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"token",type:"password",label:e("botToken")},{name:"allowBots",type:"boolean",label:e("allowBotMessages")},{name:"allowFrom",type:"tags",label:e("allowFrom")},{name:"gatewayUrl",type:"text",label:e("gatewayUrl")},{name:"intents",type:"number",label:e("intents")},{name:"proxy",type:"text",label:e("proxy")},{name:"mediaMaxMb",type:"number",label:e("attachmentMaxSizeMb")},{name:"streaming",type:"select",label:e("streamingMode"),options:qe},{name:"draftChunk",type:"json",label:e("draftChunkingJson")},{name:"textChunkLimit",type:"number",label:e("textChunkLimit")},{name:"accountId",type:"text",label:e("accountId")},{name:"dmPolicy",type:"select",label:e("dmPolicy"),options:B},{name:"groupPolicy",type:"select",label:e("groupPolicy"),options:R},{name:"groupAllowFrom",type:"tags",label:e("groupAllowFrom")},{name:"requireMention",type:"boolean",label:e("requireMention")},{name:"mentionPatterns",type:"tags",label:e("mentionPatterns")},{name:"groups",type:"json",label:e("groupRulesJson")}],whatsapp:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"bridgeUrl",type:"text",label:e("bridgeUrl")},{name:"allowFrom",type:"tags",label:e("allowFrom")}],feishu:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"appId",type:"text",label:e("appId")},{name:"appSecret",type:"password",label:e("appSecret")},{name:"encryptKey",type:"password",label:e("encryptKey")},{name:"verificationToken",type:"password",label:e("verificationToken")},{name:"allowFrom",type:"tags",label:e("allowFrom")}],dingtalk:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"clientId",type:"text",label:e("clientId")},{name:"clientSecret",type:"password",label:e("clientSecret")},{name:"allowFrom",type:"tags",label:e("allowFrom")}],wecom:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"corpId",type:"text",label:e("corpId")},{name:"agentId",type:"text",label:e("agentId")},{name:"secret",type:"password",label:e("secret")},{name:"token",type:"password",label:e("token")},{name:"callbackPort",type:"number",label:e("callbackPort")},{name:"callbackPath",type:"text",label:e("callbackPath")},{name:"allowFrom",type:"tags",label:e("allowFrom")}],weixin:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"defaultAccountId",type:"text",label:e("defaultAccountId")},{name:"baseUrl",type:"text",label:e("baseUrl")},{name:"pollTimeoutMs",type:"number",label:e("pollTimeoutMs")},{name:"allowFrom",type:"tags",label:e("allowFrom")},{name:"accounts",type:"json",label:e("accountsJson")}],slack:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"mode",type:"text",label:e("mode")},{name:"webhookPath",type:"text",label:e("webhookPath")},{name:"allowBots",type:"boolean",label:e("allowBotMessages")},{name:"botToken",type:"password",label:e("botToken")},{name:"appToken",type:"password",label:e("appToken")}],email:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"consentGranted",type:"boolean",label:e("consentGranted")},{name:"imapHost",type:"text",label:e("imapHost")},{name:"imapPort",type:"number",label:e("imapPort")},{name:"imapUsername",type:"text",label:e("imapUsername")},{name:"imapPassword",type:"password",label:e("imapPassword")},{name:"fromAddress",type:"email",label:e("fromAddress")}],mochat:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"baseUrl",type:"text",label:e("baseUrl")},{name:"clawToken",type:"password",label:e("clawToken")},{name:"agentUserId",type:"text",label:e("agentUserId")},{name:"allowFrom",type:"tags",label:e("allowFrom")}],qq:[{name:"enabled",type:"boolean",label:e("enabled")},{name:"appId",type:"text",label:e("appId")},{name:"secret",type:"password",label:e("appSecret")},{name:"markdownSupport",type:"boolean",label:e("markdownSupport")},{name:"allowFrom",type:"tags",label:e("allowFrom")}]}}async function Be(a,n={}){const l=await K.post(`/api/config/channels/${a}/auth/start`,n);if(!l.ok)throw new Error(l.error.message);return l.data}async function Re(a,n){const l=await K.post(`/api/config/channels/${a}/auth/poll`,n);if(!l.ok)throw new Error(l.error.message);return l.data}function $e(){return G({mutationFn:({channel:a,data:n})=>Be(a,n)})}function Ge(){return G({mutationFn:({channel:a,data:n})=>Re(a,n)})}function He(a){const n=a.accounts,l=new Set;if(typeof a.defaultAccountId=="string"&&a.defaultAccountId.trim()&&l.add(a.defaultAccountId.trim()),n&&typeof n=="object"&&!Array.isArray(n))for(const o of Object.keys(n)){const r=o.trim();r&&l.add(r)}return[...l]}function Ke(a,n){if(typeof a.baseUrl=="string"&&a.baseUrl.trim())return a.baseUrl.trim();if(typeof n.baseUrl=="string"&&n.baseUrl.trim())return n.baseUrl.trim()}function ze({channelConfig:a,formData:n,disabled:l=!1}){const o=me(),r=$e(),u=Ge(),[i,s]=A.useState(null),[m,w]=A.useState(null),y=A.useMemo(()=>He(a),[a]),c=y[0],f=Ke(n,a),j=y.length>0;A.useEffect(()=>{if(!i)return;let h=!1,N=null;const I=async()=>{try{const v=await u.mutateAsync({channel:"weixin",data:{sessionId:i.sessionId}});if(h)return;if(w(v),v.status==="authorized"){await o.invalidateQueries({queryKey:["config"]}),await o.invalidateQueries({queryKey:["config-meta"]}),k.success(v.message||e("weixinAuthAuthorized")),s(null);return}if(v.status==="expired"||v.status==="error"){k.error(v.message||e("weixinAuthRetryRequired")),s(null);return}N=setTimeout(I,v.nextPollMs??i.intervalMs)}catch(v){if(h)return;const P=v instanceof Error?v.message:String(v);k.error(`${e("error")}: ${P}`),s(null)}};return N=setTimeout(I,i.intervalMs),()=>{h=!0,N&&clearTimeout(N)}},[i,u,o]);const d=async()=>{try{const h=await r.mutateAsync({channel:"weixin",data:{baseUrl:f,accountId:typeof n.defaultAccountId=="string"&&n.defaultAccountId.trim()?n.defaultAccountId.trim():void 0}});s(h),w({channel:"weixin",status:"pending",message:h.note,nextPollMs:h.intervalMs})}catch(h){const N=h instanceof Error?h.message:String(h);k.error(`${e("error")}: ${N}`)}},b=i?(m==null?void 0:m.status)==="scanned"?e("weixinAuthScanned"):e("weixinAuthWaiting"):j?e("weixinAuthAuthorized"):e("weixinAuthNotConnected"),C=r.isPending?e("weixinAuthStarting"):i?e("weixinAuthWaiting"):j?e("weixinAuthReconnect"):e("weixinAuthConnect");return t.jsx("section",{className:"rounded-2xl border border-primary/20 bg-gradient-to-br from-primary-50/70 via-white to-emerald-50/60 p-5",children:t.jsxs("div",{className:"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between",children:[t.jsxs("div",{className:"space-y-3",children:[t.jsxs("div",{className:"inline-flex items-center gap-2 rounded-full bg-white/90 px-3 py-1 text-xs font-medium text-primary shadow-sm",children:[t.jsx(_,{className:"h-3.5 w-3.5"}),e("weixinAuthTitle")]}),t.jsxs("div",{children:[t.jsx("h4",{className:"text-base font-semibold text-gray-900",children:e("weixinAuthDescription")}),t.jsx("p",{className:"mt-1 text-sm text-gray-600",children:e("weixinAuthHint")})]}),t.jsxs("div",{className:T("inline-flex w-fit items-center gap-2 rounded-full px-3 py-1 text-xs font-medium",i?"bg-amber-50 text-amber-700":j?"bg-emerald-50 text-emerald-700":"bg-gray-100 text-gray-600"),children:[i?t.jsx(de,{className:"h-3.5 w-3.5 animate-spin"}):t.jsx(ue,{className:"h-3.5 w-3.5"}),b]}),t.jsxs("div",{className:"space-y-1 text-sm text-gray-600",children:[t.jsx("p",{children:e("weixinAuthCapabilityHint")}),c?t.jsxs("p",{children:[e("weixinAuthPrimaryAccount"),": ",t.jsx("span",{className:"font-mono text-xs text-gray-900",children:c})]}):null,y.length>1?t.jsxs("p",{children:[e("weixinAuthConnectedAccounts"),": ",t.jsx("span",{className:"font-mono text-xs text-gray-900",children:y.join(", ")})]}):null,f?t.jsxs("p",{children:[e("weixinAuthBaseUrl"),": ",t.jsx("span",{className:"font-mono text-xs text-gray-900",children:f})]}):null]}),t.jsx(U,{type:"button",onClick:d,disabled:l||r.isPending||!!i,className:"rounded-xl",children:C})]}),t.jsx("div",{className:"w-full max-w-sm rounded-2xl border border-dashed border-primary/25 bg-white/85 p-4 shadow-sm",children:i?t.jsxs("div",{className:"space-y-3",children:[t.jsx("div",{className:"overflow-hidden rounded-2xl border border-gray-100 bg-white p-3",children:t.jsx("img",{src:i.qrCodeUrl,alt:e("weixinAuthQrAlt"),className:"mx-auto aspect-square w-full max-w-[240px] object-contain"})}),t.jsxs("div",{className:"space-y-1 text-xs text-gray-500",children:[t.jsx("p",{children:(m==null?void 0:m.message)||i.note||e("weixinAuthScanPrompt")}),t.jsxs("p",{children:[e("weixinAuthExpiresAt"),": ",Ae(i.expiresAt)]})]}),t.jsxs("a",{href:i.qrCodeUrl,target:"_blank",rel:"noreferrer",className:"inline-flex items-center gap-1.5 text-xs text-primary transition-colors hover:text-primary-hover",children:[t.jsx(H,{className:"h-3.5 w-3.5"}),e("weixinAuthOpenQr")]})]}):t.jsxs("div",{className:"flex min-h-[280px] flex-col items-center justify-center rounded-2xl bg-gray-50/80 px-6 text-center",children:[t.jsx(_,{className:"h-9 w-9 text-gray-300"}),t.jsx("p",{className:"mt-3 text-sm font-medium text-gray-700",children:e("weixinAuthReadyTitle")}),t.jsx("p",{className:"mt-1 text-xs leading-5 text-gray-500",children:e("weixinAuthReadyDescription")})]})})]})})}function M(a){return typeof a=="object"&&a!==null&&!Array.isArray(a)}function Z(a,n){const l={...a};for(const[o,r]of Object.entries(n)){const u=l[o];if(M(u)&&M(r)){l[o]=Z(u,r);continue}l[o]=r}return l}function Je(a,n){const l=a.split("."),o={};let r=o;for(let u=0;u<l.length-1;u+=1){const i=l[u];r[i]={},r=r[i]}return r[l[l.length-1]]=n,o}function Qe({channelName:a}){var E,O;const{data:n}=z(),{data:l}=J(),{data:o}=Q(),r=Ne(),u=Ce(),[i,s]=A.useState({}),[m,w]=A.useState({}),[y,c]=A.useState(null),f=a?n==null?void 0:n.channels[a]:null,j=a?$()[a]??[]:[],d=o==null?void 0:o.uiHints,b=a?`channels.${a}`:null,C=((E=o==null?void 0:o.actions)==null?void 0:E.filter(p=>p.scope===b))??[],h=a&&(((O=D(`channels.${a}`,d))==null?void 0:O.label)??a),N=l==null?void 0:l.channels.find(p=>p.name===a),I=N?V(N):void 0,v=a==="weixin";A.useEffect(()=>{if(f){s({...f});const p={};(a?$()[a]??[]:[]).filter(x=>x.type==="json").forEach(x=>{const S=f[x.name];p[x.name]=JSON.stringify(S??{},null,2)}),w(p)}else s({}),w({})},[f,a]);const P=(p,g)=>{s(x=>({...x,[p]:g}))},ee=p=>{if(p.preventDefault(),!a)return;const g={...i};for(const x of j){if(x.type!=="password")continue;const S=g[x.name];(typeof S!="string"||S.length===0)&&delete g[x.name]}for(const x of j){if(x.type!=="json")continue;const S=m[x.name]??"";try{g[x.name]=S.trim()?JSON.parse(S):{}}catch{k.error(`${e("invalidJson")}: ${x.name}`);return}}r.mutate({channel:a,data:g})},te=p=>{if(!p||!a)return;const g=p.channels;if(!M(g))return;const x=g[a];M(x)&&s(S=>Z(S,x))},ae=async p=>{if(!(!a||!b)){c(p.id);try{let g={...i};p.saveBeforeRun&&(g={...g,...p.savePatch??{}},s(g),await r.mutateAsync({channel:a,data:g}));const x=await u.mutateAsync({actionId:p.id,data:{scope:b,draftConfig:Je(b,g)}});te(x.patch),x.ok?k.success(x.message||e("success")):k.error(x.message||e("error"))}catch(g){const x=g instanceof Error?g.message:String(g);k.error(`${e("error")}: ${x}`)}finally{c(null)}}};if(!a||!N||!f)return t.jsx("div",{className:Se,children:t.jsxs("div",{children:[t.jsx("h3",{className:"text-base font-semibold text-gray-900",children:e("channelsSelectTitle")}),t.jsx("p",{className:"mt-2 text-sm text-gray-500",children:e("channelsSelectDescription")})]})});const L=!!f.enabled;return t.jsxs("div",{className:ke,children:[t.jsx("div",{className:"border-b border-gray-100 px-6 py-5",children:t.jsxs("div",{className:"flex flex-wrap items-center justify-between gap-3",children:[t.jsxs("div",{className:"min-w-0",children:[t.jsxs("div",{className:"flex items-center gap-3",children:[t.jsx(Y,{name:a,src:X(a),className:T("h-9 w-9 rounded-lg border",L?"border-primary/30 bg-white":"border-gray-200/70 bg-white"),imgClassName:"h-5 w-5 object-contain",fallback:t.jsx("span",{className:"text-sm font-semibold uppercase text-gray-500",children:a[0]})}),t.jsx("h3",{className:"truncate text-lg font-semibold text-gray-900 capitalize",children:h})]}),t.jsx("p",{className:"mt-2 text-sm text-gray-500",children:e("channelsFormDescription")}),I&&t.jsxs("a",{href:I,className:"mt-2 inline-flex items-center gap-1.5 text-xs text-primary transition-colors hover:text-primary-hover",children:[t.jsx(pe,{className:"h-3.5 w-3.5"}),e("channelsGuideTitle")]})]}),t.jsx(W,{status:L?"active":"inactive",label:L?e("statusActive"):e("statusInactive")})]})}),t.jsxs("form",{onSubmit:ee,className:"flex min-h-0 flex-1 flex-col",children:[t.jsx("div",{className:"min-h-0 flex-1 space-y-6 overflow-y-auto overscroll-contain px-6 py-5",children:v?t.jsxs(t.Fragment,{children:[t.jsx(ze,{channelConfig:f,formData:i,disabled:r.isPending||!!y}),t.jsxs("details",{className:"group rounded-2xl border border-gray-200/80 bg-white",children:[t.jsxs("summary",{className:"flex cursor-pointer list-none items-center justify-between gap-3 px-5 py-4 text-sm font-medium text-gray-900",children:[t.jsxs("div",{children:[t.jsx("p",{children:e("weixinAuthAdvancedTitle")}),t.jsx("p",{className:"mt-1 text-xs font-normal text-gray-500",children:e("weixinAuthAdvancedDescription")})]}),t.jsx(xe,{className:"h-4 w-4 text-gray-400 transition-transform group-open:rotate-180"})]}),t.jsx("div",{className:"space-y-6 border-t border-gray-100 px-5 py-5",children:t.jsx(q,{channelName:a,fields:j,formData:i,jsonDrafts:m,setJsonDrafts:w,updateField:P,uiHints:d})})]})]}):t.jsx(q,{channelName:a,fields:j,formData:i,jsonDrafts:m,setJsonDrafts:w,updateField:P,uiHints:d})}),t.jsxs("div",{className:"flex flex-wrap items-center justify-between gap-3 border-t border-gray-100 px-6 py-4",children:[t.jsx("div",{className:"flex flex-wrap items-center gap-2",children:C.filter(p=>p.trigger==="manual").map(p=>t.jsx(U,{type:"button",onClick:()=>ae(p),disabled:r.isPending||!!y,variant:"secondary",children:y===p.id?e("connecting"):p.title},p.id))}),t.jsx(U,{type:"submit",disabled:r.isPending||!!y,children:r.isPending?e("saving"):e("save")})]})]})]})}const We={telegram:"channelDescTelegram",slack:"channelDescSlack",email:"channelDescEmail",webhook:"channelDescWebhook",discord:"channelDescDiscord",feishu:"channelDescFeishu",weixin:"channelDescWeixin"};function rt(){const{data:a}=z(),{data:n}=J(),{data:l}=Q(),[o,r]=A.useState("enabled"),[u,i]=A.useState(),[s,m]=A.useState(""),w=l==null?void 0:l.uiHints,y=n==null?void 0:n.channels,c=a==null?void 0:a.channels,f=[{id:"enabled",label:e("channelsTabEnabled"),count:(y??[]).filter(d=>{var b;return(b=c==null?void 0:c[d.name])==null?void 0:b.enabled}).length},{id:"all",label:e("channelsTabAll"),count:(y??[]).length}],j=A.useMemo(()=>{const d=s.trim().toLowerCase();return(y??[]).filter(b=>{var h;const C=((h=c==null?void 0:c[b.name])==null?void 0:h.enabled)||!1;return o==="enabled"?C:!0}).filter(b=>d?(b.displayName||b.name).toLowerCase().includes(d)||b.name.toLowerCase().includes(d):!0)},[o,c,y,s]);return A.useEffect(()=>{if(j.length===0){i(void 0);return}j.some(b=>b.name===u)||i(j[0].name)},[j,u]),!a||!n?t.jsx("div",{className:"p-8 text-gray-400",children:e("channelsLoading")}):t.jsxs(Le,{className:"xl:flex xl:h-full xl:min-h-0 xl:flex-col xl:pb-0",children:[t.jsx(Ue,{title:e("channelsPageTitle"),description:e("channelsPageDescription")}),t.jsxs("div",{className:T(Pe,"xl:min-h-0 xl:flex-1"),children:[t.jsxs("section",{className:Ie,children:[t.jsx("div",{className:"border-b border-gray-100 px-4 pt-4",children:t.jsx(Me,{tabs:f,activeTab:o,onChange:r,className:"mb-0"})}),t.jsx("div",{className:"border-b border-gray-100 px-4 py-3",children:t.jsxs("div",{className:"relative",children:[t.jsx(be,{className:"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400"}),t.jsx(F,{value:s,onChange:d=>m(d.target.value),placeholder:e("channelsFilterPlaceholder"),className:"h-10 rounded-xl pl-9"})]})}),t.jsxs("div",{className:"min-h-0 flex-1 space-y-2 overflow-y-auto overscroll-contain p-3",children:[j.map(d=>{const b=a.channels[d.name],C=(b==null?void 0:b.enabled)||!1,h=D(`channels.${d.name}`,w),N=V(d),I=(h==null?void 0:h.help)||e(We[d.name]||"channelDescriptionDefault"),v=u===d.name;return t.jsx("button",{type:"button",onClick:()=>i(d.name),className:T("w-full rounded-xl border p-2.5 text-left transition-all",v?"border-primary/30 bg-primary-50/40 shadow-sm":"border-gray-200/70 bg-white hover:border-gray-300 hover:bg-gray-50/70"),children:t.jsxs("div",{className:"flex items-start justify-between gap-3",children:[t.jsxs("div",{className:"flex min-w-0 items-center gap-3",children:[t.jsx(Y,{name:d.name,src:X(d.name),className:T("h-10 w-10 rounded-lg border",C?"border-primary/30 bg-white":"border-gray-200/70 bg-white"),imgClassName:"h-5 w-5 object-contain",fallback:t.jsx("span",{className:"text-sm font-semibold uppercase text-gray-500",children:d.name[0]})}),t.jsxs("div",{className:"min-w-0",children:[t.jsx("p",{className:"truncate text-sm font-semibold text-gray-900",children:d.displayName||d.name}),t.jsx("p",{className:"line-clamp-1 text-[11px] text-gray-500",children:I})]})]}),t.jsxs("div",{className:"flex items-center gap-2",children:[N&&t.jsx("a",{href:N,onClick:P=>P.stopPropagation(),className:"inline-flex h-7 w-7 items-center justify-center rounded-md text-gray-300 transition-colors hover:bg-gray-100/70 hover:text-gray-500",title:e("channelsGuideTitle"),children:t.jsx(H,{className:"h-3.5 w-3.5"})}),t.jsx(W,{status:C?"active":"inactive",label:C?e("statusActive"):e("statusInactive"),className:"min-w-[56px] justify-center"})]})]})},d.name)}),j.length===0&&t.jsxs("div",{className:"flex h-full min-h-[220px] flex-col items-center justify-center rounded-xl border border-dashed border-gray-200 bg-gray-50/70 py-10 text-center",children:[t.jsx("div",{className:"mb-3 flex h-10 w-10 items-center justify-center rounded-lg bg-white",children:t.jsx(ye,{className:"h-5 w-5 text-gray-300"})}),t.jsx("p",{className:"text-sm font-medium text-gray-700",children:e("channelsNoMatch")})]})]})]}),t.jsx(Qe,{channelName:u})]})]})}export{rt as ChannelsList};