import React, { useMemo } from "react";
import useRenderTracker from "../../../hooks/useRenderTracker";
import MarkdownBlock from "../Blocks/MarkdownBlock";
import CodeBlock from "../Blocks/CodeBlock";
import { ParsedBlock, parseMarkdownAndCode } from "../../../utils/parseMarkdownAndCode";
import type { FinalizedThinkingSummary } from "../../../types/chatStream";
import AssistantThinkingSummary from "./AssistantThinkingSummary";


interface StaticAssistantMessageProps {
    content: string;
    thinkingSummary?: FinalizedThinkingSummary;
}

const StaticAssistantMessage: React.FC<StaticAssistantMessageProps> = ({ content, thinkingSummary }) => {

    useRenderTracker('StaticAssistantMessage', { content, thinkingSummary });

    const blocks: ParsedBlock[] = parseMarkdownAndCode(content);

    const renderedBlocks = useMemo(() => (
        <>
            {blocks.map((block) => {
                if (block.type === 'markdown') {
                    return <MarkdownBlock key={`${block.startIndex}-${block.endIndex}`} content={block.content} />;
                }
                if (block.type === 'code') {
                    return <CodeBlock key={`${block.startIndex}-${block.endIndex}`} content={block.content} language={block.language} />;
                }
                return null;
            })}
        </>
    ), [blocks]);


    return (
        <div className="chat-output assistant-message px-4 py-3 my-2 rounded-[1.3rem] overflow-hidden max-w-full text-gray-700 dark:text-gray-300">
          {thinkingSummary && (
            <AssistantThinkingSummary
              label={`Thought for ${Math.max(1, Math.round(thinkingSummary.durationMs / 1000))}s`}
              timeline={thinkingSummary.timeline}
            />
          )}
          <div className="chat-content max-w-none">
            {renderedBlocks}
          </div>
        </div>
    );
}

export default React.memo(StaticAssistantMessage);