import React from "react";
import * as S from "./ProfileHeader.style";

const ProfileHeader = ({ config }) => {
  const { name, status, description, profileImage, theme } = config;

  return (
    <S.ProfileHeaderContainer theme={theme}>
      <S.ProfileImage src={profileImage} />
      <S.ProfileInfoContainer>
        <S.ProfileInfo>
          <S.Name theme={theme}>{name}</S.Name>
          <S.Status online={status === "online"} />
        </S.ProfileInfo>
        <S.Description>{description}</S.Description>
      </S.ProfileInfoContainer>
    </S.ProfileHeaderContainer>
  );
};
export default ProfileHeader;