/* eslint-disable jsx-a11y/anchor-is-valid */ import React, { Component } from 'react'; import { observer, inject } from 'mobx-react'; import Link from 'next/link'; import LocationsMenu from 'ui/components/LocationsMenu/LocationsMenu'; import { withTranslation } from 'react-i18next'; import { routes } from 'env/routes'; import { withRouter } from 'next/router'; import withCustomComponent from 'ui/components/withCustomComponent'; import { ReferralNotice } from 'ui/_pages/home/ReferralModal/ReferralNotice'; import { CustomerInactiveNotice } from 'ui/components/Header/CustomerInactiveNotice'; import { ReferralModal } from 'ui/_pages/home/ReferralModal/ReferralModal'; import { slugify } from 'env/utils/strings'; import { ImpersonationNotice } from 'ui/components/Header/ImpersonationNotice'; import { AdminNotice } from 'ui/components/AdminNotice'; import { NotificationsMenuItem } from 'ui/components/Header/NotificationsMenuItem'; @withCustomComponent('Header') @withTranslation() @withRouter @inject( 'contentStore', 'appStore', 'authStore', 'floorPlanStore', 'bookingsStore', 'checkoutStore' ) @observer class Header extends Component { initStickyHeader = () => { const $ = window.$; function stickyHeader() { if (sticky.offset().top > scrollTop) { sticky.addClass('site-header--stuck'); $('body').addClass('header-stuck'); } else { sticky.removeClass('site-header--stuck'); $('body').removeClass('header-stuck'); } } if ($(window).width() > 992 && $('.site-header').length > 0) { var sticky = $('.site-header'), scrollTop = sticky.height(); stickyHeader(); $(window).scroll(function () { stickyHeader(); }); } }; componentDidMount() { this.initStickyHeader(); const { bookingsStore, appStore, floorPlanStore, contentStore, } = this.props; if (!bookingsStore.hasLoadedResources) bookingsStore.loadResources().catch(() => null); if (!appStore.hasLoadedReferralDiscounts) appStore.loadReferralDiscounts().catch((ex) => null); if (!contentStore.hasLoadedFaqArticles) contentStore.loadFaqArticles().catch((ex) => null); if (!contentStore.hasLoadedCommunityPerks) contentStore.loadCommunityPerks().catch((ex) => null); if (!floorPlanStore.hasLoadedItems) floorPlanStore.loadItems().catch((ex) => null); } render() { const { bookingsStore, checkoutStore, floorPlanStore, t, router, appStore, authStore, contentStore, } = this.props; const { publicCustomPages, referralDiscounts, business } = appStore; const { isLoggedIn, impersonationToken, customer } = authStore; const { resourceGroups, resources } = bookingsStore; const { faqArticles, communityPerks } = contentStore; if (!business) return

; const config = appStore.configuration; const customerIsInactive = customer && customer.Id > 0 && !customer.Active; const showDiscounts = referralDiscounts.length > 0 && customer && !customerIsInactive; const isAdmin = authStore.me?.CanAccessPlatform; const basketLink = ( ); return ( <> {appStore.showReferralModal && } {/* HEADER */}
{impersonationToken && } {customerIsInactive && } {showDiscounts && } {!customerIsInactive && !impersonationToken && !showDiscounts && isAdmin && }

{/* LOGO OR SPACE NAME */} {/* END LOGO OR SPACE NAME */} {/* COLLAPSE BUTTON */} {/* END COLLAPSE BUTTON */}

{/* MAIN NAVIGATION */} {/*
{ <>
{business.Name}

{t('Products and Services')}
{faqArticles.length > 0 && (
{t('Frequent Questions')}
)} {communityPerks.length > 0 && (
{t('Perks and Discounts')}
)} {publicCustomPages.map((page, i) => (
{t(page.Title || page.Name)}
))}

} {(config['PublicWebSite.CommunityBoard'] || config['PublicWebSite.Directory'] || config['PublicWebSite.Blog'] || config['PublicWebSite.Events'] || config['Jitsi.AlwaysOnRooms.Enabled']) && (
{t('Community')}
{config['PublicWebSite.Directory'] && (
{t('Directory')}
)} {config['PublicWebSite.CommunityBoard'] && (
-1 ? 'active' : '' } > {t('Discussion boards')}
)} {config['PublicWebSite.Events'] && (
-1 ? 'active' : '' } > {t('Events')}
)} {config['Jitsi.AlwaysOnRooms.Enabled'] && (
-1 ? 'active' : '' } > {t('Virtual Rooms')}
)} {config['Blog.Enabled'] && (
-1 ? 'active' : '' } > {t('Articles')}
)}
Discounts

)} {resources.length > 0 && (
{t('Bookings')}

{t('Calendar')}
{floorPlanStore.items.length > 0 && (
{t('Floor plans')}
)} {resourceGroups.map((resourceGroup, i) => (
{t(resourceGroup.groupName ?? 'Resources')}
))}

)}
{t('Blog')}

*/} {/* END MAIN NAVIGATION */} {/* USER NAVIGATION */}
{config['PublicWebSite.AboutUs'] && (
{t('About us')}
)} {config['PublicWebSite.Tour'] && (
{t('Take a tour')}
)} {config['PublicWebSite.Help'] && config['Members.AllowHelpMessages'] && (
{t('Help')}
)}
{t('FAQ')}
{!isLoggedIn && ( <>
{t('Sign in')}
{basketLink} {config['Members.CanSignup'] && (
{t('Become a member')}
)} )} {isLoggedIn && ( <>
authStore.logout()} href="#"> {t('Log out')}
{basketLink} {config['PublicWebSite.MyAccount'] && (
{t('My account')}
)} )}
{/* END USER NAVIGATION */}

{/* END HEADER */} ); } } export default Header;

Get in touch with us

Contact details