Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | import { HamburgerIcon } from "@chakra-ui/icons";
import { IconButton, useDisclosure } from "@chakra-ui/react";
import type { FunctionComponent } from "react";
import { HEADER_ANALYTICS } from "./constants";
import { MobileNav } from "./MobileNav";
import testIds from "./testIds";
import { useAnalytics } from "../../contexts/Analytics";
import { clickEvent } from "../../contexts/Analytics/util";
export const NavButton: FunctionComponent = () => {
const { trackCustomEvent } = useAnalytics();
const nav = useDisclosure({
onOpen: () =>
trackCustomEvent(clickEvent({ name: HEADER_ANALYTICS.MOBILE_NAV.OPEN })),
onClose: () =>
trackCustomEvent(clickEvent({ name: HEADER_ANALYTICS.MOBILE_NAV.CLOSE })),
});
return (
<>
<IconButton
aria-label="Navigation Menu"
borderRadius="md"
data-testid={testIds.navOpen}
display={{ lg: "none" }}
icon={<HamburgerIcon />}
onClick={nav.onOpen}
variant="ghost"
/>
<MobileNav {...nav} />
</>
);
};
|