"use client";
/**
 * MessageContent 消息内容容器
 *
 * 原始 Dart: lib/ui/chat/widgets/message_content.dart（43 行）
 *
 * 决定渲染 ImageBubble 还是 TextBubble：
 *   - 有 imageUrl：渲染 ImageBubble（图片）
 *   - 有 content 且非 "[图片]" 占位符：渲染 TextBubble（文字）
 *   - 两者都有：图片在上，文字在下
 */
import { ImageBubble } from "./image-bubble";
import { TextBubble } from "./text-bubble";

export interface MessageContentProps {
  content: string;
  imageUrl?: string | null;
  isFromAI: boolean;
}

const IMAGE_PLACEHOLDER = "[图片]";

export function MessageContent({ content, imageUrl, isFromAI }: MessageContentProps) {
  const hasImage = imageUrl != null && imageUrl.length > 0;
  const hasText = content.length > 0 && content !== IMAGE_PLACEHOLDER;

  return (
    <div
      style={{
        display: "flex",
        flexDirection: "column",
        // 关键：在 row flex 父中撑开（不依赖 content 循环）—— 让 TextBubble 能拿到真实宽度
        flex: "1 1 0",
        // 防超长 content（图片 / 超长 url）撑爆父
        minWidth: 0,
        alignItems: isFromAI ? "flex-start" : "flex-end",
        gap: 8,
      }}
    >
      {hasImage && imageUrl && <ImageBubble imageUrl={imageUrl} />}
      {hasText && <TextBubble content={content} isFromAI={isFromAI} />}
    </div>
  );
}
