import classNames from 'classnames';
import styles from './index.module.scss';
import { Settings } from '../../types/types';

export default function MessageBox({
  user,
  settings,
  children,
}: {
  user: string;
  settings: Settings;
  children: any;
}) {
  return (
    <div
      className={classNames(
        styles['chatbot-message'],
        user === 'bot'
          ? styles['chatbot-message-bot']
          : styles['chatbot-message-user']
      )}
    >
      <p
        className={styles['chatbot-message-content']}
        style={
          user === 'user'
            ? { backgroundColor: settings.chatBotPrimaryColor }
            : undefined
        }
      >
        {children}
      </p>
    </div>
  );
}