\r\n {location.pathname.toLowerCase() === '/bookshop' || location.pathname.toLowerCase() === '/bookshoppayment' || location.pathname.toLowerCase().includes('/bookshoporderfailed') || location.pathname.toLowerCase().includes('/bookshopcompleteorder') ?\r\n \r\n \r\n \r\n {props.children}\r\n \r\n \r\n
\r\n :\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n {props.children}\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n \r\n }\r\n \r\n );\r\n}\r\nexport default Layout;","import * as React from 'react';\r\nimport { createStyles, Theme, makeStyles, useTheme } from '@material-ui/core/styles';\r\nimport AppBar from '@material-ui/core/AppBar';\r\nimport Toolbar from '@material-ui/core/Toolbar';\r\nimport ShoppingCartIcon from '@material-ui/icons/ShoppingCart';\r\nimport NotificationsIcon from '@material-ui/icons/Notifications';\r\nimport AccountCircleIcon from '@material-ui/icons/AccountCircle';\r\nimport MenuIcon from '@material-ui/icons/Menu';\r\nimport { Link, Link as RouterLink, LinkProps as RouterLinkProps, NavLink, useLocation } from 'react-router-dom';\r\nimport Button, { ButtonProps } from '@material-ui/core/Button';\r\nimport IconButton from '@material-ui/core/IconButton';\r\nimport Badge from '@material-ui/core/Badge';\r\nimport Grid from '@material-ui/core/Grid';\r\nimport MenuItem, { MenuItemProps } from '@material-ui/core/MenuItem';\r\nimport authService from './api-authorization/AuthorizeService';\r\nimport { ApplicationPaths } from './api-authorization/ApiAuthorizationConstants';\r\nimport OrganisationDropdown from './Users/OrganisationDropdown';\r\nimport { useCartState } from './Checkout/CartContext';\r\nimport Popper from '@material-ui/core/Popper';\r\nimport ClickAwayListener from '@material-ui/core/ClickAwayListener';\r\nimport MenuList from '@material-ui/core/MenuList';\r\nimport Grow from '@material-ui/core/Grow';\r\nimport Typography from '@material-ui/core/Typography';\r\nimport useMediaQuery from '@material-ui/core/useMediaQuery';\r\nimport Bugsnag from '@bugsnag/js';\r\n\r\nconst useStyles = makeStyles((theme: Theme) =>\r\n createStyles({\r\n root: {\r\n display: 'flex',\r\n },\r\n appBar: {\r\n zIndex: theme.zIndex.drawer + 1,\r\n paddingLeft: 0,\r\n paddingRight: 0\r\n },\r\n content: {\r\n flexGrow: 1,\r\n padding: theme.spacing(3),\r\n },\r\n logo: {\r\n marginRight: 'auto',\r\n height: 'inherit'\r\n },\r\n center: {\r\n marginRight: 'auto',\r\n marginLeft: 'auto'\r\n },\r\n account: {\r\n marginLeft: 'auto'\r\n },\r\n bar: {\r\n height: 64\r\n },\r\n profileButton: {\r\n textTransform: 'none'\r\n },\r\n profileIcon: {\r\n color: theme.palette.secondary.main\r\n },\r\n barButton: {\r\n transition: 'all .3s ease',\r\n color: theme.palette.primary.main,\r\n marginRight: theme.spacing(2),\r\n borderRadius: 0,\r\n borderBottom: `2px solid transparent`,\r\n '&:hover, &:focus, &$focusVisible': {\r\n color: theme.palette.tertiary.main,\r\n borderBottom: `2px solid ${theme.palette.tertiary.main}`,\r\n backgroundColor: \"inherit\",\r\n }\r\n },\r\n activeBarButton: {\r\n color: theme.palette.tertiary.main,\r\n borderBottom: `2px solid ${theme.palette.tertiary.main}`,\r\n marginRight: theme.spacing(2),\r\n borderRadius: 0,\r\n },\r\n focusVisible: {\r\n },\r\n formControl: {\r\n\r\n margin: 'auto',\r\n minWidth: 120,\r\n },\r\n select: {\r\n borderRadius: 0,\r\n margin: 8\r\n },\r\n selectBox: {\r\n\r\n paddingLeft: 14,\r\n paddingTop: 14,\r\n paddingRight: 35,\r\n paddingBottom: 14,\r\n\r\n },\r\n activeLink: {\r\n color: theme.palette.tertiary.main,\r\n borderBottom: `2px solid ${theme.palette.tertiary.main}`,\r\n },\r\n popper: {\r\n top: '13px !important',\r\n zIndex: 1300\r\n },\r\n profilePopper: {\r\n zIndex: 1300,\r\n [theme.breakpoints.down('md')]: {\r\n top: '10px !important'\r\n }\r\n },\r\n menu: {\r\n backgroundColor: '#f0edec',\r\n borderRadius: 0\r\n },\r\n menuItem: {\r\n backgroundColor: '#f0edec',\r\n color: theme.palette.primary.main,\r\n '&:focus, &:hover': {\r\n backgroundColor: '#f0edec',\r\n color: theme.palette.tertiary.main,\r\n },\r\n },\r\n hideWhenSmall: {\r\n [theme.breakpoints.down('md')]: {\r\n display: 'none'\r\n }\r\n }\r\n }),\r\n);\r\n\r\ninterface AppButtonProps {\r\n text: string;\r\n link: string;\r\n}\r\n\r\nfunction UnderlineNavButton(props: AppButtonProps) {\r\n const { text, link } = props;\r\n const classes = useStyles()\r\n\r\n const renderLink = React.useMemo(\r\n () =>\r\n React.forwardRef