/**
 * SimpleMessageBlock - Simple message display without collapsing
 * Used for messages in tree view and last user message
 */

import { Typography } from "antd";
import { ToolCall } from "./prettyMessagesTypes";
import { SimpleToolCallBlock } from "./SimpleToolCallBlock";

const { Text } = Typography;

interface SimpleMessageBlockProps {
  label: string;
  content?: string;
  toolCalls?: ToolCall[];
  isCompact?: boolean;
}

export function SimpleMessageBlock({ label, content, toolCalls, isCompact = false }: SimpleMessageBlockProps) {
  // Don't show "null" for empty content
  const displayContent = content && content !== "null" && content.length > 0 ? content : null;
  const hasToolCalls = toolCalls && toolCalls.length > 0;

  // If no content and no tool calls, don't render
  if (!displayContent && !hasToolCalls) {
    return null;
  }

  return (
    <div style={{ marginBottom: isCompact ? 8 : 0 }}>
      <Text
        type="secondary"
        style={{
          fontSize: 10,
          letterSpacing: "0.5px",
          textTransform: "uppercase",
          display: "block",
          marginBottom: 3,
        }}
      >
        {label}
      </Text>

      {displayContent && (
        <div
          style={{
            fontSize: 13,
            lineHeight: 1.7,
            color: "#262626",
            whiteSpace: "pre-wrap",
            wordBreak: "break-word",
            marginBottom: hasToolCalls ? 6 : 0,
          }}
        >
          {displayContent}
        </div>
      )}

      {/* Inline tool calls for assistant messages in history */}
      {hasToolCalls && (
        <div>
          {toolCalls.map((tc, index) => (
            <SimpleToolCallBlock key={tc.id || index} tool={tc} compact={isCompact} />
          ))}
        </div>
      )}
    </div>
  );
}
