/* global React */

window.Masthead = function Masthead() {
  const links = [
    { href: "#journey", label: "Story" },
    { href: "#cases", label: "Cases" },
    { href: "#work", label: "Work" },
    { href: "#credentials", label: "Proof" },
  ];

  return (
    <nav className="masthead">
      <div className="masthead__progress" aria-hidden="true" />
      <a href="#top" className="masthead__wordmark">
        Simran <em>Sampat</em>
      </a>
      <div className="masthead__center">Analytics · Marketing · Strategy</div>
      <div className="masthead__right">
        <div className="masthead__links">
          {links.map((l) => (
            <a key={l.href} href={l.href}>{l.label}</a>
          ))}
        </div>
        <a href="mailto:sampatsimran@gmail.com" className="masthead__cta">Email</a>
      </div>
    </nav>
  );
};