import type { ChatHitlPart, HitlSubmissionOptions, ChatMessage as ChatMessageModel } from "@agents24/react"
import type { FeedbackReason, HitlResponse } from "@agents24/client"
import type { AgentChatRuntimeHitlActionState } from "@agents24/chat-react/runtime"
import { AgentChatDefaultActions, AgentChatUserMessageActionRow, ChatAttachmentRows, useCompletionActionEntrance, type ChatAttachmentContentResolver } from "@agents24/chat-react/ui"
import * as React from "react"

import { MessageParts } from "./message-parts"
import { Bubble, BubbleContent } from "../ui/bubble"
import { Message, MessageContent, MessageFooter } from "../ui/message"
import type { Agents24ChatTimelineSlotProps } from "../../app"

type Props = {
  animateCompletion: boolean
  message: ChatMessageModel
  getHitlActionState: (part: ChatHitlPart) => AgentChatRuntimeHitlActionState | undefined
  isLoading: boolean
  onHitlAction: (part: ChatHitlPart, response: HitlResponse, options?: HitlSubmissionOptions) => Promise<void>
  onRegenerate: () => Promise<void>
  allowFeedback: boolean
  onSetFeedback: (
    input: { rating: "like" | "dislike" | null; reason?: FeedbackReason | null; comment?: string | null },
  ) => Promise<void>
  Timeline?: React.ComponentType<Agents24ChatTimelineSlotProps>
  resolveAttachmentContent?: ChatAttachmentContentResolver
}

export function ChatMessage({
  animateCompletion,
  allowFeedback,
  getHitlActionState,
  isLoading,
  message,
  onHitlAction,
  onRegenerate,
  onSetFeedback,
  resolveAttachmentContent,
  Timeline,
}: Props) {
  const isUser = message.role === "user"
  const showCompletionActions = !isUser && message.isFinal !== false && !isLoading
  const animateCompletionActions = useCompletionActionEntrance(showCompletionActions, message.runId, animateCompletion)
  return (
    <Message align={isUser ? "end" : "start"}>
      <MessageContent className={isUser ? "gap-0" : undefined}>
        {isUser && message.attachments?.length ? (
          <ChatAttachmentRows
            attachments={message.attachments}
            className="mb-2"
            resolveContent={resolveAttachmentContent}
          />
        ) : null}
        <Bubble variant={isUser ? "secondary" : "ghost"} align={isUser ? "end" : "start"} className={isUser ? "max-w-[min(75%,42rem)]" : "max-w-full overflow-visible"}>
          <BubbleContent className={isUser ? "px-4 py-2.5" : "w-full overflow-visible"}>
            <MessageParts
              getHitlActionState={getHitlActionState}
              isLoading={isLoading}
              message={message}
              onHitlAction={onHitlAction}
              Timeline={Timeline}
            />
          </BubbleContent>
        </Bubble>
        {isUser && (
          <AgentChatUserMessageActionRow>
            <AgentChatDefaultActions
              handlers={{
                onCopy: (content) => { void navigator.clipboard.writeText(content).catch(() => undefined) },
              }}
              message={message}
            />
          </AgentChatUserMessageActionRow>
        )}
        {showCompletionActions && (
          <MessageFooter className="a24-chat-message-action-row--assistant gap-1">
            <AgentChatDefaultActions
              animateCompletion={animateCompletionActions}
              handlers={{
                feedback: message.feedback,
                onCopy: (content) => { void navigator.clipboard.writeText(content).catch(() => undefined) },
                onRetry: () => onRegenerate(),
                onSetFeedback: allowFeedback ? (_message, input) => onSetFeedback(input) : undefined,
              }}
              message={message}
            />
          </MessageFooter>
        )}
      </MessageContent>
    </Message>
  )
}