'use client'

import { CardRenderer, isCardMessage } from '../cards'
import { UserMessage } from './user-message'
import { AssistantMessage } from './assistant-message'
import type { ChatMessageProps } from './types'

export function ChatMessage({ 
  role, 
  content,
  messageId,
  images,
  toolInvocations, 
  isStreaming,
  onDeleteMessage, 
  onNavigate,
  onNavigateToDocPage,
  onOpenFile,
  cardActions 
}: ChatMessageProps) {
  if (role === 'user') {
    return <UserMessage content={content} images={images} cardActions={cardActions} />
  }

  if (role === 'assistant') {
    // Check if this is a card message (like response options)
    if (isCardMessage(content)) {
      return <CardRenderer content={content} actions={cardActions} />
    }
    
    return (
      <AssistantMessage 
        content={content}
        messageId={messageId}
        toolInvocations={toolInvocations}
        isStreaming={isStreaming}
        onDeleteMessage={onDeleteMessage}
        onNavigate={onNavigate}
        onNavigateToDocPage={onNavigateToDocPage}
        onOpenFile={onOpenFile}
      />
    )
  }

  return null
}
