import gravatar from "gravatar";
import React from "react";
import { Link } from "react-router-dom";
import { Avatar, ListItem, MenuButton } from "@sc/components/ui";

export default () => (
  <MenuButton
    className="menu-button"
    position="BOTTOM_RIGHT"
    id="avatar-menu"
    icon={
      <Avatar
        src={gravatar.url(localStorage.email)}
        role="presentation"
        alt="Your Avatar"
      />
    }
  >
    <Link to="/settings/profile">
      <ListItem>Update My Profile</ListItem>
    </Link>
    <Link to="/settings/domains">
      <ListItem>Manage My Domains</ListItem>
    </Link>
    <Link to="/settings/integrations">
      <ListItem>3rd Party Integrations</ListItem>
    </Link>
    <Link to="/login">
      <ListItem>Sign Out</ListItem>
    </Link>
  </MenuButton>
);