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 { createStructuredSelector } from "reselect";
import { connect } from "react-redux";

const mapStateToProps = createStructuredSelector({});

const mapDispatchToProps = () => ({});

export function ChatConversationTitle({ conversation }) {
  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 || []} />
      <ChatArchiveButton conversation={conversation} />
    </Space>
  );
}

export default connect(mapStateToProps, mapDispatchToProps)(ChatConversationTitle);