import React, { useState, useContext, useEffect } from "react";
import RouterLink from "next/link";
import {
Flex,
Image,
Text,
IconButton,
Link,
Popover,
PopoverTrigger,
PopoverContent,
PopoverHeader,
PopoverBody,
PopoverArrow,
PopoverCloseButton,
useBreakpointValue,
Spacer,
ButtonGroup,
Button,
Menu,
MenuButton,
MenuList,
MenuItem,
Portal,
} from "@chakra-ui/react";
import {
HamburgerIcon,
QuestionOutlineIcon,
ArrowLeftIcon,
ArrowRightIcon,
ChevronDownIcon,
} from "@chakra-ui/icons";
import useRouter from "../core/hooks/useRouter";
import UIContext from "../core/providers/UIProvider/context";
import AccountIconButton from "./AccountIconButton";
import RouteButton from "./RouteButton";
import AddNewIconButton from "./AddNewIconButton";
import {
USER_NAV_PATHES,
SITEMAP,
PRIMARY_MOON_LOGO_URL,
PAGETYPE,
} from "../core/constants";
const AppNavbar = () => {
const ui = useContext(UIContext);
const [isSearchBarActive, setSearchBarState] = useState(false);
const router = useRouter();
useEffect(() => {
setSearchBarState(ui.searchBarActive);
}, [ui.searchBarActive]);
const iconSize = useBreakpointValue({
base: "md",
sm: "lg",
md: "lg",
lg: "lg",
xl: "lg",
"2xl": "lg",
});
const SupportPopover = () => {
return (
}
/>
Support
{`If you have any questions please don't hestitate to contact
us!`}
support@moonstream.to
Discord
);
};
return (
<>
{!ui.isMobileView && (
<>
{SITEMAP.map((item, idx) => {
if (
!item.children &&
item.type !== PAGETYPE.FOOTER_CATEGORY
) {
return (
{item.title}
);
} else if (!item.footerOnly) {
return (
);
}
})}
{USER_NAV_PATHES.map((item, idx) => {
return (
{item.title}
);
})}
>
)}
{ui.isMobileView && (
{!isSearchBarActive && (
}
onClick={() => {
ui.isMobileView
? ui.setSidebarToggled(ui.sidebarToggled ? false : true)
: ui.setSidebarVisible(ui.sidebarVisible ? false : true);
}}
/>
)}
{!isSearchBarActive && (
}
onClick={() => {
router.nextRouter.pathname === "/stream" &&
ui.isEntryDetailView
? ui.setEntryDetailView(false)
: router.nextRouter.back();
}}
/>
)}
{!isSearchBarActive && (
)}
{!isSearchBarActive && (
}
onClick={() => {
router.nextRouter.pathname === "/stream" &&
!ui.isEntryDetailView
? ui.setEntryDetailView(true)
: history.forward();
}}
/>
)}
{!isSearchBarActive && }
{!isSearchBarActive && (
)}
)}
>
);
};
export default AppNavbar;