import React from "react";
import { Box, Button, HStack, IconButton } from "@chakra-ui/core";
import { Link, useLocation } from "react-router-dom";
import { useAuth0 } from "@auth0/auth0-react";
import { ChevronLeftIcon } from "@chakra-ui/icons";
import useCurrentUser from "./components/useCurrentUser";
import HomeLinkIcon from "../images/home-link-icon.png";
import HomeLinkIcon2x from "../images/home-link-icon@2x.png";
function GlobalHeader() {
const { pathname } = useLocation();
const isHomePage = pathname === "/";
return (
);
}
function HomeLink({ showArrow, ...props }) {
return (
);
}
function UserNavBarSection() {
const { isLoading, isAuthenticated, loginWithRedirect, logout } = useAuth0();
const { id, username } = useCurrentUser();
if (isLoading) {
return null;
}
if (isAuthenticated) {
return (
{username && (
Hi, {username}!
)}
{id && (
Items
)}
Modeling
logout({ returnTo: window.location.origin })}>
Log out
);
} else {
return (
Modeling
loginWithRedirect()}>Log in
);
}
}
function DressToImpressTitle(props) {
return (
Dress to Impress
);
}
const NavButton = React.forwardRef(({ icon, ...props }, ref) => {
const Component = icon ? IconButton : Button;
// Opacity is in a separate Box, to avoid overriding the built-in Button
// hover/focus states.
return (
);
});
export default GlobalHeader;