refactor(channel): redesign IM bot model from clients to connections

- Replace WebuiChannelStatus with WebuiChannelConnectionList and WebuiChannelConnection
- Add connection lifecycle states: configured, authorizing, bound, error
- Split disconnectChannel into disconnectChannelConnection and deleteChannelConnection
- Add prepareChannelConnection for creating bots before platform authorization
- Introduce connectionId as the identity key replacing name-based lookups
- Update runtime bridge surface with listConnections, prepareConnection, deleteConnection
- Add unit tests covering list, prepare, disconnect, and delete connection routes

Author: Fectivnfy112357

packages/webui/src/client/features/composer/ui/ComposerProjectRow.tsx

@@ -19,8 +19,8 @@ import { useState } from "react";
 
 import { WebuiDropdown } from "../../../ui/Dropdown.js";
 import { WebuiButton } from "../../../ui/button.js";
-import { useDialogLayer } from "../../../ui/overlay-listeners.js";
-import { WebuiPage } from "../../../ui/page.js";
+import { WebuiDialog } from "../../../ui/dialog.js";
+import { useWebuiBrowserCapabilities } from "../../../bindings/browser-capabilities.js";
 import { workspaceProjectName } from "../../../features/workspace/projection/workspace-name.public.js";
 import { WebuiWorkspaceDirectoryBrowser } from "../../../features/workspace/ui/WebuiWorkspaceDirectoryBrowser.public.js";
 import { WebuiIconCheck, WebuiIconFolder } from "../../../shell/icons.js";
@@ -45,17 +45,7 @@ export function WebuiComposerProjectRow({
   onSelectProject,
 }: WebuiComposerProjectRowProps) {
   const [browserOpen, setBrowserOpen] = useState(false);
-
-  // The directory browser is a dialog, and a dialog that floats above the
-  // composer is a layer (ADR 0028 § Overlay coordination): the coordinator
-  // answers the Escape and the press outside it, so the browser holds no
-  // listener of its own. It is active only while it is on screen.
-  const browserLayerId = useDialogLayer({
-    id: "composer-directory-browser",
-    dismissible: true,
-    onClose: () => setBrowserOpen(false),
-    active: browserOpen,
-  });
+  const { dom } = useWebuiBrowserCapabilities();
 
   return (
     <div className="webui-workspace-bar" data-webui-workspace-toolbar="true">
@@ -112,7 +102,7 @@ export function WebuiComposerProjectRow({
                     role="option"
                     aria-selected={active}
                     data-webui-workspace-recent={dir}
-                    className="webui-workspace-option webui-workspace-option--desktop"
+                    className="webui-workspace-option"
                     title={dir}
                     onClick={() => onSelectProject(dir)}
                   >
@@ -132,7 +122,7 @@ export function WebuiComposerProjectRow({
             role="option"
             aria-selected={false}
             data-webui-workspace-action="add-new"
-            className="webui-workspace-option webui-workspace-option--desktop"
+            className="webui-workspace-option"
             onClick={() => {
               onMenuOpenChange(false);
               setBrowserOpen(true);
@@ -148,7 +138,7 @@ export function WebuiComposerProjectRow({
             role="option"
             aria-selected={projectDir === undefined}
             data-webui-workspace-action="no-project"
-            className="webui-workspace-option webui-workspace-option--desktop"
+            className="webui-workspace-option"
             onClick={() => onSelectProject(undefined)}
           >
             <WebuiIconFolder className="flex-shrink-0" />
@@ -157,26 +147,29 @@ export function WebuiComposerProjectRow({
             </span>
           </WebuiButton>
         </WebuiDropdown>
-        <WebuiPage
-          as="div"
-          kind="dialog"
-          present={browserOpen}
-          motion={{ kind: "surface", state: "enter", direction: "down" }}
-          role="dialog"
-          aria-label="选择项目目录"
-          data-overlay-layer={browserLayerId}
-          data-webui-workspace-browser-dialog="true"
-          className="webui-workspace-menu webui-workspace-menu--desktop"
+        <WebuiDialog
+          id="composer-directory-browser"
+          open={browserOpen}
+          title="选择项目目录"
+          description="选择要用于新会话的工作目录"
+          width="standard"
+          portalTarget={dom.portalTarget()}
+          onClose={() => setBrowserOpen(false)}
+          dismissOnEscape
+          dismissOnBackdrop
+          testId="webui-workspace-browser-dialog"
+          dataAttributes={{ "data-webui-workspace-browser-dialog": "true" }}
+          bodyClassName="webui-workspace-browser-dialog-body"
         >
-            <WebuiWorkspaceDirectoryBrowser
-              initialDir={projectDir}
-              onSelect={(dir) => {
-                setBrowserOpen(false);
-                onSelectProject(dir);
-              }}
-              onCancel={() => setBrowserOpen(false)}
-            />
-        </WebuiPage>
+          <WebuiWorkspaceDirectoryBrowser
+            initialDir={projectDir}
+            onSelect={(dir) => {
+              setBrowserOpen(false);
+              onSelectProject(dir);
+            }}
+            onCancel={() => setBrowserOpen(false)}
+          />
+        </WebuiDialog>
       </div>
     </div>
   );

packages/webui/src/client/features/composer/ui/composer.css

@@ -550,15 +550,8 @@
     color: var(--text_default_tertiary);
     opacity: 0.55;
   }
-  /* The directory browser keeps the shared `.webui-workspace-menu` panel, which
-   * is still anchored to this row. The recent list is a dropdown now: the
-   * shared layer gives it the surface and the placement, and this says only
-   * what the list itself needs. */
-  .webui-workspace-menu {
-    right: auto;
-    left: 0;
-    min-width: 220px;
-  }
+  /* The recent list is a shared dropdown surface; this says only what its
+   * workspace rows need. The directory browser uses the shared dialog shell. */
   .webui-workspace-picker-menu {
     display: flex;
     min-width: 220px;

packages/webui/src/client/features/scheduling/ui/scheduling-editor.tsx

@@ -10,6 +10,8 @@
 // shared row cannot disagree about what the preset means.
 import { useState, type ReactElement } from "react";
 import { WebuiInline } from "../../../ui/layout-primitives.js";
+import { useWebuiBrowserCapabilities } from "../../../bindings/browser-capabilities.js";
+import { WebuiDialog } from "../../../ui/dialog.js";
 
 import type {
   WebuiCronSchedule,
@@ -28,7 +30,7 @@ import {
   type WebuiCronSchedulePreset,
 } from "../projection/scheduling-panel.js";
 import { WebuiButton } from "../../../ui/button.js";
-import { WebuiField, WebuiFormLayout, WebuiSelect, WebuiTextarea, WebuiTextInput } from "../../../ui/field.js";
+import { WebuiField, WebuiFormLayout, WebuiSelectMenu, WebuiTextarea, WebuiTextInput } from "../../../ui/field.js";
 
 export interface SchedulingEditorViewProps {
   readonly mode: "create" | "edit";
@@ -51,7 +53,8 @@ export function SchedulingEditorView(props: SchedulingEditorViewProps): ReactEle
         event.preventDefault();
         props.onSubmit();
       }}
-      className="mb-4 rounded-[8px] border border-border_default p-3"
+      id="webui-scheduling-editor-form"
+      className="flex flex-col gap-4"
     >
       <WebuiFormLayout>
         <WebuiField
@@ -100,20 +103,19 @@ export function SchedulingEditorView(props: SchedulingEditorViewProps): ReactEle
         />
         <WebuiField
           label="周期"
-          control={(props) => (
-            <WebuiSelect
-              {...props}
-              controlSize="dense"
+          control={(controlProps, field) => (
+            <WebuiSelectMenu
+              {...controlProps}
+              labelId={field.labelId}
+              className="webui-control--dense"
               data-webui-scheduling-field="preset"
+              options={(Object.keys(WEBUI_CRON_PRESET_LABELS) as WebuiCronSchedulePreset[]).map((preset) => ({
+                value: preset,
+                label: WEBUI_CRON_PRESET_LABELS[preset],
+              }))}
               value={draft.preset}
-              onChange={(event) => onChange({ preset: event.target.value as WebuiCronSchedulePreset })}
-            >
-              {(Object.keys(WEBUI_CRON_PRESET_LABELS) as WebuiCronSchedulePreset[]).map((preset) => (
-                <option key={preset} value={preset}>
-                  {WEBUI_CRON_PRESET_LABELS[preset]}
-                </option>
-              ))}
-            </WebuiSelect>
+              onChange={(value) => onChange({ preset: value as WebuiCronSchedulePreset })}
+            />
           )}
         />
         {draft.preset === "daily" || draft.preset === "weekly"
@@ -242,21 +244,6 @@ export function SchedulingEditorView(props: SchedulingEditorViewProps): ReactEle
             {props.error}
           </p>
           : null}
-        <WebuiInline gap="small" className="pt-1">
-          <WebuiButton variant="outline" size="inline" type="submit"
-            data-webui-scheduling-submit="true"
-            disabled={props.busy}
-
-          >
-            {props.mode === "create" ? "创建" : "保存"}
-          </WebuiButton>
-          <WebuiButton variant="quiet-secondary" size="inline" data-webui-scheduling-cancel="true"
-            onClick={props.onCancel}
-
-          >
-            取消
-          </WebuiButton>
-        </WebuiInline>
       </WebuiFormLayout>
     </form>
   );
@@ -265,18 +252,22 @@ export function SchedulingEditorView(props: SchedulingEditorViewProps): ReactEle
 export function SchedulingEditor(props: {
   readonly owner: WebuiSchedulingOwner;
   readonly task?: WebuiCronTask;
+  readonly open: boolean;
+  readonly seed?: Partial<WebuiCronDraft>;
   /** The agent a new task belongs to; the panel passes the client's own. */
   readonly agentName?: string;
   readonly nowMs: () => number;
   readonly onDone: () => void;
+  readonly onExitComplete: () => void;
 }): ReactElement {
+  const { dom } = useWebuiBrowserCapabilities();
   // Read once: a narrowed `props.task` inside the submit closure loses the narrowing.
   const editingTask = props.task;
   const mode = editingTask ? "edit" : "create";
   const [initialDraft] = useState<WebuiCronDraft>(() =>
     editingTask
       ? webuiCronDraftFromTask(editingTask)
-      : { ...WEBUI_CRON_EMPTY_DRAFT, agentName: props.agentName ?? "" },
+      : { ...WEBUI_CRON_EMPTY_DRAFT, agentName: props.agentName ?? "", ...(props.seed ?? {}) },
   );
   const [draft, setDraft] = useState<WebuiCronDraft>(initialDraft);
   const [error, setError] = useState<string | undefined>(undefined);
@@ -324,14 +315,41 @@ export function SchedulingEditor(props: {
   };
 
   return (
-    <SchedulingEditorView
-      mode={mode}
-      draft={draft}
-      busy={busy}
-      {...(error === undefined ? {} : { error })}
-      onChange={(patch) => setDraft((current) => ({ ...current, ...patch }))}
-      onCancel={props.onDone}
-      onSubmit={() => void submit()}
-    />
+    <WebuiDialog
+      id="webui-scheduling-editor-dialog"
+      open={props.open}
+      title={editingTask ? "编辑定时任务" : "新建定时任务"}
+      description={editingTask ? "调整任务内容和执行计划" : "设置任务指令与自动执行计划"}
+      width="wide"
+      portalTarget={dom.portalTarget()}
+      onClose={props.onDone}
+      onExitComplete={props.onExitComplete}
+      dismissOnEscape
+      dismissOnBackdrop
+      testId="webui-scheduling-editor-dialog"
+      footer={(
+        <WebuiInline gap="small">
+          <WebuiButton variant="secondary" size="dialog" type="button" data-webui-scheduling-cancel="true" onClick={props.onDone}>
+            取消
+          </WebuiButton>
+          <WebuiButton variant="primary" size="dialog" type="submit" form="webui-scheduling-editor-form"
+            data-webui-scheduling-submit="true" loading={busy}
+            loadingLabel={editingTask ? "保存中…" : "创建中…"}
+          >
+            {editingTask ? "保存" : "创建任务"}
+          </WebuiButton>
+        </WebuiInline>
+      )}
+    >
+      <SchedulingEditorView
+        mode={mode}
+        draft={draft}
+        busy={busy}
+        {...(error === undefined ? {} : { error })}
+        onChange={(patch) => setDraft((current) => ({ ...current, ...patch }))}
+        onCancel={props.onDone}
+        onSubmit={() => void submit()}
+      />
+    </WebuiDialog>
   );
 }