include ../user/components/profile-icon

-
  var haveVenueChannels = venue && Array.isArray(venue.channels) && (venue.channels.length > 0);
  var isLive = haveVenueChannels && !!venue.channels.find((channel) => channel.currentStatus && (channel.currentStatus.status === 'live'));

nav(uk-navbar).uk-navbar-container.uk-position-fixed.uk-position-top
  .uk-navbar-left
    a(href="", uk-toggle="target: #dtp-offcanvas").uk-link-reset.uk-navbar-item
      i.fas.fa-bars

    ul.uk-navbar-nav
      li(class={ 'uk-active': currentView === 'home' })
        a(href="/", title="Home").uk-navbar-item
          +renderButtonImage(`/img/icon/${site.domainKey}/icon-36x36.png`, 'Home')

      if haveVenueChannels
        li(class={ 'uk-active': currentView === 'venue' })
          a(href="/venue", title=`Channel lineup for ${site.name}`)
            if isLive
              span 🔴
            else
              span
                i.fas.fa-tv
            span.uk-margin-small-left= isLive ? 'On Air' : 'Channels'

  div(class="uk-visible@m").uk-navbar-left
    //- Site name
    ul.uk-navbar-nav
      if user
        li(class={ 'uk-active': currentView === 'chat' })
          a(href="/chat", title= "chat")
            +renderButtonIcon('fa-comment-alt', 'Chat')

      each menuItem in mainMenu
        li(class={ 'uk-active': (pageSlug === menuItem.slug) })
          a(href= menuItem.url, title= menuItem.label)
            +renderButtonIcon(menuItem.icon || 'fa-file', menuItem.label)

      if Array.isArray(links) && (links.length > 0)
        li
          a(href="")
            +renderButtonIcon('fa-link', 'Links')
          .uk-navbar-dropdown
            ul.uk-nav.uk-navbar-dropdown-nav
              each link in links
                li
                  +renderSiteLink(link)

  .uk-navbar-right
    if user
      ul.uk-navbar-nav
        li(class={ 'uk-active': currentView === 'notification' })
          a(href="/notification", title="Notifications")
            .uk-position-relative
              i.fas.fa-bell.uk-text-large
              if middleware.notifications.newCount > 0
                span(style="top: -11px; right: -15px; padding: 0 3px; border-radius: 4px; background-color: #ff0013; color: #e8e8e8;").uk-position-absolute= formatCount(middleware.notifications.newCount)

    .uk-navbar-item
      if user
        div.no-select
          +renderProfileIcon(user, `${user.displayName || user.username}'s Menu`, 'navbar')

        div(uk-dropdown={ mode: 'click' }).uk-navbar-dropdown
          ul.uk-nav.uk-navbar-dropdown-nav
            li.uk-nav-heading.uk-text-center= user.displayName || user.username
            li.uk-nav-divider
            li
              a(href= user.core ? `/user/core/${user.username}` : `/user/${user.username}`)
                span.nav-item-icon
                  i.fas.fa-user
                span Profile
            li
              a(href= user.core ? `/user/core/${user._id}/settings` : `/user/${user._id}/settings`)
                span.nav-item-icon
                  i.fas.fa-cog
                span Settings

            if user.flags && user.flags.isAdmin
              li.uk-nav-divider
              li
                a(href='/admin')
                  span.nav-item-icon
                    i.fas.fa-user-lock
                  span Admin

            li.uk-nav-divider

            li
              a(href='/auth/logout')
                span.nav-item-icon
                  i.fas.fa-sign-out-alt
                span Logout
      else
        ul.uk-navbar-nav
          li
            a(href='/welcome').uk-button.uk-button-link
              span.nav-item-icon
                i.fas.fa-sign-in-alt
              span(class="uk-visible@m").uk-margin-small-left GET STARTED!
