|
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime"; |
|
import { FiUser, FiCpu, FiAlertTriangle, FiTerminal, FiInfo } from 'react-icons/fi'; |
|
import ReactMarkdown from 'react-markdown'; |
|
|
|
const ChatMessageComponent = ({ message }) => { |
|
|
|
if (message.type === 'log') { |
|
|
|
const logMatch = message.content.match(/\[Agent:([^\]]+)\] (.*)/); |
|
if (logMatch) { |
|
const [_, agentId, logContent] = logMatch; |
|
return (_jsxs("div", { className: "text-xs text-gray-500 py-1 pl-8 border-l border-gray-700 my-1", children: [_jsxs("span", { className: "font-semibold text-gray-400", children: [agentId, ":"] }), " ", logContent] })); |
|
} |
|
return (_jsxs("div", { className: "flex items-start space-x-2 text-xs text-gray-500 py-1", children: [_jsx(FiTerminal, { className: "text-gray-500 mt-0.5 flex-shrink-0", size: 12 }), _jsx("div", { children: message.content })] })); |
|
} |
|
|
|
if (message.type === 'error') { |
|
return (_jsxs("div", { className: "flex items-start space-x-2 my-2 p-2 bg-red-900/20 border-l-2 border-red-500 text-red-400 rounded", children: [_jsx(FiAlertTriangle, { className: "text-red-500 mt-1 flex-shrink-0" }), _jsxs("div", { children: [_jsx("p", { className: "font-semibold text-red-400", children: "Erro:" }), _jsx("p", { className: "text-gray-300", children: message.content })] })] })); |
|
} |
|
|
|
if (message.type === 'user') { |
|
return (_jsxs("div", { className: "flex items-start space-x-2 my-3", children: [_jsx("div", { className: "bg-indigo-600 text-white p-2 rounded-full flex-shrink-0", children: _jsx(FiUser, {}) }), _jsx("div", { className: "bg-gray-800 p-3 rounded-lg rounded-tl-none max-w-[calc(100%-50px)] text-gray-200", children: message.content })] })); |
|
} |
|
|
|
const agentColor = getAgentColor(message.agentId || 'default'); |
|
return (_jsxs("div", { className: "flex items-start space-x-2 my-3", children: [_jsx("div", { className: `${agentColor} text-white p-2 rounded-full flex-shrink-0`, children: _jsx(FiCpu, {}) }), _jsx("div", { className: "bg-gray-900 p-3 rounded-lg rounded-tl-none max-w-[calc(100%-50px)] text-gray-200 border border-gray-800", children: _jsx(MessageContent, { content: message.content }) })] })); |
|
}; |
|
|
|
const getAgentColor = (agentId) => { |
|
switch (agentId) { |
|
case 'orchestrator': |
|
return 'bg-purple-600'; |
|
case 'mike': |
|
return 'bg-blue-600'; |
|
case 'alex': |
|
return 'bg-green-600'; |
|
case 'david': |
|
return 'bg-amber-600'; |
|
default: |
|
return 'bg-indigo-600'; |
|
} |
|
}; |
|
|
|
const MessageContent = ({ content }) => { |
|
|
|
if (content.includes('<html') || content.includes('<!DOCTYPE')) { |
|
return (_jsxs("div", { children: [_jsxs("div", { className: "bg-gray-800 p-2 rounded mb-2 text-xs text-green-400", children: [_jsx(FiInfo, { className: "inline mr-1" }), " HTML gerado"] }), _jsx("div", { className: "text-gray-300 max-h-80 overflow-y-auto", children: content })] })); |
|
} |
|
|
|
try { |
|
return (_jsx("div", { className: "prose prose-invert prose-sm max-w-none", children: _jsx(ReactMarkdown, { children: content }) })); |
|
} |
|
catch { |
|
|
|
return _jsx("div", { className: "whitespace-pre-wrap", children: content }); |
|
} |
|
}; |
|
export default ChatMessageComponent; |
|
|