import { useState } from "react";
import Image from "../atoms/Image";
import Dropdown from "./Dropdown";

const User = ({ user }) => {

  const [showDropdown, setShowDropdown] = useState(false);
  
  return (
    <div className="user" onClick={() => setShowDropdown(!showDropdown)}>
      <Image src={user.imageUrl} />
      <div>{user.givenName}</div>
      {showDropdown ? <Dropdown /> : null}
    </div>
  );
}

export default User;