import { HTMLAttributes } from "react";
import styles from "./styles.module.scss";

interface IEmailSubstrateProps {
  email: string;
}

function EmailSubstrate({
  email,
  ...props
}: IEmailSubstrateProps & HTMLAttributes<HTMLDivElement>) {
  return (
    <div {...props} className={`${styles.container} ${props.className}`}>
      <p className={styles.email}>{email}</p>
      <div className={styles.icon}>{email[0]?.toUpperCase()}</div>
    </div>
  );
}

export default EmailSubstrate;
