@elizaos/ui 2.0.0-beta.1 → 2.0.11-beta.7

package/dist/components/pages/ChatView.js

@@ -1,630 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ChatAttachmentStrip, ChatComposer, ChatComposerShell, ChatSourceIcon, ChatThreadLayout, ChatTranscript, TypingIndicator, useIntervalWhenDocumentVisible, } from "@elizaos/ui";
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from "react";
-import { client } from "../../api/client.js";
-import { fetchWithCsrf } from "../../api/csrf-client.js";
-import { isRoutineCodingAgentMessage } from "../../chat/index.js";
-import { useChatAvatarVoiceBridge } from "../../hooks/useChatAvatarVoiceBridge.js";
-import { useConnectorSendAsAccount } from "../../hooks/useConnectorSendAsAccount.js";
-import { readPersistedMobileRuntimeMode } from "../../onboarding/mobile-runtime-mode.js";
-import { CodingAgentControlChip, PtyConsoleBase, } from "../../slots/task-coordinator-slots.js";
-import { useChatComposer } from "../../state/ChatComposerContext.js";
-import { usePtySessions } from "../../state/PtySessionsContext.js";
-import { useApp } from "../../state/useApp.js";
-import { getVrmPreviewUrl } from "../../state/vrm.js";
-import { AccountRequiredCard } from "../chat/AccountRequiredCard.js";
-import { AgentActivityBox } from "../chat/AgentActivityBox.js";
-import { ConnectorAccountPicker } from "../chat/ConnectorAccountPicker.js";
-import { connectorAccountDisplayName, connectorWriteConfirmationKey, isLikelyAccountRequiredError, mergeConnectorSendAsMetadata, } from "../chat/connector-send-as.js";
-import { MessageContent } from "../chat/MessageContent.js";
-import { useChatVoiceController, useGameModalMessages, } from "./chat-view-hooks.js";
-export { __resetCompanionSpeechMemoryForTests } from "./chat-view-hooks.js";
-const CHAT_INPUT_MIN_HEIGHT_PX = 46;
-const CHAT_INPUT_MAX_HEIGHT_PX = 200;
-const fallbackTranslate = (key, options) => typeof options?.defaultValue === "string" ? options.defaultValue : key;
-function normalizeInboxChatSelection(value) {
-    if (!value || typeof value !== "object")
-        return null;
-    const candidate = value;
-    const id = typeof candidate.id === "string" ? candidate.id.trim() : "";
-    const title = typeof candidate.title === "string" ? candidate.title.trim() : "";
-    const source = typeof candidate.source === "string" ? candidate.source.trim() : "";
-    const transportSource = typeof candidate.transportSource === "string" &&
-        candidate.transportSource.trim().length > 0
-        ? candidate.transportSource.trim()
-        : undefined;
-    if (!id || !title || (!source && !transportSource)) {
-        return null;
-    }
-    return {
-        avatarUrl: typeof candidate.avatarUrl === "string" ? candidate.avatarUrl : undefined,
-        canSend: typeof candidate.canSend === "boolean" ? candidate.canSend : undefined,
-        id,
-        source,
-        title,
-        transportSource,
-        worldId: typeof candidate.worldId === "string" ? candidate.worldId : undefined,
-        worldLabel: typeof candidate.worldLabel === "string"
-            ? candidate.worldLabel
-            : undefined,
-    };
-}
-export function ChatView({ variant = "default", onPtySessionClick, }) {
-    const app = useApp();
-    const isGameModal = variant === "game-modal";
-    const showComposerVoiceToggle = false;
-    const { agentStatus, activeConversationId, activeInboxChat, activeTerminalSessionId, characterData, chatFirstTokenReceived, companionMessageCutoffTs, conversationMessages, handleChatSend, handleChatStop, handleChatEdit, elizaCloudConnected, elizaCloudVoiceProxyAvailable, elizaCloudHasPersistedKey, setState, copyToClipboard, droppedFiles: rawDroppedFiles, analysisMode, shareIngestNotice: rawShareIngestNotice, chatAgentVoiceMuted: agentVoiceMuted, selectedVrmIndex, uiLanguage, sendChatText, t: appTranslate, } = app;
-    const { ptySessions } = usePtySessions();
-    const { chatInput: rawChatInput, chatSending, chatPendingImages: rawChatPendingImages, setChatPendingImages, } = useChatComposer();
-    const droppedFiles = Array.isArray(rawDroppedFiles) ? rawDroppedFiles : [];
-    const chatInput = typeof rawChatInput === "string" ? rawChatInput : "";
-    const shareIngestNotice = typeof rawShareIngestNotice === "string" ? rawShareIngestNotice : "";
-    const chatPendingImages = Array.isArray(rawChatPendingImages)
-        ? rawChatPendingImages
-        : [];
-    const inboxChat = useMemo(() => normalizeInboxChatSelection(activeInboxChat), [activeInboxChat]);
-    const t = useCallback((key, values) => {
-        if (typeof appTranslate === "function") {
-            return appTranslate(key, values);
-        }
-        const template = typeof values?.defaultValue === "string" ? values.defaultValue : key;
-        return template.replace(/\{\{(\w+)\}\}/g, (_match, token) => {
-            const value = values?.[token];
-            return value == null ? "" : String(value);
-        });
-    }, [appTranslate]);
-    const messagesRef = useRef(null);
-    const textareaRef = useRef(null);
-    const fileInputRef = useRef(null);
-    const composerRef = useRef(null);
-    const [composerHeight, setComposerHeight] = useState(0);
-    const [imageDragOver, setImageDragOver] = useState(false);
-    const focusTerminalSession = useCallback((sessionId) => {
-        setState("activeInboxChat", null);
-        setState("activeTerminalSessionId", sessionId);
-    }, [setState]);
-    // Route a problem session into the Terminal channel so the user sees it.
-    useEffect(() => {
-        if (activeTerminalSessionId)
-            return;
-        const problemSession = ptySessions.find((s) => s.status === "error" || s.status === "blocked");
-        if (problemSession) {
-            focusTerminalSession(problemSession.sessionId);
-        }
-    }, [ptySessions, activeTerminalSessionId, focusTerminalSession]);
-    // ── Coding agent preflight ──────────────────────────────────────
-    const [codingAgentsAvailable, setCodingAgentsAvailable] = useState(false);
-    useEffect(() => {
-        const controller = new AbortController();
-        fetchWithCsrf("/api/coding-agents/preflight", { signal: controller.signal })
-            .then((r) => r.json())
-            .then((data) => {
-            setCodingAgentsAvailable((Array.isArray(data.installed) && data.installed.length > 0) ||
-                data.available === true);
-        })
-            .catch(() => {
-            /* preflight unavailable or aborted — hide code button */
-        });
-        return () => controller.abort();
-    }, []);
-    const handleCreateTask = useCallback((description, agentType) => {
-        void sendChatText(description, {
-            metadata: { intent: "create_task", agentType },
-        });
-    }, [sendChatText]);
-    // ── Derived composer state ──────────────────────────────────────
-    const isAgentStarting = agentStatus?.state === "starting" || agentStatus?.state === "restarting";
-    const hasCompletedLifecycleActivity = !chatSending &&
-        Array.isArray(conversationMessages) &&
-        conversationMessages.some((message) => message.role === "user" ||
-            (message.role === "assistant" && message.text.trim().length > 0));
-    // The agent is up but has no inference model wired — no point letting the
-    // user hit send. Surfaced as a composer lock + a pointer to Settings.
-    const agentModel = typeof agentStatus?.model === "string" ? agentStatus.model.trim() : "";
-    const isMobileLocalRuntime = readPersistedMobileRuntimeMode() === "local";
-    const isMissingInferenceProvider = agentStatus?.state === "running" &&
-        agentModel.length === 0 &&
-        !isMobileLocalRuntime;
-    const isComposerLocked = (isAgentStarting && !hasCompletedLifecycleActivity) ||
-        isMissingInferenceProvider;
-    const composerPlaceholderOverride = isMissingInferenceProvider
-        ? t("chat.setupProviderToChat", {
-            defaultValue: "Set up an LLM provider in Settings to start chatting",
-        })
-        : undefined;
-    const { beginVoiceCapture, endVoiceCapture, handleEditMessage, handleSpeakMessage, stopSpeaking, voice, voiceLatency, } = useChatVoiceController({
-        agentVoiceMuted,
-        chatFirstTokenReceived,
-        chatInput,
-        chatSending,
-        elizaCloudConnected,
-        elizaCloudVoiceProxyAvailable,
-        elizaCloudHasPersistedKey,
-        conversationMessages,
-        activeConversationId,
-        handleChatEdit,
-        handleChatSend,
-        isComposerLocked,
-        isGameModal,
-        setState,
-        uiLanguage,
-    });
-    // Stop any in-flight voice playback when the user switches conversations.
-    // useLayoutEffect (not useEffect): must run *before* useChatVoiceController's
-    // passive auto-speak effect. Otherwise we queue the new thread's greeting
-    // first, then stopSpeaking() clears that queue — no TTS after new chat/reset.
-    const prevConversationIdRef = useRef(activeConversationId);
-    useLayoutEffect(() => {
-        if (prevConversationIdRef.current === activeConversationId)
-            return;
-        prevConversationIdRef.current = activeConversationId;
-        stopSpeaking();
-    }, [activeConversationId, stopSpeaking]);
-    const handleChatAvatarSpeakingChange = useCallback((isSpeaking) => {
-        setState("chatAvatarSpeaking", isSpeaking);
-    }, [setState]);
-    const agentName = characterData?.name ||
-        agentStatus?.agentName ||
-        t("common.agent", { defaultValue: "Agent" });
-    const msgs = Array.isArray(conversationMessages) ? conversationMessages : [];
-    const visibleMsgs = useMemo(() => msgs
-        .filter((msg) => !(chatSending &&
-        !chatFirstTokenReceived &&
-        msg.role === "assistant" &&
-        !msg.text.trim()) && !isRoutineCodingAgentMessage(msg))
-        // Default-tag any message that arrived without a source as
-        // "eliza" so dashboard turns render the gold chip symmetric
-        // with connector messages. Live-streamed turns flow through
-        // the SSE path and don't carry the server-side default from
-        // conversation-routes.ts, so we catch them here too.
-        .map((msg) => (msg.source ? msg : { ...msg, source: "eliza" })), [chatFirstTokenReceived, chatSending, msgs]);
-    const { companionCarryover, gameModalCarryoverOpacity, gameModalVisibleMsgs, } = useGameModalMessages({
-        activeConversationId,
-        companionMessageCutoffTs,
-        isGameModal,
-        visibleMsgs,
-    });
-    const agentAvatarSrc = selectedVrmIndex > 0 ? getVrmPreviewUrl(selectedVrmIndex) : null;
-    useChatAvatarVoiceBridge({
-        mouthOpen: voice.mouthOpen,
-        isSpeaking: voice.isSpeaking,
-        usingAudioAnalysis: voice.usingAudioAnalysis,
-        onSpeakingChange: handleChatAvatarSpeakingChange,
-    });
-    // Auto-scroll on new messages. Use instant scroll when already near the
-    // bottom (or when the user is actively sending) to prevent the visible
-    // "scroll from top" effect that occurs when many background messages
-    // (e.g. coding-agent updates) arrive in rapid succession during smooth
-    // scrolling. Only smooth-scroll when the user has scrolled up and a new
-    // message nudges them back down.
-    useEffect(() => {
-        const displayedCompanionMessageCount = (companionCarryover?.messages.length ?? 0) + gameModalVisibleMsgs.length;
-        if (!chatSending &&
-            visibleMsgs.length === 0 &&
-            (!isGameModal || displayedCompanionMessageCount === 0)) {
-            return;
-        }
-        const el = messagesRef.current;
-        if (!el)
-            return;
-        const distanceFromBottom = el.scrollHeight - el.scrollTop - el.clientHeight;
-        const nearBottom = distanceFromBottom < 150;
-        el.scrollTo({
-            top: el.scrollHeight,
-            behavior: nearBottom ? "instant" : "smooth",
-        });
-    }, [
-        chatSending,
-        companionCarryover,
-        gameModalVisibleMsgs,
-        isGameModal,
-        visibleMsgs,
-    ]);
-    // Auto-resize textarea
-    useEffect(() => {
-        if (!isGameModal)
-            return;
-        const ta = textareaRef.current;
-        if (!ta)
-            return;
-        // Force a compact baseline when empty so the composer never boots oversized.
-        if (!chatInput) {
-            ta.style.height = `${CHAT_INPUT_MIN_HEIGHT_PX}px`;
-            ta.style.overflowY = "hidden";
-            return;
-        }
-        ta.style.height = "auto";
-        ta.style.overflowY = "hidden";
-        const h = Math.min(ta.scrollHeight, CHAT_INPUT_MAX_HEIGHT_PX);
-        ta.style.height = `${h}px`;
-        ta.style.overflowY =
-            ta.scrollHeight > CHAT_INPUT_MAX_HEIGHT_PX ? "auto" : "hidden";
-    }, [chatInput, isGameModal]);
-    // Track composer height so the message layer bottom adjusts dynamically
-    useEffect(() => {
-        const el = composerRef.current;
-        if (!el || typeof ResizeObserver === "undefined")
-            return;
-        const ro = new ResizeObserver(([entry]) => {
-            if (entry)
-                setComposerHeight(entry.contentRect.height);
-        });
-        ro.observe(el);
-        return () => ro.disconnect();
-    }, []);
-    const handleKeyDown = (e) => {
-        if (isComposerLocked)
-            return;
-        if (e.key === "Enter" && !e.shiftKey) {
-            e.preventDefault();
-            void handleChatSend();
-        }
-    };
-    const addImageFiles = useCallback((files) => {
-        const imageFiles = Array.from(files).filter((f) => f.type.startsWith("image/"));
-        if (!imageFiles.length)
-            return;
-        const readers = imageFiles.map((file) => new Promise((resolve, reject) => {
-            const reader = new FileReader();
-            reader.onload = () => {
-                const result = reader.result;
-                // result is "data:<mime>;base64,<data>" — strip the prefix
-                const commaIdx = result.indexOf(",");
-                const data = commaIdx >= 0 ? result.slice(commaIdx + 1) : result;
-                resolve({ data, mimeType: file.type, name: file.name });
-            };
-            reader.onerror = () => reject(reader.error ?? new Error("Failed to read file"));
-            reader.onabort = () => reject(new Error("File read aborted"));
-            reader.readAsDataURL(file);
-        }));
-        void Promise.all(readers)
-            .then((attachments) => {
-            setChatPendingImages((prev) => {
-                const combined = [...prev, ...attachments];
-                // Mirror the server-side MAX_CHAT_IMAGES=4 limit so the user gets
-                // immediate feedback rather than a 400 after upload.
-                return combined.slice(0, 4);
-            });
-        })
-            .catch((err) => {
-            console.warn("Failed to load image attachments:", err);
-        });
-    }, [setChatPendingImages]);
-    const handleImageDrop = useCallback((e) => {
-        e.preventDefault();
-        setImageDragOver(false);
-        if (e.dataTransfer.files.length) {
-            addImageFiles(e.dataTransfer.files);
-        }
-    }, [addImageFiles]);
-    const handleFileInputChange = useCallback((e) => {
-        if (e.target.files) {
-            addImageFiles(e.target.files);
-        }
-        e.target.value = "";
-    }, [addImageFiles]);
-    const removeImage = useCallback((index) => {
-        setChatPendingImages((prev) => prev.filter((_, i) => i !== index));
-    }, [setChatPendingImages]);
-    const chatMessageLabels = {
-        cancel: t("common.cancel"),
-        delete: t("aria.deleteMessage"),
-        edit: t("aria.editMessage"),
-        play: t("aria.playMessage"),
-        responseInterrupted: t("chatmessage.ResponseInterrupte"),
-        saveAndResend: t("chatmessage.SaveAndResend", {
-            defaultValue: "Save and resend",
-        }),
-        saving: t("common.saving", {
-            defaultValue: "Saving...",
-        }),
-    };
-    const messagesContent = visibleMsgs.length === 0 && !chatSending ? (_jsx("div", { className: "flex h-full items-center justify-center px-6 text-center text-xs text-muted", children: t("chatview.NoMessagesYet", { defaultValue: "No messages yet." }) })) : (_jsx(ChatTranscript, { variant: variant, agentName: agentName, carryoverMessages: companionCarryover?.messages, carryoverOpacity: gameModalCarryoverOpacity, labels: chatMessageLabels, messages: isGameModal ? gameModalVisibleMsgs : visibleMsgs, onEdit: handleEditMessage, onSpeak: handleSpeakMessage, onCopy: (text) => {
-            void copyToClipboard(text);
-        }, renderMessageContent: (message) => (_jsx(MessageContent, { message: message, analysisMode: analysisMode })), typingIndicator: chatSending && !chatFirstTokenReceived ? (isGameModal ? (_jsx(TypingIndicator, { variant: "game-modal", agentName: agentName })) : (_jsx(TypingIndicator, { agentName: agentName, agentAvatarSrc: agentAvatarSrc }))) : null }));
-    const auxiliaryNode = (_jsxs(_Fragment, { children: [shareIngestNotice ? (_jsx("div", { className: `text-xs text-ok py-1 relative${isGameModal ? " pointer-events-auto" : ""}`, style: { zIndex: 1 }, children: shareIngestNotice })) : null, droppedFiles.length > 0 ? (_jsx("div", { className: `text-xs text-muted py-0.5 flex gap-2 relative${isGameModal ? " pointer-events-auto" : ""}`, style: { zIndex: 1 }, children: droppedFiles.map((f) => (_jsx("span", { children: f }, f))) })) : null, _jsx(ChatAttachmentStrip, { variant: variant, items: chatPendingImages.map((img, imgIdx) => ({
-                    id: String(imgIdx),
-                    alt: img.name,
-                    name: img.name,
-                    src: `data:${img.mimeType};base64,${img.data}`,
-                })), removeLabel: (item) => t("chat.removeImage", {
-                    defaultValue: "Remove image {{name}}",
-                    name: item.name,
-                }), onRemove: (id) => removeImage(Number(id)) }), voiceLatency ? (_jsxs("div", { className: `pb-1 text-2xs text-muted relative${isGameModal ? " pointer-events-auto" : ""}`, style: { zIndex: 1 }, children: [t("chatview.SilenceEndFirstTo"), " ", voiceLatency.speechEndToFirstTokenMs ?? "—", t("chatview.msEndVoiceStart"), " ", voiceLatency.speechEndToVoiceStartMs ?? "—", t("chatview.msFirst"), " ", voiceLatency.firstSegmentCached == null
-                        ? "—"
-                        : voiceLatency.firstSegmentCached
-                            ? t("chat.cached", { defaultValue: "cached" })
-                            : t("chat.uncached", { defaultValue: "uncached" })] })) : null, _jsx("input", { ref: fileInputRef, type: "file", accept: "image/*", multiple: true, className: "hidden", onChange: handleFileInputChange })] }));
-    const defaultComposerLaneClassName = "mx-auto w-full max-w-[96rem] px-4 sm:px-6 lg:px-8 xl:px-10";
-    const defaultComposerShellClassName = `${defaultComposerLaneClassName} pt-1.5`;
-    const defaultComposerShellStyle = {
-        paddingBottom: "calc(var(--safe-area-bottom, 0px) + var(--eliza-mobile-nav-offset, 0px) + 0.375rem)",
-    };
-    const composerNode = isGameModal ? (_jsx(ChatComposerShell, { variant: "game-modal", shellRef: composerRef, before: _jsxs(_Fragment, { children: [_jsx(CodingAgentControlChip, {}), _jsx(AgentActivityBox, { sessions: ptySessions, onSessionClick: onPtySessionClick ?? focusTerminalSession })] }), children: _jsx(ChatComposer, { variant: "game-modal", textareaRef: textareaRef, chatInput: chatInput, chatPendingImagesCount: chatPendingImages.length, isComposerLocked: isComposerLocked, isAgentStarting: isAgentStarting, placeholder: composerPlaceholderOverride, chatSending: chatSending, voice: {
-                supported: voice.supported,
-                isListening: voice.isListening,
-                captureMode: voice.captureMode,
-                interimTranscript: voice.interimTranscript,
-                isSpeaking: voice.isSpeaking,
-                assistantTtsQuality: voice.assistantTtsQuality,
-                toggleListening: voice.toggleListening,
-                startListening: beginVoiceCapture,
-                stopListening: endVoiceCapture,
-            }, agentVoiceEnabled: !agentVoiceMuted, showAgentVoiceToggle: showComposerVoiceToggle, t: t, onAttachImage: () => fileInputRef.current?.click(), onChatInputChange: (value) => setState("chatInput", value), onKeyDown: handleKeyDown, onSend: () => void handleChatSend(), onStop: handleChatStop, onStopSpeaking: stopSpeaking, onToggleAgentVoice: () => setState("chatAgentVoiceMuted", !agentVoiceMuted), codingAgentsAvailable: codingAgentsAvailable, onCreateTask: handleCreateTask }) })) : (_jsx(ChatComposerShell, { variant: "default", className: defaultComposerShellClassName, style: defaultComposerShellStyle, before: _jsx(CodingAgentControlChip, {}), children: _jsx(ChatComposer, { variant: "default", layout: "inline", textareaRef: textareaRef, chatInput: chatInput, chatPendingImagesCount: chatPendingImages.length, isComposerLocked: isComposerLocked, isAgentStarting: isAgentStarting, placeholder: composerPlaceholderOverride, chatSending: chatSending, voice: {
-                supported: voice.supported,
-                isListening: voice.isListening,
-                captureMode: voice.captureMode,
-                interimTranscript: voice.interimTranscript,
-                isSpeaking: voice.isSpeaking,
-                assistantTtsQuality: voice.assistantTtsQuality,
-                toggleListening: voice.toggleListening,
-                startListening: beginVoiceCapture,
-                stopListening: endVoiceCapture,
-            }, agentVoiceEnabled: !agentVoiceMuted, showAgentVoiceToggle: showComposerVoiceToggle, t: t, onAttachImage: () => fileInputRef.current?.click(), onChatInputChange: (value) => setState("chatInput", value), onKeyDown: handleKeyDown, onSend: () => void handleChatSend(), onStop: handleChatStop, onStopSpeaking: stopSpeaking, onToggleAgentVoice: () => setState("chatAgentVoiceMuted", !agentVoiceMuted), codingAgentsAvailable: codingAgentsAvailable, onCreateTask: handleCreateTask }) }));
-    // ── Terminal-channel branch ──────────────────────────────────────
-    if (activeTerminalSessionId) {
-        return (_jsx(TerminalChannelPanel, { activeSessionId: activeTerminalSessionId, sessions: ptySessions, onClose: () => setState("activeTerminalSessionId", null), loadingLabel: t("terminal.starting", {
-                defaultValue: "Starting terminal\u2026",
-            }) }));
-    }
-    // ── Inbox-chat branch ────────────────────────────────────────────
-    if (inboxChat) {
-        return (_jsx(InboxChatPanel, { activeInboxChat: inboxChat, variant: variant }, inboxChat.id));
-    }
-    return (_jsx(ChatThreadLayout, { "aria-label": t("aria.chatWorkspace"), variant: variant, composerHeight: composerHeight, imageDragOver: imageDragOver, messagesRef: messagesRef, footerStack: _jsx("div", { className: defaultComposerLaneClassName, children: auxiliaryNode }), composer: composerNode, onDragOver: (event) => {
-            event.preventDefault();
-            setImageDragOver(true);
-        }, onDragLeave: () => setImageDragOver(false), onDrop: handleImageDrop, children: messagesContent }));
-}
-/**
- * Full-window terminal view rendered when the Terminal channel is
- * active. Keeps every PTY session pane mounted under the hood so
- * tabbing between sessions preserves their buffers/state. Spawning is
- * owned by the sidebar — this component only displays what the
- * orchestrator has already registered, and waits for the live session
- * list to catch up when activeSessionId is set but not yet present.
- */
-export function TerminalChannelPanel({ activeSessionId, sessions, onClose, loadingLabel, }) {
-    const hasActiveSession = sessions.some((s) => s.sessionId === activeSessionId);
-    if (!hasActiveSession) {
-        return (_jsx("div", { "data-testid": "terminal-channel-loading", className: "flex flex-1 items-center justify-center text-xs text-muted", children: loadingLabel }));
-    }
-    return (_jsx("div", { "data-testid": "terminal-channel-panel", className: "flex flex-1 min-h-0 min-w-0 flex-col", children: _jsx(PtyConsoleBase, { activeSessionId: activeSessionId, sessions: sessions, onClose: onClose, variant: "full" }) }));
-}
-/**
- * Connector chat panel shown when the messages sidebar has a
- * room selected. Polls `/api/inbox/messages?roomId=...`, renders the
- * transcript through the same ChatTranscript component the dashboard
- * uses, and routes outbound replies back through the runtime's
- * source-specific send handlers.
- */
-function InboxChatPanel({ activeInboxChat, variant, }) {
-    const app = useApp();
-    const t = app?.t ?? fallbackTranslate;
-    const [messages, setMessages] = useState([]);
-    const [loading, setLoading] = useState(true);
-    const [replyText, setReplyText] = useState("");
-    const [replyError, setReplyError] = useState(null);
-    const [sending, setSending] = useState(false);
-    const scrollRef = useRef(null);
-    const inboxTextareaRef = useRef(null);
-    const lastRenderedMessageKeyRef = useRef(null);
-    const transportSource = activeInboxChat.transportSource ?? activeInboxChat.source;
-    const loadInboxMessages = useCallback(async () => {
-        try {
-            const response = await client.getInboxMessages({
-                limit: 200,
-                roomId: activeInboxChat.id,
-                roomSource: transportSource,
-            });
-            // Server returns newest first; ChatTranscript expects
-            // oldest→newest (conversation layout) so reverse.
-            const next = [...response.messages]
-                .reverse()
-                .map((m) => m);
-            setMessages(next);
-        }
-        catch {
-            // Transient errors keep the last snapshot; next poll retries.
-        }
-        finally {
-            setLoading(false);
-        }
-    }, [activeInboxChat.id, transportSource]);
-    useEffect(() => {
-        let cancelled = false;
-        (async () => {
-            await loadInboxMessages();
-            if (cancelled)
-                return;
-        })();
-        return () => {
-            cancelled = true;
-        };
-    }, [loadInboxMessages]);
-    useIntervalWhenDocumentVisible(() => {
-        void loadInboxMessages();
-    }, 15_000);
-    useLayoutEffect(() => {
-        if (messages.length === 0)
-            return;
-        const el = scrollRef.current;
-        if (!el)
-            return;
-        const lastMessage = messages[messages.length - 1];
-        const nextKey = `${messages.length}:${lastMessage?.id ?? ""}:${lastMessage?.timestamp ?? 0}`;
-        if (lastRenderedMessageKeyRef.current === nextKey) {
-            return;
-        }
-        el.scrollTo({
-            top: el.scrollHeight,
-            behavior: lastRenderedMessageKeyRef.current === null ? "instant" : "smooth",
-        });
-        lastRenderedMessageKeyRef.current = nextKey;
-    }, [messages]);
-    const sourceLabel = activeInboxChat.source
-        ? activeInboxChat.source.charAt(0).toUpperCase() +
-            activeInboxChat.source.slice(1)
-        : t("common.channel", { defaultValue: "Channel" });
-    const sendAsContext = useMemo(() => activeInboxChat.canSend === false
-        ? null
-        : {
-            provider: transportSource,
-            connectorId: transportSource,
-            source: transportSource,
-            channel: activeInboxChat.id,
-            channelLabel: activeInboxChat.title,
-            writeCapable: true,
-        }, [
-        activeInboxChat.canSend,
-        activeInboxChat.id,
-        activeInboxChat.title,
-        transportSource,
-    ]);
-    const connectorSendAs = useConnectorSendAsAccount(sendAsContext, {
-        setActionNotice: app?.setActionNotice,
-    });
-    const { accountRequired, accountRequiredReason: connectorAccountRequiredReason, accounts: sendAsAccounts, connectAccount, context: normalizedSendAsContext, loading: sendAsLoading, reconnectAccount, saving: sendAsSaving, selectAccount, selectedAccount: sendAsSelectedAccount, sendAsMetadata, showPicker: showSendAsPicker, } = connectorSendAs;
-    const [accountRequiredReason, setAccountRequiredReason] = useState(null);
-    const [pendingWriteConfirmationKey, setPendingWriteConfirmationKey] = useState(null);
-    const [confirmedWriteAccountKeys, setConfirmedWriteAccountKeys] = useState(() => new Set());
-    const currentWriteConfirmationKey = connectorWriteConfirmationKey(sendAsContext, sendAsSelectedAccount);
-    const showWriteConfirmation = Boolean(pendingWriteConfirmationKey) &&
-        pendingWriteConfirmationKey === currentWriteConfirmationKey;
-    const sendAsConnectBusy = normalizedSendAsContext
-        ? sendAsSaving.has(`add:${normalizedSendAsContext.provider}:${normalizedSendAsContext.connectorId}`)
-        : false;
-    const blockingAccountReason = accountRequiredReason ??
-        (accountRequired ? connectorAccountRequiredReason : null);
-    const handleSelectSendAsAccount = useCallback((accountId) => {
-        const account = sendAsAccounts.find((item) => item.id === accountId);
-        selectAccount(accountId);
-        setAccountRequiredReason(null);
-        const key = connectorWriteConfirmationKey(sendAsContext, account);
-        if (key && !confirmedWriteAccountKeys.has(key)) {
-            setPendingWriteConfirmationKey(key);
-        }
-    }, [confirmedWriteAccountKeys, selectAccount, sendAsAccounts, sendAsContext]);
-    const handleConfirmWriteAccount = useCallback(() => {
-        if (!currentWriteConfirmationKey)
-            return;
-        setConfirmedWriteAccountKeys((prev) => {
-            const next = new Set(prev);
-            next.add(currentWriteConfirmationKey);
-            return next;
-        });
-        setPendingWriteConfirmationKey(null);
-        setReplyError(null);
-    }, [currentWriteConfirmationKey]);
-    const handleConnectSendAsAccount = useCallback(() => {
-        setAccountRequiredReason(null);
-        void connectAccount().catch((error) => {
-            setReplyError(error instanceof Error ? error.message : "Failed to connect account.");
-        });
-    }, [connectAccount]);
-    const handleReconnectSendAsAccount = useCallback((accountId) => {
-        setAccountRequiredReason(null);
-        void reconnectAccount(accountId).catch((error) => {
-            setReplyError(error instanceof Error
-                ? error.message
-                : "Failed to reconnect account.");
-        });
-    }, [reconnectAccount]);
-    const handleReplySend = useCallback(async () => {
-        const text = replyText.trim();
-        if (!text || sending || activeInboxChat.canSend === false) {
-            return;
-        }
-        if (blockingAccountReason) {
-            setReplyError(blockingAccountReason);
-            return;
-        }
-        if (showWriteConfirmation) {
-            setReplyError("Confirm the send-as account before sending.");
-            return;
-        }
-        setSending(true);
-        setReplyError(null);
-        try {
-            const response = await client.sendInboxMessage({
-                ...(sendAsSelectedAccount?.id
-                    ? { accountId: sendAsSelectedAccount.id }
-                    : {}),
-                channel: activeInboxChat.id,
-                metadata: mergeConnectorSendAsMetadata(undefined, sendAsMetadata),
-                roomId: activeInboxChat.id,
-                source: transportSource,
-                text,
-            });
-            if (response.message) {
-                setMessages((current) => [
-                    ...current,
-                    response.message,
-                ]);
-            }
-            setReplyText("");
-            setAccountRequiredReason(null);
-        }
-        catch (error) {
-            if (isLikelyAccountRequiredError(error)) {
-                setAccountRequiredReason(error instanceof Error
-                    ? error.message
-                    : "Choose a connector account before sending.");
-            }
-            setReplyError(error instanceof Error
-                ? error.message
-                : t("inboxview.SendFailed", {
-                    defaultValue: "Failed to send message.",
-                }));
-        }
-        finally {
-            setSending(false);
-        }
-    }, [
-        activeInboxChat.canSend,
-        activeInboxChat.id,
-        blockingAccountReason,
-        replyText,
-        sendAsMetadata,
-        sendAsSelectedAccount,
-        sending,
-        showWriteConfirmation,
-        t,
-        transportSource,
-    ]);
-    const handleReplyKeyDown = useCallback((event) => {
-        if (event.key !== "Enter" || event.shiftKey) {
-            return;
-        }
-        event.preventDefault();
-        void handleReplySend();
-    }, [handleReplySend]);
-    return (_jsxs("div", { className: "flex flex-1 min-h-0 min-w-0 flex-col", children: [_jsxs("div", { className: "flex items-center justify-between px-5 py-3", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-sm font-bold text-txt truncate", children: activeInboxChat.title }), _jsxs("div", { className: "mt-0.5 text-xs-tight text-muted", children: [activeInboxChat.worldLabel
-                                        ? `${activeInboxChat.worldLabel} • `
-                                        : "", sourceLabel, " \u00B7 ", messages.length, " ", t("inboxview.TotalCountShort", { defaultValue: "messages" })] })] }), activeInboxChat.source ? (_jsx(ChatSourceIcon, { source: activeInboxChat.source, className: "h-4 w-4" })) : activeInboxChat.avatarUrl ? (_jsx("img", { src: activeInboxChat.avatarUrl, alt: t("inboxview.avatarAlt", {
-                            defaultValue: "{{title}} avatar",
-                            title: activeInboxChat.title,
-                        }), className: "h-8 w-8 shrink-0 rounded-full border border-border/35 object-cover shadow-[0_10px_18px_-16px_rgba(15,23,42,0.45)]" })) : null] }), _jsx("div", { ref: scrollRef, "data-testid": "inbox-chat-scroll", className: "flex-1 min-h-0 overflow-y-auto px-5 py-4", children: loading && messages.length === 0 ? (_jsx("div", { className: "flex h-full items-center justify-center text-xs text-muted", children: t("inboxview.Loading", { defaultValue: "Loading messages…" }) })) : messages.length === 0 ? (_jsx("div", { className: "flex h-full items-center justify-center text-center text-xs text-muted", children: t("inboxview.EmptyRoom", {
-                        defaultValue: "No messages in this chat yet.",
-                    }) })) : (_jsx(ChatTranscript, { variant: variant, messages: messages, userMessagesOnRight: false, renderMessageContent: (message) => (_jsx(MessageContent, { message: message })) })) }), activeInboxChat.canSend === false ? (_jsx("div", { className: "bg-bg-hover/40 px-5 py-3 text-xs-tight leading-5 text-muted", children: t("inboxview.ReadOnlyReplyHint", {
-                    defaultValue: "This {{source}} chat is readable, but outbound replies are not available for this connector yet.",
-                    source: sourceLabel,
-                }) })) : (_jsxs("div", { className: "flex flex-col gap-2 px-3 pb-3", children: [_jsx(ConnectorAccountPicker, { accounts: sendAsAccounts, connectBusy: sendAsConnectBusy, loading: sendAsLoading, selectedAccount: sendAsSelectedAccount, sourceLabel: sourceLabel, show: showSendAsPicker, onConnectAccount: handleConnectSendAsAccount, onReconnectAccount: handleReconnectSendAsAccount, onSelectAccount: handleSelectSendAsAccount }), blockingAccountReason ? (_jsx(AccountRequiredCard, { accounts: sendAsAccounts, connectBusy: sendAsConnectBusy, description: blockingAccountReason, loading: sendAsLoading, selectedAccount: sendAsSelectedAccount, sourceLabel: sourceLabel, onConnectAccount: handleConnectSendAsAccount, onReconnectAccount: handleReconnectSendAsAccount, onSelectAccount: handleSelectSendAsAccount })) : showWriteConfirmation ? (_jsx(AccountRequiredCard, { accounts: sendAsAccounts, connectBusy: sendAsConnectBusy, confirmLabel: "Confirm send-as", description: `First send with ${sendAsSelectedAccount ? connectorAccountDisplayName(sendAsSelectedAccount) : "this account"} in ${sourceLabel}. Confirm before Eliza writes through it.`, loading: sendAsLoading, selectedAccount: sendAsSelectedAccount, sourceLabel: sourceLabel, title: "Confirm send-as account", onConfirm: handleConfirmWriteAccount, onConnectAccount: handleConnectSendAsAccount, onReconnectAccount: handleReconnectSendAsAccount, onSelectAccount: handleSelectSendAsAccount })) : null, _jsx("div", { className: "rounded-md border border-warn/40 bg-warn/10 px-3 py-2 text-2xs leading-snug text-warn", children: t("inboxview.AgentSendWarning", {
-                            defaultValue: "This message will be sent as your agent in {{source}}.",
-                            source: sourceLabel,
-                        }) }), _jsx(ChatComposerShell, { variant: "default", children: _jsx(ChatComposer, { variant: "default", textareaRef: inboxTextareaRef, chatInput: replyText, chatPendingImagesCount: 0, isComposerLocked: sending, isAgentStarting: false, chatSending: sending, voice: inertVoiceState, agentVoiceEnabled: false, showAgentVoiceToggle: false, t: t, hideAttachButton: true, placeholder: t("inboxview.ReplyPlaceholder", {
-                                defaultValue: "Reply in {{source}}",
-                                source: sourceLabel,
-                            }), onAttachImage: () => { }, onChatInputChange: setReplyText, onKeyDown: handleReplyKeyDown, onSend: () => void handleReplySend(), onStop: () => { }, onStopSpeaking: () => { }, onToggleAgentVoice: () => { } }) }), replyError ? (_jsx("div", { className: "px-1 text-xs-tight text-danger", children: replyError })) : null] }))] }));
-}
-const inertVoiceState = {
-    assistantTtsQuality: undefined,
-    captureMode: "idle",
-    interimTranscript: "",
-    isListening: false,
-    isSpeaking: false,
-    startListening: () => { },
-    stopListening: () => { },
-    supported: false,
-    toggleListening: () => { },
-};

package/dist/components/pages/ConfigPageView.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConfigPageView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/pages/ConfigPageView.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAsEH,wBAAgB,cAAc,CAAC,EAC7B,QAAgB,EAChB,mBAAmB,GACpB,EAAE;IACD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;CAClC,2CAwmBA"}