@wowyuarm/dsh-agent-team 0.1.11 → 0.1.13

package/packages/client-agent-team/lib/types/client/TeamAgentImport.d.ts

@@ -0,0 +1,12 @@
+import type { WorkspaceId } from '@deepseek-ai/dsh-api-workspace-controller/client';
+import type { TeamSidebarProps } from './slots.ts';
+/** Selection is a Host join, not a new Agent or a copied Session. */
+export declare function TeamAgentImport({ workspaceId, loadMembers, joinWorkspace, onJoined, onPending, t }: {
+    readonly workspaceId: WorkspaceId;
+    readonly loadMembers: TeamSidebarProps['loadMembers'];
+    readonly joinWorkspace: TeamSidebarProps['joinWorkspace'];
+    readonly onJoined: () => Promise<void>;
+    readonly onPending: (pending: boolean) => void;
+    readonly t: TeamSidebarProps['t'];
+}): import("react").JSX.Element;
+//# sourceMappingURL=TeamAgentImport.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamAgentImport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TeamAgentImport.d.ts","sourceRoot":"","sources":["../../../src/client/TeamAgentImport.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAKlD,qEAAqE;AACrE,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAAE,EAAE;IACnG,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;IACtC,QAAQ,CAAC,SAAS,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9C,QAAQ,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAA;CAClC,+BA2DA"}

package/packages/client-agent-team/lib/types/client/TeamAgentImport.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Button } from '@deepseek-ai/dsh-client-ui-primitives';
+import { TeamMemberRow } from "./TeamMemberRow.js";
+import { mintRequestId } from "./requests.js";
+import css from './create.module.css';
+/** Selection is a Host join, not a new Agent or a copied Session. */
+export function TeamAgentImport({ workspaceId, loadMembers, joinWorkspace, onJoined, onPending, t }) {
+    const [members, setMembers] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState();
+    const [pending, setPending] = useState();
+    const retry = useRef();
+    const busy = useRef(false);
+    const generation = useRef(0);
+    const load = useCallback(async () => {
+        const current = ++generation.current;
+        setLoading(true);
+        setError(undefined);
+        try {
+            const result = await loadMembers({});
+            if (current !== generation.current)
+                return;
+            if (!result.ok)
+                throw new Error(result.error.message);
+            setMembers(result.value.filter(status => (status.member.state === 'enabled' || status.member.state === 'suspended') && !status.workspaceIds.includes(workspaceId)));
+        }
+        catch (cause) {
+            if (current === generation.current)
+                setError(cause instanceof Error ? cause.message : String(cause));
+        }
+        finally {
+            if (current === generation.current)
+                setLoading(false);
+        }
+    }, [loadMembers, workspaceId]);
+    useEffect(() => { void load(); return () => { generation.current++; }; }, [load]);
+    const join = async (status) => {
+        if (busy.current)
+            return;
+        busy.current = true;
+        setPending(status.member.memberId);
+        onPending(true);
+        setError(undefined);
+        const request = retry.current?.memberId === status.member.memberId ? retry.current : {
+            requestId: mintRequestId(), workspaceId, memberId: status.member.memberId,
+        };
+        retry.current = request;
+        try {
+            const result = await joinWorkspace(request);
+            if (!result.ok)
+                throw new Error(result.error.message);
+            await onJoined();
+        }
+        catch (cause) {
+            setError(cause instanceof Error ? cause.message : String(cause));
+        }
+        finally {
+            busy.current = false;
+            setPending(undefined);
+            onPending(false);
+        }
+    };
+    return _jsxs("div", { className: css.form, children: [_jsx("p", { className: css.notice, children: t('importAgentNotice') }), loading && _jsx("p", { className: css.state, role: "status", children: t('loadingAgents') }), !loading && error === undefined && members.length === 0 && _jsx("p", { className: css.state, children: t('emptyImportAgents') }), !loading && members.length > 0 && _jsx("div", { className: css.roster, children: members.map(status => _jsx(TeamMemberRow, { status: status, t: t, action: {
+                        label: pending === status.member.memberId ? t('importingAgent') : t('importAgent'),
+                        disabled: pending !== undefined,
+                        onSelect: () => { void join(status); },
+                    } }, status.member.memberId)) }), error !== undefined && _jsxs("div", { className: css.failure, role: "alert", children: [_jsx("p", { className: css.error, children: error }), _jsx(Button, { disabled: pending !== undefined, variant: "outline", onClick: () => { void load(); }, children: t('retry') })] })] });
+}

package/packages/client-agent-team/lib/types/client/TeamAgentsPanel.d.ts

@@ -9,6 +9,8 @@ interface TeamAgentsPanelProps {
     readonly updateMember: TeamSidebarProps['updateMember'];
     readonly recoverMember: TeamSidebarProps['recoverMember'];
     readonly archiveMember: TeamSidebarProps['archiveMember'];
+    readonly joinWorkspace: TeamSidebarProps['joinWorkspace'];
+    readonly leaveWorkspace: TeamSidebarProps['leaveWorkspace'];
     readonly loadModels: TeamSidebarProps['loadModels'];
     /** The Member Session currently embedded in the conversation seat, if any. */
     readonly memberSessionId?: AgentTeamClientMemberStatus['member']['sessionId'];
@@ -16,6 +18,6 @@ interface TeamAgentsPanelProps {
     readonly onCreatingChange: (request: AgentTeamAddMemberRequest, creating: boolean) => void;
     readonly t: TeamSidebarProps['t'];
 }
-export declare function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, addMember, updateMember, recoverMember, archiveMember, loadModels, memberSessionId, openMemberSession, onCreatingChange, t }: TeamAgentsPanelProps): import("react").JSX.Element;
+export declare function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, addMember, updateMember, recoverMember, archiveMember, joinWorkspace, leaveWorkspace, loadModels, memberSessionId, openMemberSession, onCreatingChange, t }: TeamAgentsPanelProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=TeamAgentsPanel.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamAgentsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamAgentsPanel.d.ts","sourceRoot":"","sources":["../../../src/client/TeamAgentsPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EACzB,2BAA2B,EAE5B,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAalD,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;IAC/D,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACjD,QAAQ,CAAC,YAAY,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACvD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAA;IACnD,8EAA8E;IAC9E,QAAQ,CAAC,eAAe,CAAC,EAAE,2BAA2B,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,CAAA;IAC7E,QAAQ,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,mBAAmB,CAAC,CAAA;IACjE,QAAQ,CAAC,gBAAgB,EAAE,CAAC,OAAO,EAAE,yBAAyB,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC1F,QAAQ,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAA;CAClC;AAED,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,SAAS,EAAE,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,UAAU,EAAE,eAAe,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,CAAC,EAAE,EAAE,oBAAoB,+BAwO/N"}
+{"version":3,"file":"TeamAgentsPanel.d.ts","sourceRoot":"","sources":["../../../src/client/TeamAgentsPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EACzB,2BAA2B,EAE5B,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAclD,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;IAC/D,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAA;IACjD,QAAQ,CAAC,YAAY,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACvD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,cAAc,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;IAC3D,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAA;IACnD,8EAA8E;IAC9E,QAAQ,CAAC,eAAe,CAAC,EAAE,2BAA2B,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAC,CAAA;IAC7E,QAAQ,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,mBAAmB,CAAC,CAAA;IACjE,QAAQ,CAAC,gBAAgB,EAAE,CAAC,OAAO,EAAE,yBAAyB,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC1F,QAAQ,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAA;CAClC;AAED,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,SAAS,EAAE,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAAE,eAAe,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,CAAC,EAAE,EAAE,oBAAoB,+BA2O9P"}

package/packages/client-agent-team/lib/types/client/TeamAgentsPanel.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Button, IconArchiveOutline20, IconEditOutline16, IconPlayOutline16, IconPlusOutline16, IconRefreshOutline16, Input, Modal, Tooltip } from '@deepseek-ai/dsh-client-ui-primitives';
-import { TeamMemberAvatar } from "./TeamMemberAvatar.js";
+import { TeamMemberIdentity } from "./TeamMemberRow.js";
 import { SortableRow, useSidebarRowDrag } from "./sidebar-drag.js";
 import { moveSidebarItem, useSidebarOrder } from "./sidebar-order.js";
 import { useSidebarSectionOpen, setSidebarSectionOpen } from "./sidebar-sections.js";
@@ -10,13 +10,15 @@ import { diagnosticText, restartOffered } from "./TeamPresenceDot.js";
 import { TeamRowMenu } from "./TeamRowMenu.js";
 import { TeamSidebarSection } from "./TeamSidebarSection.js";
 import { AgentEditorDialog, ModelPickerField, sameModel } from "./TeamMemberEditor.js";
+import { TeamAgentImport } from "./TeamAgentImport.js";
 import createCss from './create.module.css';
 import css from './sidebar.module.css';
-export function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, addMember, updateMember, recoverMember, archiveMember, loadModels, memberSessionId, openMemberSession, onCreatingChange, t }) {
+export function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, addMember, updateMember, recoverMember, archiveMember, joinWorkspace, leaveWorkspace, loadModels, memberSessionId, openMemberSession, onCreatingChange, t }) {
     const [members, setMembers] = useState([]);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState();
     const [formOpen, setFormOpen] = useState(false);
+    const [importing, setImporting] = useState(false);
     const [handle, setHandle] = useState('');
     const [description, setDescription] = useState('');
     const [model, setModel] = useState(undefined);
@@ -142,11 +144,10 @@ export function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, ad
         try {
             const result = await addMember(request);
             if (result.ok) {
+                const committed = { ...result.value.status, workspaceIds: [result.value.status.member.workspaceId] };
                 setMembers(current => {
-                    const retained = current.filter(status => status.member.memberId !== result.value.status.member.memberId);
-                    return result.value.status.member.state === 'inactive' || result.value.status.member.state === 'archived'
-                        ? retained
-                        : [...retained, result.value.status];
+                    const retained = current.filter(status => status.member.memberId !== committed.member.memberId);
+                    return committed.member.state === 'inactive' || committed.member.state === 'archived' ? retained : [...retained, committed];
                 });
                 setHandle('');
                 setDescription('');
@@ -195,18 +196,21 @@ export function TeamAgentsPanel({ workspaceId, loadMembers, subscribeChanges, ad
             ...(model === undefined ? {} : { model }),
         });
     };
-    return (_jsxs("div", { className: css.panel, children: [_jsx(Modal, { open: formOpen, onClose: closeForm, title: t('addAgent'), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: creating, onClick: closeForm, children: t('cancel') }), _jsx(Button, { type: "submit", form: "team-agent-create-form", variant: "primary", disabled: creating || handle.trim().length === 0, children: creating ? t('creatingAgent') : t('createAgent') })] }), children: _jsxs("form", { id: "team-agent-create-form", className: createCss.form, onSubmit: submit, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('agentName') }), _jsx(Input, { className: createCss.input, value: handle, onChange: event => { setHandle(event.target.value); setRetryRequest(undefined); }, disabled: creating, autoFocus: true })] }), _jsxs("label", { className: createCss.field, children: [_jsxs("span", { children: [t('agentDescription'), t('optionalSuffix')] }), _jsx(Input, { className: createCss.input, value: description, placeholder: t('agentDescriptionPlaceholder'), onChange: event => { setDescription(event.target.value); setRetryRequest(undefined); }, disabled: creating })] }), _jsx(ModelPickerField, { model: model, onModelChange: choice => { setModel(choice); setRetryRequest(undefined); }, loadModels: loadModels, disabled: creating, t: t }), formOpen && error !== undefined && _jsx("p", { className: createCss.error, role: "alert", children: error })] }) }), _jsxs(TeamSidebarSection, { title: t('agents'), open: sectionOpen, onToggle: open => { setSidebarSectionOpen(workspaceId, 'agents', open); }, actions: (_jsx(Tooltip, { label: t('addAgent'), delayMs: 500, children: _jsx("button", { ref: triggerRef, type: "button", className: css.iconButton, "aria-label": t('addAgent'), onClick: () => { setError(undefined); setFormOpen(true); }, children: _jsx(IconPlusOutline16, { size: 14 }) }) })), children: [loading && members.length === 0 && _jsx("p", { className: css.emptyState, children: t('loadingAgents') }), !loading && members.length === 0 && _jsx("p", { className: css.emptyState, children: t('emptyAgents') }), _jsx("div", { className: css.agentList, children: orderedMembers.map(status => (_jsx(SortableRow, { drag: drag, orderKey: status.member.memberId, children: _jsx(AgentRow, { status: status, ...(memberSessionId === undefined ? {} : { current: status.member.sessionId === memberSessionId }), updateMember: updateMember, recoverMember: recoverMember, archiveMember: archiveMember, loadModels: loadModels, openMemberSession: openMemberSession, onUpdated: () => { void refresh(); }, t: t }) }, status.member.memberId))) })] }), !formOpen && error !== undefined && (_jsxs("div", { className: css.retryError, role: "alert", children: [_jsx("span", { children: error }), retryRequest !== undefined && _jsx("button", { type: "button", className: css.textButton, disabled: creating, onClick: () => { setFormOpen(true); }, children: t('retry') })] }))] }));
+    return (_jsxs("div", { className: css.panel, children: [_jsxs(Modal, { open: formOpen, onClose: closeForm, title: t('addAgent'), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: creating, onClick: closeForm, children: t('cancel') }), !importing && _jsx(Button, { type: "submit", form: "team-agent-create-form", variant: "primary", disabled: creating || handle.trim().length === 0, children: creating ? t('creatingAgent') : t('createAgent') })] }), children: [_jsx(Button, { className: createCss.modeSwitch, variant: "outline", disabled: creating, "aria-expanded": importing, onClick: () => { setImporting(value => !value); setError(undefined); }, children: importing ? t('createAgent') : t('importAgentTitle') }), formOpen && importing ? _jsx(TeamAgentImport, { workspaceId: workspaceId, loadMembers: loadMembers, joinWorkspace: joinWorkspace, onPending: setCreating, onJoined: async () => { await refresh(); setFormOpen(false); queueMicrotask(() => { triggerRef.current?.focus(); }); }, t: t }) : _jsxs("form", { id: "team-agent-create-form", className: createCss.form, onSubmit: submit, children: [_jsxs("label", { className: createCss.field, children: [_jsx("span", { children: t('agentName') }), _jsx(Input, { className: createCss.input, value: handle, onChange: event => { setHandle(event.target.value); setRetryRequest(undefined); }, disabled: creating, autoFocus: true })] }), _jsxs("label", { className: createCss.field, children: [_jsxs("span", { children: [t('agentDescription'), t('optionalSuffix')] }), _jsx(Input, { className: createCss.input, value: description, placeholder: t('agentDescriptionPlaceholder'), onChange: event => { setDescription(event.target.value); setRetryRequest(undefined); }, disabled: creating })] }), _jsx(ModelPickerField, { model: model, onModelChange: choice => { setModel(choice); setRetryRequest(undefined); }, loadModels: loadModels, disabled: creating, t: t }), formOpen && error !== undefined && _jsx("p", { className: createCss.error, role: "alert", children: error })] })] }), _jsxs(TeamSidebarSection, { title: t('agents'), open: sectionOpen, onToggle: open => { setSidebarSectionOpen(workspaceId, 'agents', open); }, actions: (_jsx(Tooltip, { label: t('addAgent'), delayMs: 500, children: _jsx("button", { ref: triggerRef, type: "button", className: css.iconButton, "aria-label": t('addAgent'), onClick: () => { setError(undefined); setImporting(false); setFormOpen(true); }, children: _jsx(IconPlusOutline16, { size: 14 }) }) })), children: [loading && members.length === 0 && _jsx("p", { className: css.emptyState, children: t('loadingAgents') }), !loading && error === undefined && members.length === 0 && _jsx("p", { className: css.emptyState, children: t('emptyAgents') }), _jsx("div", { className: css.agentList, children: orderedMembers.map(status => (_jsx(SortableRow, { drag: drag, orderKey: status.member.memberId, children: _jsx(AgentRow, { workspaceId: workspaceId, leaveWorkspace: leaveWorkspace, status: status, ...(memberSessionId === undefined ? {} : { current: status.member.sessionId === memberSessionId }), updateMember: updateMember, recoverMember: recoverMember, archiveMember: archiveMember, loadModels: loadModels, openMemberSession: openMemberSession, onUpdated: refresh, t: t }) }, status.member.memberId))) })] }), !formOpen && error !== undefined && (_jsxs("div", { className: css.retryError, role: "alert", children: [_jsx("span", { children: error }), retryRequest !== undefined && _jsx("button", { type: "button", className: css.textButton, disabled: creating, onClick: () => { setFormOpen(true); }, children: t('retry') })] }))] }));
 }
 /**
  * One sidebar Agent row: the select button opens the Member's own Session
  * conversation page, the avatar carries identity plus the presence badge, and
  * the row menu opens the editor.
  */
-function AgentRow({ status, current, updateMember, recoverMember, archiveMember, loadModels, openMemberSession, onUpdated, t }) {
+function AgentRow({ workspaceId, leaveWorkspace, status, current, updateMember, recoverMember, archiveMember, loadModels, openMemberSession, onUpdated, t }) {
     const [menuOpen, setMenuOpen] = useState(false);
     const [editing, setEditing] = useState(false);
     const [archiving, setArchiving] = useState(false);
     const [rowAlert, setRowAlert] = useState();
+    const [archivePending, setArchivePending] = useState(false);
+    const archiveRequest = useRef();
+    const withdrawing = workspaceId !== status.member.workspaceId;
     // Both row actions ride the same runtime remote: the Host steers a live
     // session, rebuilds an orphaned composition, or re-runs a failed activation.
     const recover = async () => {
@@ -241,25 +245,32 @@ function AgentRow({ status, current, updateMember, recoverMember, archiveMember,
         }
     };
     const archive = async () => {
+        if (archivePending)
+            return;
+        setArchivePending(true);
+        setRowAlert(undefined);
+        archiveRequest.current ??= mintRequestId();
+        const request = { requestId: archiveRequest.current, memberId: status.member.memberId };
         try {
-            const result = await archiveMember({
-                requestId: mintRequestId(),
-                memberId: status.member.memberId,
-            });
+            const result = withdrawing ? await leaveWorkspace({ ...request, workspaceId }) : await archiveMember(request);
+            if (!result.ok)
+                throw new Error(result.error.message);
+            setArchiving(false);
+            archiveRequest.current = undefined;
             await onUpdated();
-            if (!result.ok) {
-                setRowAlert(t('archiveAgentFailed', { message: result.error.message }));
-            }
         }
         catch (cause) {
-            setRowAlert(t('archiveAgentFailed', { message: cause instanceof Error ? cause.message : String(cause) }));
+            setRowAlert(cause instanceof Error ? cause.message : String(cause));
+        }
+        finally {
+            setArchivePending(false);
         }
     };
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: css.agentRow, "data-menu-open": menuOpen || undefined, children: [_jsxs("button", { type: "button", className: css.agentSelect, "aria-label": t('openAgentSession', { name: status.member.handle }), "aria-current": current ? 'page' : undefined, disabled: status.availability !== 'active', onClick: () => { openMemberSession(status.member.sessionId); }, children: [_jsx(TeamMemberAvatar, { status: status, t: t }), _jsxs("span", { className: css.agentCopy, children: [_jsx("strong", { children: status.member.handle }), _jsx("small", { children: status.member.description })] })] }), _jsx("span", { className: css.rowMenu, children: _jsx(TeamRowMenu, { label: t('actionsAgent', { name: status.member.handle }), items: [
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: css.agentRow, "data-agent-row": true, "data-menu-open": menuOpen || undefined, children: [_jsx("button", { type: "button", className: css.agentSelect, "aria-label": t('openAgentSession', { name: status.member.handle }), "aria-current": current ? 'page' : undefined, disabled: status.availability !== 'active', onClick: () => { openMemberSession(status.member.sessionId); }, children: _jsx(TeamMemberIdentity, { status: status, name: status.member.handle.replace(/^@/, ''), className: css.agentCopy, t: t }) }), _jsx("span", { className: css.rowMenu, children: _jsx(TeamRowMenu, { label: t('actionsAgent', { name: status.member.handle }), items: [
                                 { id: 'edit', label: t('editAgent'), icon: _jsx(IconEditOutline16, {}) },
                                 ...(status.presence === 'error' ? [{ id: 'resume', label: t('resumeAgent'), icon: _jsx(IconPlayOutline16, {}) }] : []),
                                 ...(status.availability === 'unavailable' && restartOffered(status) ? [{ id: 'restart', label: t('restartAgent'), icon: _jsx(IconRefreshOutline16, {}) }] : []),
-                                { id: 'archive', label: t('archiveAgent'), icon: _jsx(IconArchiveOutline20, { size: 16 }), danger: true },
+                                { id: 'archive', label: t(withdrawing ? 'withdrawAgent' : 'archiveAgent'), icon: _jsx(IconArchiveOutline20, { size: 16 }), danger: true },
                             ], onSelect: (id) => {
                                 if (id === 'edit')
                                     setEditing(true);
@@ -267,5 +278,6 @@ function AgentRow({ status, current, updateMember, recoverMember, archiveMember,
                                     setArchiving(true);
                                 else
                                     void recover();
-                            }, onOpenChange: setMenuOpen }) })] }), rowAlert !== undefined && _jsx("div", { className: css.rowAlert, role: "alert", children: rowAlert }), archiving && (_jsx(Modal, { open: true, onClose: () => { setArchiving(false); }, title: t('archiveAgentTitle', { name: status.member.handle }), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => { setArchiving(false); }, children: t('cancel') }), _jsx(Button, { variant: "primary", onClick: () => { setArchiving(false); void archive(); }, children: t('archiveAgentConfirm') })] }), children: _jsx("p", { className: createCss.error, children: t('archiveAgentNotice', { name: status.member.handle }) }) })), editing && (_jsx(AgentEditorDialog, { status: status, updateMember: updateMember, loadModels: loadModels, onCommitted: onUpdated, onClose: () => { setEditing(false); }, t: t }))] }));
+                            }, onOpenChange: setMenuOpen }) })] }), !archiving && rowAlert !== undefined && _jsx("div", { className: css.rowAlert, role: "alert", children: rowAlert }), archiving && (_jsxs(Modal, { open: true, onClose: () => { if (!archivePending)
+                    setArchiving(false); }, title: t(withdrawing ? 'withdrawAgentTitle' : 'archiveAgentTitle', { name: status.member.handle }), closeLabel: t('close'), contentClassName: createCss.dialogContent, footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: archivePending, onClick: () => { setArchiving(false); }, children: t('cancel') }), _jsx(Button, { variant: "primary", disabled: archivePending, onClick: () => { void archive(); }, children: t(withdrawing ? 'withdrawAgent' : 'archiveAgentConfirm') })] }), children: [_jsx("p", { className: createCss.error, children: t(withdrawing ? 'withdrawAgentNotice' : 'archiveAgentNotice', { name: status.member.handle }) }), !withdrawing && status.workspaceIds.length > 1 && _jsx("p", { children: t('archiveOtherWorkspaces', { count: status.workspaceIds.length - 1 }) }), rowAlert !== undefined && _jsx("p", { className: createCss.error, role: "alert", children: rowAlert })] })), editing && (_jsx(AgentEditorDialog, { status: status, updateMember: updateMember, loadModels: loadModels, onCommitted: onUpdated, onClose: () => { setEditing(false); }, t: t }))] }));
 }

package/packages/client-agent-team/lib/types/client/TeamAvatarStack.d.ts

@@ -0,0 +1,18 @@
+import type { AgentTeamMemberId } from '@wowyuarm/dsh-agent-team/types';
+/** One owner as the stack draws it: the id carries the hue, the name the initial. */
+export interface TeamAvatarOwner {
+    readonly memberId: AgentTeamMemberId;
+    /** Public handle, or the raw Member id when the roster no longer names them. */
+    readonly name: string;
+}
+/**
+ * The compact "who is on this work" stack: overlapping 18px Member circles in
+ * the shared identity language, capped at three plus a `+N` chip. The circles
+ * are presentational, so the stack is one `role="img"` whose label carries the
+ * whole roster — three anonymous initials would read as noise.
+ */
+export declare function TeamAvatarStack({ owners, label }: {
+    readonly owners: readonly TeamAvatarOwner[];
+    readonly label: string;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=TeamAvatarStack.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamAvatarStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TeamAvatarStack.d.ts","sourceRoot":"","sources":["../../../src/client/TeamAvatarStack.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAOvE,qFAAqF;AACrF,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,gFAAgF;IAChF,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE;IACjD,QAAQ,CAAC,MAAM,EAAE,SAAS,eAAe,EAAE,CAAA;IAC3C,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CACvB,sCAQA"}

package/packages/client-agent-team/lib/types/client/TeamAvatarStack.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memberHue } from "./team-formatters.js";
+import css from './avatar-stack.module.css';
+/** Distinct owners past this count collapse into one `+N` chip. */
+const MAX_VISIBLE = 3;
+/**
+ * The compact "who is on this work" stack: overlapping 18px Member circles in
+ * the shared identity language, capped at three plus a `+N` chip. The circles
+ * are presentational, so the stack is one `role="img"` whose label carries the
+ * whole roster — three anonymous initials would read as noise.
+ */
+export function TeamAvatarStack({ owners, label }) {
+    if (owners.length === 0)
+        return null;
+    const shown = owners.slice(0, MAX_VISIBLE);
+    const overflow = owners.length - shown.length;
+    return _jsxs("span", { className: css.stack, role: "img", "aria-label": label, children: [shown.map(owner => _jsx("span", { className: css.avatar, style: { '--team-avatar-hue': memberHue(owner.memberId) }, children: initial(owner.name) }, owner.memberId)), overflow > 0 && _jsx("span", { className: css.overflow, children: `+${overflow}` })] });
+}
+/** First visible character of a handle — and of a raw Member id when that is all there is. */
+function initial(name) {
+    return name.replace(/^@/, '').replace(/^member:/, '').slice(0, 1).toUpperCase();
+}

package/packages/client-agent-team/lib/types/client/TeamChannelPage.d.ts

@@ -8,6 +8,8 @@ interface TeamChannelPageProps {
     readonly loadChannels: TeamConversationProps['loadChannels'];
     readonly subscribeChanges: TeamConversationProps['subscribeChanges'];
     readonly loadMembers: TeamConversationProps['loadMembers'];
+    /** The Human's own unread per Thread: the Host's three-class judgement, never a Client guess. */
+    readonly loadInbox: TeamConversationProps['loadInbox'];
     readonly drafts: TeamDraftStore;
     readonly getAttachment: TeamConversationProps['getAttachment'];
     readonly putAttachment: TeamConversationProps['putAttachment'];
@@ -20,6 +22,6 @@ interface TeamChannelPageProps {
     readonly backToChannels: TeamConversationProps['backToChannels'];
     readonly t: TeamConversationProps['t'];
 }
-export declare function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscribeChanges, loadMembers, drafts, putAttachment, getAttachment, sendMessage, joinChannel, removeChannelMember, selectThread, selectChannel, backToChannels, resolveTaskRefs, t }: TeamChannelPageProps): import("react").JSX.Element;
+export declare function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscribeChanges, loadMembers, loadInbox, drafts, putAttachment, getAttachment, sendMessage, joinChannel, removeChannelMember, selectThread, selectChannel, backToChannels, resolveTaskRefs, t }: TeamChannelPageProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=TeamChannelPage.d.ts.map

package/packages/client-agent-team/lib/types/client/TeamChannelPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamChannelPage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamChannelPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA+B,mBAAmB,EAE7D,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAEvD,OAAO,KAAK,EAAgB,cAAc,EAAE,MAAM,aAAa,CAAA;AAe/D,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,UAAU,EAAE,mBAAmB,CAAA;IACxC,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAA;IACpE,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAA;IAC/B,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,mBAAmB,EAAE,qBAAqB,CAAC,qBAAqB,CAAC,CAAA;IAC1E,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClE,QAAQ,CAAC,cAAc,EAAE,qBAAqB,CAAC,gBAAgB,CAAC,CAAA;IAChE,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC;AAmBD,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,mBAAmB,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC,EAAE,EAAE,oBAAoB,+BA4VnR"}
+{"version":3,"file":"TeamChannelPage.d.ts","sourceRoot":"","sources":["../../../src/client/TeamChannelPage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA+B,mBAAmB,EAE7D,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAEvD,OAAO,KAAK,EAAgB,cAAc,EAAE,MAAM,aAAa,CAAA;AAiB/D,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,UAAU,EAAE,mBAAmB,CAAA;IACxC,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAA;IACpE,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,iGAAiG;IACjG,QAAQ,CAAC,SAAS,EAAE,qBAAqB,CAAC,WAAW,CAAC,CAAA;IACtD,QAAQ,CAAC,MAAM,EAAE,cAAc,CAAA;IAC/B,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,WAAW,EAAE,qBAAqB,CAAC,aAAa,CAAC,CAAA;IAC1D,QAAQ,CAAC,mBAAmB,EAAE,qBAAqB,CAAC,qBAAqB,CAAC,CAAA;IAC1E,QAAQ,CAAC,YAAY,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAA;IAC5D,QAAQ,CAAC,aAAa,EAAE,qBAAqB,CAAC,eAAe,CAAC,CAAA;IAC9D,QAAQ,CAAC,eAAe,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IAClE,QAAQ,CAAC,cAAc,EAAE,qBAAqB,CAAC,gBAAgB,CAAC,CAAA;IAChE,QAAQ,CAAC,CAAC,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAA;CACvC;AAoCD,wBAAgB,eAAe,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,mBAAmB,EAAE,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC,EAAE,EAAE,oBAAoB,+BAgX9R"}

package/packages/client-agent-team/lib/types/client/TeamChannelPage.js

@@ -3,10 +3,12 @@ import { Fragment, useCallback, useEffect, useRef, useState } from 'react';
 import { Button, IconChevronLeftOutline14, IconChevronRightOutline14, Modal } from '@deepseek-ai/dsh-client-ui-primitives';
 import { mintRequestId, uploadComposerFiles } from "./requests.js";
 import { TeamComposer } from "./TeamComposer.js";
-import { TeamPresenceDot } from "./TeamPresenceDot.js";
+import { TeamMemberRow } from "./TeamMemberRow.js";
 import { TeamMessage } from "./TeamMessage.js";
+import { TeamAvatarStack } from "./TeamAvatarStack.js";
+import { TeamCountBadge } from "./TeamCountBadge.js";
 import { TeamRunDivider } from "./TeamRunDivider.js";
-import { formatTaskStatus, taskStatusDot, mentionNamesOf } from "./team-formatters.js";
+import { claimersLabel, formatAbsoluteTime, formatInboxTime, formatTaskStatus, taskStatusDot, mentionNamesOf } from "./team-formatters.js";
 import { TeamStateDot } from "./TeamStateDot.js";
 import { useChannelMembership } from "./team-membership.js";
 import { useTimelineScroll } from "./timeline-scroll.js";
@@ -16,12 +18,14 @@ import channelCss from './channel.module.css';
 import css from './conversation.module.css';
 import threadCss from './thread.module.css';
 /**
- * Merge the freshest top-level window over what the reader already has:
- * a change-driven refresh must not discard older messages loaded earlier.
+ * Merge the freshest top-level window over what the reader already has. The
+ * fresh window is authoritative for every Message it covers — a change wake
+ * must move that row's live Task state, newest instant, and unread with it —
+ * while older Messages loaded earlier are retained instead of discarded.
  */
 function mergeChannelView(current, fresh) {
-    const known = new Set(current.items.map(item => item.message.messageRef));
-    const items = [...fresh.items.filter(item => !known.has(item.message.messageRef)), ...current.items]
+    const freshRefs = new Set(fresh.items.map(item => item.message.messageRef));
+    const items = [...current.items.filter(item => !freshRefs.has(item.message.messageRef)), ...fresh.items]
         .sort((left, right) => left.message.sequence - right.message.sequence);
     return {
         ...fresh,
@@ -31,10 +35,26 @@ function mergeChannelView(current, fresh) {
         hasMore: fresh.hasMore || current.cursor < fresh.cursor,
     };
 }
-export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscribeChanges, loadMembers, drafts, putAttachment, getAttachment, sendMessage, joinChannel, removeChannelMember, selectThread, selectChannel, backToChannels, resolveTaskRefs, t }) {
+/**
+ * The newest fact instant, or nothing when the entry's own Message is still the
+ * newest fact on its Thread. That difference is exactly what "has follow-up
+ * activity" means, and the Host projects both instants from the ledger.
+ */
+function followUpAt(item) {
+    const lastActivityAt = item.lastActivityAt;
+    return lastActivityAt === undefined || lastActivityAt === item.message.occurredAt ? undefined : lastActivityAt;
+}
+/** Host unread per Thread, keyed for the feed's rows: zero unread is the absence of a badge, not a row. */
+function unreadCounts(inbox) {
+    return new Map(inbox.items.filter(item => item.unreadCount > 0).map(item => [item.thread.threadRef, item.unreadCount]));
+}
+export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscribeChanges, loadMembers, loadInbox, drafts, putAttachment, getAttachment, sendMessage, joinChannel, removeChannelMember, selectThread, selectChannel, backToChannels, resolveTaskRefs, t }) {
     const [view, setView] = useState();
     const [members, setMembers] = useState([]);
-    const [error, setError] = useState();
+    const [unreadByThread, setUnreadByThread] = useState(new Map());
+    const [actionError, setError] = useState();
+    const [loadError, setLoadError] = useState();
+    const error = actionError ?? loadError;
     const [pendingFiles, setPendingFiles] = useState([]);
     const [statusMessage, setStatusMessage] = useState();
     const [loading, setLoading] = useState(true);
@@ -103,7 +123,7 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
     // Presence counts ride the header meta line; error and unavailable do not count as online.
     const onlineCount = channelMembers.filter(status => status.presence === 'available' || status.presence === 'working').length;
     const messageSender = (item) => item.message.sender;
-    const mentionHandlesMap = new Map(members.map(status => [status.member.memberId, status.member.handle.replace(/^@/, '')]));
+    const handleByMember = new Map(members.map(status => [status.member.memberId, status.member.handle.replace(/^@/, '')]));
     const refresh = async (clearError = false) => {
         if (!mountedRef.current)
             return false;
@@ -114,13 +134,18 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
         if (!loadedRef.current)
             setLoading(true);
         if (clearError) {
-            setError(undefined);
+            setLoadError(undefined);
             setStatusMessage(undefined);
         }
         try {
-            const [loaded, loadedMembers] = await Promise.all([
+            const [loaded, loadedMembers, loadedInbox] = await Promise.all([
                 loadChannels({ workspaceId, channelRef, direction: 'before', topLevelOnly: true, includeActivities: false, limit: 20 }),
                 loadMembers({ workspaceId }),
+                // The non-direct slice of the Host's own Inbox is the authority for
+                // "what needs me on this Thread" — following activity, mentions, and my
+                // Task/Claim changes alike. Nothing here re-derives unread from message
+                // mentions.
+                loadInbox({ workspaceId, limit: 100 }),
             ]);
             if (!mountedRef.current || sequence !== refreshSequenceRef.current)
                 return false;
@@ -129,16 +154,26 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
                 loadedRef.current = true;
             }
             else
-                setError(loaded.error.message);
+                setLoadError(loaded.error.message);
             if (loadedMembers.ok)
                 setMembers(loadedMembers.value);
             else
-                setError(loadedMembers.error.message);
-            return loaded.ok && loadedMembers.ok;
+                setLoadError(loadedMembers.error.message);
+            // A failed unread read drops the badges instead of leaving counts the
+            // reader can no longer trust; the failure surfaces like any other read.
+            if (loadedInbox.ok)
+                setUnreadByThread(unreadCounts(loadedInbox.value));
+            else {
+                setUnreadByThread(new Map());
+                setLoadError(loadedInbox.error.message);
+            }
+            if (loaded.ok && loadedMembers.ok && loadedInbox.ok)
+                setLoadError(undefined);
+            return loaded.ok && loadedMembers.ok && loadedInbox.ok;
         }
         catch (cause) {
             if (mountedRef.current && sequence === refreshSequenceRef.current)
-                setError(cause instanceof Error ? cause.message : String(cause));
+                setLoadError(cause instanceof Error ? cause.message : String(cause));
             return false;
         }
         finally {
@@ -158,18 +193,18 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
             if (loaded.ok)
                 setMembers(loaded.value);
             else
-                setError(loaded.error.message);
+                setLoadError(loaded.error.message);
         }
         catch (cause) {
             if (mountedRef.current)
-                setError(cause instanceof Error ? cause.message : String(cause));
+                setLoadError(cause instanceof Error ? cause.message : String(cause));
         }
     };
     useEffect(() => {
         mountedRef.current = true;
         loadedRef.current = false;
         setView(undefined);
-        setError(undefined);
+        setLoadError(undefined);
         setLoading(true);
         setManagingMembers(false);
         void refresh();
@@ -178,7 +213,7 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
                 if (!mountedRef.current)
                     return;
                 if (update.type === 'failed') {
-                    setError(update.message);
+                    setLoadError(update.message);
                     return;
                 }
                 void refresh();
@@ -187,7 +222,7 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
                 if (!mountedRef.current)
                     return;
                 if (update.type === 'failed') {
-                    setError(update.message);
+                    setLoadError(update.message);
                     return;
                 }
                 void refreshMembers();
@@ -198,7 +233,7 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
                 if (!mountedRef.current)
                     return;
                 if (update.type === 'failed') {
-                    setError(update.message);
+                    setLoadError(update.message);
                     return;
                 }
                 void refreshMembers();
@@ -314,9 +349,16 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
     return _jsxs("main", { className: css.surface, "data-team-channel": channelRef, children: [_jsxs("div", { className: css.surfaceHeader, children: [_jsx("div", { className: css.backRow, children: _jsx(Button, { size: "sm", icon: _jsx(IconChevronLeftOutline14, {}), onClick: backToChannels, children: t('backToChannels') }) }), _jsxs("header", { className: css.headerRow, children: [_jsxs("div", { className: css.headerCopy, children: [_jsx("h1", { children: channel === undefined ? '# …' : `# ${channel.name}` }), channel !== undefined && _jsx("p", { children: channel.description }), channel !== undefined && _jsxs("div", { className: channelCss.headerMeta, children: [_jsx("span", { children: t('memberCount', { count: channelMembers.length }) }), _jsx("span", { children: t('onlineCount', { count: onlineCount }) })] })] }), channel !== undefined && _jsx("span", { ref: manageTriggerRef, children: _jsx(Button, { size: "sm", variant: "outline", "aria-haspopup": "dialog", onClick: () => { setManagingMembers(true); }, children: t('manageMembers') }) })] })] }), _jsx(Modal, { open: managingMembers, onClose: closeMembers, title: t('channelMembers'), ...(channel === undefined ? {} : { description: `# ${channel.name} · ${t('memberCount', { count: channelMembers.length })}` }), closeLabel: t('close'), contentClassName: channelCss.modalBody, children: _jsx("div", { ref: memberListRef, className: channelCss.memberList, children: members.filter(status => status.member.state !== 'inactive' && status.member.state !== 'archived').map(status => {
                         const joined = channelMemberIds.has(status.member.memberId);
                         const rowPending = membership.pending.has(status.member.memberId);
-                        const disabled = rowPending || (!joined && status.presence === 'unavailable');
+                        // Joining needs an active Member — the Host refuses any other
+                        // availability. Leaving only needs the Membership fact, so removal
+                        // stays offered while a joined Member is down.
+                        const disabled = rowPending || (!joined && status.availability !== 'active');
                         const rowError = membership.errors.get(status.member.memberId);
-                        return _jsxs("div", { className: channelCss.memberRow, children: [_jsx(TeamPresenceDot, { status: status, t: t }), _jsxs("span", { className: channelCss.memberCopy, children: [_jsxs("strong", { children: ["@", status.member.handle] }), _jsx("small", { children: status.member.description })] }), _jsx(Button, { className: channelCss.memberAction, size: "sm", disabled: disabled, onClick: () => { void membership.change({ workspaceId, channelRef, memberId: status.member.memberId, joined }); }, children: rowPending ? t('membershipUpdating') : joined ? t('removeFromChannel') : t('addToChannel') }), rowError !== undefined && _jsx("p", { className: channelCss.memberError, role: "alert", children: rowError })] }, status.member.memberId);
+                        return _jsx(TeamMemberRow, { status: status, action: {
+                                label: rowPending ? t('membershipUpdating') : joined ? t('removeFromChannel') : t('addToChannel'),
+                                disabled,
+                                onSelect: () => { void membership.change({ workspaceId, channelRef, memberId: status.member.memberId, joined }); },
+                            }, ...(rowError === undefined ? {} : { error: rowError }), t: t }, status.member.memberId);
                     }) }) }), _jsx("section", { ref: timeline.ref, onScroll: timeline.onScroll, className: css.timeline, "aria-label": t('timelineLabel'), children: _jsxs("div", { className: css.timelineContent, children: [loading && channel === undefined && error === undefined && _jsx("div", { className: css.emptySurface, children: _jsxs("p", { className: css.loadingState, children: [_jsx("span", { className: css.loadingMark, "aria-hidden": "true" }), t('loadingChannels')] }) }), !loading && channel === undefined && error === undefined && _jsx("div", { className: css.emptySurface, children: _jsx("p", { className: css.emptyState, children: t('emptyChannels') }) }), !loading && channel === undefined && error !== undefined && _jsxs("div", { className: css.errorState, role: "alert", children: [_jsx("span", { children: error }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => { void refresh(true); }, children: t('retry') })] }), view?.hasMore && _jsx("div", { className: css.timelineAction, children: _jsx(Button, { size: "sm", disabled: loadingOlder, onClick: () => { void loadOlder(); }, children: t('loadOlder') }) }), channel !== undefined && view?.items.length === 0 && _jsx("div", { className: css.emptySurface, children: _jsxs("div", { className: css.emptyState, children: [_jsx("strong", { children: t('emptyMessages') }), _jsx("span", { children: t('emptyMessagesHint') })] }) }), (view?.items.length ?? 0) > 0 && chunkRunsWithDays(view.items, messageSender, item => item.message.occurredAt).map((block, blockIndex) => block.kind === 'day'
                             ? _jsx("p", { className: threadCss.daySeparator, children: _jsx("span", { children: block.label }) }, `day-${blockIndex}-${block.label}`)
                             : _jsx("div", { className: css.messageRun, children: block.items.map((item, index) => {
@@ -324,7 +366,52 @@ export function TeamChannelPage({ workspaceId, channelRef, loadChannels, subscri
                                     const human = item.message.sender === view.humanMemberId;
                                     const sender = human ? t('human') : senderStatus?.member.handle ?? item.message.sender;
                                     const turnGap = isRunGap(index > 0 ? block.items[index - 1].message.occurredAt : undefined, item.message.occurredAt);
+                                    const task = item.task;
+                                    // The entry's own line is the gate under the body, and its state
+                                    // leads that line: ownership, status, and unread answer the reader
+                                    // where they are already reading. A reply inside a Thread has none
+                                    // of it — the Thread page owns that surface.
+                                    const unread = unreadByThread.get(item.thread.threadRef) ?? 0;
                                     // A turn divider already labels the gapped entry; its row stays chrome-free.
-                                    return _jsxs(Fragment, { children: [turnGap && _jsx(TeamRunDivider, { occurredAt: item.message.occurredAt }), _jsxs(TeamMessage, { senderName: sender, memberId: item.message.sender, human: human, body: item.message.body, attachments: item.message.attachments, loadAttachment: getAttachment, t: t, occurredAt: item.message.occurredAt, mentionNames: mentionNamesOf(item.mentions, mentionHandlesMap), onOpenRef: openRef, onResolveTaskRefs: lookupTaskRefs, grouped: index > 0, showGroupedTime: item.message.topLevel === true && !turnGap, ...(senderStatus === undefined ? {} : { senderTitle: senderStatus.member.description }), children: [item.message.topLevel && item.task !== undefined && item.taskNumber !== undefined && _jsxs("button", { type: "button", className: channelCss.taskFooter, "aria-label": t('openTask', { number: item.taskNumber }), onClick: () => { selectThread(item.thread.threadRef, channelRef, item.task?.taskRef, item.taskNumber); }, children: [_jsx("span", { className: channelCss.taskDot, children: _jsx(TeamStateDot, { size: 8, state: taskStatusDot(item.task.status) }) }), _jsx("span", { className: channelCss.taskNumber, children: t('taskLabel', { number: item.taskNumber }) }), _jsx("span", { className: channelCss.taskStatus, children: formatTaskStatus(item.task.status, t) }), _jsx("span", { className: channelCss.taskCount, children: t('taskMessageCount', { count: item.messageCount }) }), _jsx("span", { className: channelCss.taskArrow, "aria-hidden": "true", children: _jsx(IconChevronRightOutline14, { size: 12 }) })] }), item.message.topLevel && item.task === undefined && _jsxs("button", { type: "button", className: channelCss.taskFooter, "aria-label": t('openThread'), onClick: () => { selectThread(item.thread.threadRef, channelRef); }, children: [_jsx("span", { className: channelCss.taskNumber, children: t('threadLabel') }), _jsx("span", { className: channelCss.taskCount, children: t('taskMessageCount', { count: item.messageCount }) }), _jsx("span", { className: channelCss.taskArrow, "aria-hidden": "true", children: _jsx(IconChevronRightOutline14, { size: 12 }) })] })] })] }, item.message.messageRef);
+                                    return _jsxs(Fragment, { children: [turnGap && _jsx(TeamRunDivider, { occurredAt: item.message.occurredAt }), _jsx(TeamMessage, { senderName: sender, memberId: item.message.sender, human: human, body: item.message.body, attachments: item.message.attachments, loadAttachment: getAttachment, t: t, occurredAt: item.message.occurredAt, mentionNames: mentionNamesOf(item.mentions, handleByMember), onOpenRef: openRef, onResolveTaskRefs: lookupTaskRefs, grouped: index > 0, showGroupedTime: item.message.topLevel === true && !turnGap, ...(senderStatus === undefined ? {} : { senderTitle: senderStatus.member.description }), children: item.message.topLevel && _jsx(ThreadEntryRow, { item: item, owners: item.claimOwners, unread: unread, t: t, onOpen: () => { selectThread(item.thread.threadRef, channelRef, task?.taskRef, item.taskNumber); } }) })] }, item.message.messageRef);
                                 }) }, `run-${block.items[0].message.messageRef}`))] }) }), channel !== undefined ? _jsx(TeamComposer, { members: channelMembers, drafts: drafts, draftKey: draftKey, pending: pending, ...(statusMessage === undefined ? {} : { confirmation: statusMessage }), ...(error === undefined ? {} : { error }), onEdit: clearSendState, onSubmit: () => { void send(); }, pendingFiles: pendingFiles, onFilesChange: setPendingFiles, asTask: asTask, onAsTaskChange: setAsTask, t: t }, draftKey) : _jsx("div", {})] });
 }
+/**
+ * One entry's state: who is on the work, where it stands, and how much of it
+ * needs the reader. It leads the entry's own line rather than trailing the
+ * identity line, so a reader meets it where they are already reading instead of
+ * crossing the column for it — and the same placement holds whether this
+ * Message opened its run or continued one, where an identity line would have
+ * carried nothing else. The unread capsule is the only member a taskless
+ * discussion can carry: it needs no Task.
+ */
+function ThreadStateCluster({ task, owners, unread, t }) {
+    if (task === undefined && unread === 0)
+        return null;
+    return _jsxs("span", { className: css.stateCluster, children: [task !== undefined && _jsx(TeamAvatarStack, { owners: owners, label: claimersLabel(owners, t) }), task !== undefined && _jsx(TeamStateDot, { size: 8, state: taskStatusDot(task.status) }), task !== undefined && _jsx("span", { className: css.statusWord, children: formatTaskStatus(task.status, t) }), _jsx(TeamCountBadge, { count: unread })] });
+}
+/**
+ * The gate under one top-level Message: the single row that opens its Thread,
+ * and the one line that says what stands there. State leads it, then what the
+ * entry is: a Task entry keeps its number so the status word never floats free
+ * of the Task it describes, follow-up activity adds when the work last moved,
+ * and an unanswered Thread says only 回复. The instant uses the Inbox's own
+ * 今天/昨天 form with the precise local time on the control's title, and an
+ * unread Thread says so in the control's label rather than only in pixels.
+ */
+function ThreadEntryRow({ item, owners, unread, t, onOpen }) {
+    const taskNumber = item.taskNumber;
+    const followUp = followUpAt(item);
+    const label = taskNumber !== undefined
+        ? t('taskLabel', { number: taskNumber })
+        : followUp === undefined ? t('replyAction') : t('threadLabel');
+    const text = followUp === undefined ? label : `${label} · ${t('recentActivity', { time: formatInboxTime(followUp, t) })}`;
+    const openLabel = taskNumber === undefined
+        ? unread > 0 ? t('openThreadUnread', { count: unread }) : t('openThread')
+        : unread > 0 ? t('openTaskUnread', { number: taskNumber, count: unread }) : t('openTask', { number: taskNumber });
+    // The state is a label, not a control: it stays outside the button so the
+    // owner stack keeps its own accessible name — a labeled button prunes its
+    // descendants from the accessibility tree — and so the control's name says
+    // exactly what clicking it does.
+    return _jsxs("span", { className: css.entryLine, "data-thread-entry": "", children: [_jsx(ThreadStateCluster, { task: item.task, owners: owners, unread: unread, t: t }), _jsxs("button", { type: "button", className: css.entryRow, "aria-label": openLabel, ...(followUp === undefined ? {} : { title: formatAbsoluteTime(followUp) }), onClick: onOpen, children: [_jsx("span", { children: text }), _jsx("span", { className: css.entryArrow, "aria-hidden": "true", children: _jsx(IconChevronRightOutline14, { size: 12 }) })] })] });
+}

package/packages/client-agent-team/lib/types/client/TeamChannelsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TeamChannelsPanel.d.ts","sourceRoot":"","sources":["../../../src/client/TeamChannelsPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EAEzB,mBAAmB,EAMpB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAclD,UAAU,sBAAsB;IAC9B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,YAAY,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACvD,wGAAwG;IACxG,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;IAC/D,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,cAAc,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;IAC3D,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAA;IACrE,QAAQ,CAAC,cAAc,EAAE,SAAS,yBAAyB,EAAE,CAAA;IAC7D,QAAQ,CAAC,kBAAkB,CAAC,EAAE,mBAAmB,CAAA;IACjD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAA;CAClC;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,+BAmM9D"}
+{"version":3,"file":"TeamChannelsPanel.d.ts","sourceRoot":"","sources":["../../../src/client/TeamChannelsPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EAEzB,mBAAmB,EAMpB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAelD,UAAU,sBAAsB;IAC9B,QAAQ,CAAC,WAAW,EAAE,WAAW,CAAA;IACjC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,YAAY,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAA;IACvD,wGAAwG;IACxG,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;IAC/D,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,cAAc,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;IAC3D,QAAQ,CAAC,WAAW,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAA;IACrD,QAAQ,CAAC,mBAAmB,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAA;IACrE,QAAQ,CAAC,cAAc,EAAE,SAAS,yBAAyB,EAAE,CAAA;IAC7D,QAAQ,CAAC,kBAAkB,CAAC,EAAE,mBAAmB,CAAA;IACjD,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAA;IACzD,QAAQ,CAAC,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAA;CAClC;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,+BAsM9D"}