/* 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'; @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; bookingsStore.loadResources().catch(() => null); appStore.loadReferralDiscounts().catch((ex) => null); contentStore.loadFaqArticles().catch((ex) => null); floorPlanStore.loadItems().catch((ex) => null); } render() { const { bookingsStore, checkoutStore, floorPlanStore, t, router, appStore, authStore, contentStore, } = this.props; const { publicCustomPages, referralDiscounts, business } = appStore; const { isLoggedIn, customer } = authStore; const { resourceGroups, resources } = bookingsStore; const { faqArticles } = contentStore; if (!business) return

; const config = appStore.configuration; const customerIsInactive = customer && customer.Id > 0 && !customer.Active; const showDiscounts = referralDiscounts.length > 0 && customer && !customerIsInactive; const basketLink = (

{checkoutStore.basket.length > 0 && ( {checkoutStore.basket.length} )}

); return ( <> {appStore.showReferralModal && } {/* HEADER */}
{customerIsInactive && } {showDiscounts && }

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

{/* MAIN NAVIGATION */}
{(faqArticles.length > 0 || publicCustomPages.length > 0) && ( <>
{business.Name}

{t('Frequent Questions')}
{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, index) => (
{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')}
)} {!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;

Events

Past Events