import { Space } from "antd";
import PhoneNumberFormatter from "../../utils/PhoneFormatter";
import ChatArchiveButton from "../chat-archive-button/chat-archive-button.component";
import ChatConversationTitleTags from "../chat-conversation-title-tags/chat-conversation-title-tags.component";
import ChatLabelComponent from "../chat-label/chat-label.component";
import ChatPrintButton from "../chat-print-button/chat-print-button.component";
import ChatTagRoContainer from "../chat-tag-ro/chat-tag-ro.container";
import ChatMarkUnreadButton from "../chat-mark-unread-button/chat-mark-unread-button.component";

export function ChatConversationTitle({ conversation, onMarkUnread, markUnreadDisabled, markUnreadLoading }) {
  return (
    <Space className="chat-title" wrap>
      <PhoneNumberFormatter>{conversation?.phone_num}</PhoneNumberFormatter>

      <ChatLabelComponent conversation={conversation} />
      <ChatPrintButton conversation={conversation} />

      <ChatConversationTitleTags jobConversations={conversation?.job_conversations || []} />
      <ChatTagRoContainer conversation={conversation || []} />

      <ChatMarkUnreadButton disabled={markUnreadDisabled} loading={markUnreadLoading} onMarkUnread={onMarkUnread} />

      <ChatArchiveButton conversation={conversation} />
    </Space>
  );
}

export default ChatConversationTitle;