import { ChatMessage, ChatMessageProps } from "..";

import styles from "./ChatMessages.module.scss";

interface ChatMessagesProps {
  messages: ChatMessageProps["message"][];
  isLoadingAdvisorMessage?: boolean;
}

export default function ChatMessages({
  messages,
  isLoadingAdvisorMessage,
}: ChatMessagesProps) {
  return (
    <div className={styles.container}>
      {isLoadingAdvisorMessage && (
        <ChatMessage
          message={{
            id: "typing",
            type: "text",
            text: "…",
            role: "assistant",
            isRead: false,
            createdDate: new Date().toISOString(),
          }}
        />
      )}
      {messages.map(message => (
        <ChatMessage key={message.id} message={message} />
      ))}
    </div>
  );
}
