<section class="header has-tabs clearfix p-0">
  <ul class="tab-nav">
    <li>
      {{#link-to "project-istio.metrics"}}{{t "istio.nav.metrics"}}{{/link-to}}
    </li>
    {{#unless iconDisabled}}
      <li>
        {{#link-to "project-istio.graph"}}{{t "istio.nav.graph"}}{{/link-to}}
      </li>
    {{/unless}}
    <li>
      {{#link-to "project-istio.destination-rules"}}{{t "istio.nav.destinationRules.label"}}{{/link-to}}
    </li>
    <li>
      {{#link-to "project-istio.virtual-services"}}{{t "istio.nav.virtualServices.label"}}{{/link-to}}
    </li>
    {{!-- <li>
      {{#link-to "project-istio.rules"}}{{t "istio.nav.rules"}}{{/link-to}}
    </li> --}}
  </ul>

  <div class="right-buttons">
    <div class="inline-block vertical-bottom mr-20">
      {{#unless iconDisabled}}
        <a
          class="inline-block"
          href={{kialiUrl}}
          target="_blank"
          rel="nofollow noopener noreferrer"
        >
          <div class="kiali"></div>
        </a>

        <a
          class="inline-block"
          href={{jaegerUrl}}
          target="_blank"
          rel="nofollow noopener noreferrer"
        >
          <div class="jaeger"></div>
        </a>
      {{/unless}}

      {{#if (or grafana.istioUrl project.enableProjectMonitoring)}}
        <a
          class="inline-block"
          href={{grafanaUrl}}
          target="_blank" rel="nofollow noopener noreferrer">
          <div class="grafana"></div>
        </a>

        <a
          class="inline-block"
          href={{prometheusUrl}}
          target="_blank"
          rel="nofollow noopener noreferrer"
        >
          <div class="prometheus-icon"></div>
        </a>
      {{/if}}
    </div>
    {{yield}}
  </div>
</section>
