<div class="columns">
  {{#menu-sidebar title="Transit Actions" class="is-2"}}
    {{#each model.supportedActions as |supportedAction|}}
      <li>
        {{#secret-link
          mode="actions"
          secret=model.id
          class=(if (eq supportedAction selectedAction) "is-active")
          queryParams=(query-params action=supportedAction)
          data-test-transit-action-link=supportedAction
        }}
          {{capitalize supportedAction}}
        {{/secret-link}}
      </li>
    {{/each}}
  {{/menu-sidebar}}
  <div class="column is-10">
    <PageHeader as |p|>
      <p.top>
        {{key-value-header
          baseKey=model
          path="vault.cluster.secrets.backend.list"
          mode=mode
          root=backendCrumb
          showCurrent=true
        }}
      </p.top>
      <p.levelLeft>
        <h1 class="title is-3">
          {{model.id}}
        </h1>
      </p.levelLeft>
      <p.levelRight>
        {{#secret-link
          mode="show"
          secret=model.id
          class="button has-icon-right is-ghost is-compact"
        }}
          Details
          {{i-con glyph="chevron-right" size=11}}
        {{/secret-link}}
      </p.levelRight>
    </PageHeader>
    {{transit-key-actions
      selectedAction=selectedAction
      backend=backend
      key=model
      capabilities=capabilities
    }}
  </div>
</div>
