import styles from "./styles.module.css";

interface IChatHeaderProps {
  name: string;
  avatar: string;
  classNameContainer?: string;
  hasBackButton?: boolean;
  clickBackButton: () => void;
}

function ChatHeader({
  name,
  avatar,
  classNameContainer = "",
  hasBackButton = true,
  clickBackButton,
}: IChatHeaderProps) {
  return (
    <div className={`${styles.container} ${classNameContainer}`}>
      {hasBackButton && (
        <div className={styles["back-button"]} onClick={clickBackButton}>
          <div className={styles["arrow"]} /> Advisors
        </div>
      )}
      <div className={styles.name}>
        {name}
        <span className={styles["online-status"]} />
      </div>
      <img className={styles.avatar} src={avatar} alt={name} />
    </div>
  );
}

export default ChatHeader;
