{{#with (options-for-backend model.engineType) as |options|}}
  <PageHeader as |p|>
    <p.top>
      <KeyValueHeader @baseKey={{baseKey}} @path="vault.cluster.secrets.backend.list" @root={{backendCrumb}}>
        <li>
          <span class="sep">
            /
          </span>
          <LinkTo @route="vault.cluster.secrets">
            secrets
          </LinkTo>
        </li>
      </KeyValueHeader>
    </p.top>
    <p.levelLeft>
      <h1 class="title is-3">
        <Icon @glyph={{or model.engineType "secrets"}} @size="xl" class="has-text-grey-light" />
        {{model.id}}
        {{#if (eq model.options.version 2)}}
          <span class="tag">
            Version 2
          </span>
        {{/if}}
      </h1>
    </p.levelLeft>
  </PageHeader>
  {{#if options.tabs}}
    <div class="tabs-container box is-bottomless is-marginless is-fullwidth is-paddingless">
      <nav class="tabs">
        <ul>
          {{#each options.tabs as |oTab|}}
            {{#if oTab.tab}}
              <LinkTo @route="vault.cluster.secrets.backend.list-root" @query={{hash tab=oTab.tab}} @tagName="li" @activeClass="is-active" data-test-tab={{oTab.label}}>
                <LinkTo @route="vault.cluster.secrets.backend.list-root" @query={{hash tab=oTab.tab}}>
                  {{oTab.label}}
                </LinkTo>
              </LinkTo>
            {{else}}
              <LinkTo @route="vault.cluster.secrets.backend.list-root" @query={{hash tab=""}} @tagName="li" @activeClass="is-active" data-test-tab={{oTab.label}}>
                <LinkTo @route="vault.cluster.secrets.backend.list-root" @query={{hash tab=""}}>
                  {{oTab.label}}
                </LinkTo>
              </LinkTo>
            {{/if}}
          {{/each}}
          <LinkTo @route="vault.cluster.secrets.backend.configuration" @tagName="li" @activeClass="is-active">
            <LinkTo @route="vault.cluster.secrets.backend.configuration" data-test-configuration-tab={{true}}>
              Configuration
            </LinkTo>
          </LinkTo>
        </ul>
      </nav>
    </div>
  {{else}}
    {{! if there are no tabs in the options, we'll hardcode them here }}
    <div class="tabs-container box is-bottomless is-marginless is-fullwidth is-paddingless">
      <nav class="tabs">
        <ul>
          {{#if (contains model.engineType (supported-secret-backends))}}
            <LinkTo @route="vault.cluster.secrets.backend.list-root" @tagName="li" @activeClass="is-active" @current-when="vault.cluster.secrets.backend.list-root vault.cluster.secrets.backend.list">
              <LinkTo @route="vault.cluster.secrets.backend.list-root">
                {{capitalize (pluralize options.item)}}
              </LinkTo>
            </LinkTo>
          {{/if}}
          <LinkTo @route="vault.cluster.secrets.backend.configuration" @tagName="li" @activeClass="is-active">
            <LinkTo @route="vault.cluster.secrets.backend.configuration" data-test-configuration-tab={{true}}>
              Configuration
            </LinkTo>
          </LinkTo>
        </ul>
      </nav>
    </div>
  {{/if}}
{{/with}}