{*
SPDX-FileCopyrightText: © 2023 Olivier Meunier <olivier@neokraft.net>

SPDX-License-Identifier: AGPL-3.0-only
*}
{{- import "./_libs/common" -}}

<div class="layout-topnav" id="menu">
  {{- try -}}
    {{- yield menuButton(name=gettext("Open menu")) content -}}
      {{- yield icon(name="o-menu") -}}
    {{- end -}}
  {{- end -}}
  <div class="logo">
    <a href="{{ urlFor(`/`) }}" title="Home page">{{ yield icon(name="o-logo-square", class="", svgClass="h-11 w-11") }}</a>
  </div>
  <div class="mainmenu">
    <menu class="grow">
      {{- if  hasPermission("bookmarks", "read") -}}
      {{ yield mainMenuItem(name=gettext("Bookmarks"), path="/bookmarks/unread", icon="o-library",
                            current=pathIs(`/bookmarks`, `/bookmarks/*`)) }}
      {{- end -}}
    </menu>

    {{- if !user.IsAnonymous() -}}
    <menu class="flex-shrink-0">
      <li class="no-js:hidden">
        <button type="button" data-controller="theme" data-action="theme#toggleTheme"
         title="{{ gettext(`Change theme`) }}">
          <span data-theme-target="icon">
            {{ yield icon(name="o-theme-system") }}
          </span>
          <span class="sr-only">{{ gettext("Change color theme") }}</span>
          <template data-theme-target="iconLight">{{ yield icon(name="o-theme-light") }}</template>
          <template data-theme-target="iconDark">{{ yield icon(name="o-theme-dark") }}</template>
          <template data-theme-target="iconSystem">{{ yield icon(name="o-theme-system") }}</template>
        </button>
      </li>
      {{- if  hasPermission("profile", "read") -}}
        {{ yield mainMenuItem(name=gettext("Settings"), path="/profile", icon="o-settings",
                              current=pathIs(`/admin`, `/admin/*`, `/profile`, `/profile/*`)) }}
      {{- end -}}
      {{ yield mainMenuItem(name=gettext("Documentation"), path="/docs/", icon="o-help",
                            current=pathIs(`/docs/*`)) }}
    </menu>
    {{- end -}}
  </div>
</div>