import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { AgentMessageType } from "@vertesia/common";
import React, { useEffect, useMemo, useState } from "react";
import MessageItem from "./MessageItem";
import WorkstreamTabs, { extractWorkstreams, filterMessagesByWorkstream } from "./WorkstreamTabs";
import { DONE_STATES, getWorkstreamId } from "./utils";
export default function AllMessagesMixed({ messages, bottomRef, viewMode = 'stacked', isCompleted = false, }) {
    const containerRef = React.useRef(null);
    const [activeWorkstream, setActiveWorkstream] = useState("all");
    // Auto-scroll to bottom when messages change
    useEffect(() => {
        if (bottomRef.current) {
            bottomRef.current.scrollIntoView({ behavior: "smooth" });
        }
    }, [messages, bottomRef]);
    // Sort all messages chronologically
    const sortedMessages = React.useMemo(() => [...messages].sort((a, b) => {
        const timeA = typeof a.timestamp === "number" ? a.timestamp : new Date(a.timestamp).getTime();
        const timeB = typeof b.timestamp === "number" ? b.timestamp : new Date(b.timestamp).getTime();
        return timeA - timeB;
    }), [messages]);
    // Get workstreams from messages - only from message.workstream_id
    const workstreams = React.useMemo(() => {
        // Just get the basic workstreams from the messages
        const extractedWorkstreams = extractWorkstreams(sortedMessages);
        // We'll keep taskLabels - they might be used for display purposes elsewhere
        // but we won't use them to create new workstream tabs
        return extractedWorkstreams;
    }, [sortedMessages]);
    // Count messages per workstream
    const workstreamCounts = React.useMemo(() => {
        const counts = new Map();
        counts.set("all", sortedMessages.length);
        // Count main messages
        const mainMessages = filterMessagesByWorkstream(sortedMessages, "main");
        counts.set("main", mainMessages.length);
        // Count other workstreams
        sortedMessages.forEach((msg) => {
            const workstreamId = getWorkstreamId(msg);
            if (workstreamId !== "main") {
                counts.set(workstreamId, (counts.get(workstreamId) || 0) + 1);
            }
        });
        return counts;
    }, [sortedMessages]);
    // Filter messages based on active workstream
    const displayMessages = React.useMemo(() => {
        if (activeWorkstream === "all") {
            return sortedMessages;
        }
        return filterMessagesByWorkstream(sortedMessages, activeWorkstream);
    }, [sortedMessages, activeWorkstream]);
    // Determine completion status for each workstream
    const workstreamCompletionStatus = useMemo(() => {
        const statusMap = new Map();
        // Group messages by workstream
        const workstreamMessages = new Map();
        sortedMessages.forEach(message => {
            const workstreamId = getWorkstreamId(message);
            if (!workstreamMessages.has(workstreamId)) {
                workstreamMessages.set(workstreamId, []);
            }
            workstreamMessages.get(workstreamId).push(message);
        });
        // Check if each workstream is completed
        for (const [workstreamId, msgs] of workstreamMessages.entries()) {
            if (msgs.length > 0) {
                const lastMessage = msgs[msgs.length - 1];
                statusMap.set(workstreamId, [
                    AgentMessageType.COMPLETE,
                    AgentMessageType.IDLE,
                    AgentMessageType.REQUEST_INPUT,
                    AgentMessageType.TERMINATED
                ].includes(lastMessage.type));
            }
        }
        return statusMap;
    }, [sortedMessages]);
    return (_jsxs("div", { ref: containerRef, className: "flex-1 min-h-0 h-full overflow-y-auto px-4 sm:px-2 lg:px-4 flex flex-col relative", "data-testid": "all-messages-mixed", children: [_jsx("div", { className: "sticky top-0 z-10", children: _jsx(WorkstreamTabs, { workstreams: workstreams, activeWorkstream: activeWorkstream, onSelectWorkstream: setActiveWorkstream, count: workstreamCounts, completionStatus: workstreamCompletionStatus }) }), displayMessages.length === 0 ? (_jsx("div", { className: "flex items-center justify-center h-full text-center py-8", children: _jsx("div", { className: "flex items-center px-4 py-3 text-muted", children: activeWorkstream === "all"
                        ? "Waiting for agent response..."
                        : "No messages in this workstream yet..." }) })) : (_jsxs("div", { className: "flex-1 flex flex-col justify-start pb-4 space-y-2", children: [viewMode === 'stacked' ? (
                    // Stacked view - show all messages in the current workstream
                    // Add pulsating circle to the latest message if not completed
                    displayMessages.map((message, index) => {
                        // Find if this is the latest non-completion message
                        const isLatestNonCompletionMessage = !isCompleted &&
                            index === displayMessages.length - 1 &&
                            !DONE_STATES.includes(message.type);
                        return (_jsx(MessageItem, { message: message, showPulsatingCircle: isLatestNonCompletionMessage }, `${message.timestamp}-${index}`));
                    })) : (
                    // Sliding view - only permanent messages and latest thinking from the current workstream
                    _jsx(_Fragment, { children: (() => {
                            // First get all permanent messages (ANSWER, QUESTION, COMPLETE, REQUEST_INPUT, TERMINATED)
                            const permanentMessages = displayMessages.filter(msg => msg.type === AgentMessageType.ANSWER ||
                                msg.type === AgentMessageType.QUESTION ||
                                msg.type === AgentMessageType.COMPLETE ||
                                msg.type === AgentMessageType.TERMINATED);
                            // Then get the latest thinking message if not completed
                            const latestThinkingMessage = !isCompleted ?
                                displayMessages
                                    .filter(msg => msg.type === AgentMessageType.THOUGHT ||
                                    msg.type === AgentMessageType.UPDATE ||
                                    msg.type === AgentMessageType.PLAN)
                                    .sort((a, b) => {
                                    const timeA = typeof a.timestamp === 'number' ? a.timestamp : new Date(a.timestamp).getTime();
                                    const timeB = typeof b.timestamp === 'number' ? b.timestamp : new Date(b.timestamp).getTime();
                                    return timeB - timeA; // Sort descending - newest first
                                })[0]
                                : null;
                            // Sort all messages by timestamp
                            const allMessages = [...permanentMessages];
                            if (latestThinkingMessage) {
                                allMessages.push(latestThinkingMessage);
                            }
                            allMessages.sort((a, b) => {
                                const timeA = typeof a.timestamp === 'number' ? a.timestamp : new Date(a.timestamp).getTime();
                                const timeB = typeof b.timestamp === 'number' ? b.timestamp : new Date(b.timestamp).getTime();
                                return timeA - timeB; // Sort ascending - oldest first
                            });
                            // Show pulsating circle only on the latest message if not completed
                            return allMessages.map((message, index) => {
                                const isLatestMessage = !isCompleted &&
                                    index === allMessages.length - 1 &&
                                    !DONE_STATES.includes(message.type);
                                return (_jsx(MessageItem, { message: message, showPulsatingCircle: isLatestMessage }, `${message.timestamp}-${index}`));
                            });
                        })() })), _jsx("div", { ref: bottomRef, className: "h-4" })] }))] }));
}
//# sourceMappingURL=AllMessagesMixed.js.map