open-vault/ui/app/templates/vault/cluster/secrets/backends.hbs

<header class="page-header">
  <div class="level">
    <div class="level-left">
      <h1 class="title is-3">
        Secrets Engines
      </h1>
    </div>
    <div class="level-right">
      {{#link-to 'vault.cluster.settings.mount-secret-backend' class="button has-icon-right is-ghost is-compact"}}
        Enable new engine
        {{i-con glyph="chevron-right" size=11}}
      {{/link-to}}
    </div>
  </div>
</header>

{{#each supportedBackends as |backend|}}
  {{#linked-block
    "vault.cluster.secrets.backend.list-root"
    backend.id
    class=(concat
      'box is-sideless is-marginless has-pointer '
      (if (get this (concat backend.accessor '-open')) 'has-background-white-bis')
    )
    data-test-secret-backend-link=backend.id
  }}
    <div class="level is-mobile">
      <div class="level-left">
        <div>
          <a data-test-secret-path
             href={{href-to 'vault.cluster.secrets.backend.list-root' backend.id}}
             class="has-text-black has-text-weight-semibold"
             >{{i-con glyph="folder" size=14 class="has-text-grey-light"}}{{backend.path}}</a>
          <br />
          <span class="tag">
            <code>
              {{#if (eq backend.type 'plugin')}}
                {{backend.type}}: {{backend.config.plugin_name}}
              {{else}}
                {{backend.type}}
              {{/if}}
            </code>
          </span>
          <code class="has-text-grey is-size-8">
          {{#if (eq backend.options.version 2)}}
            v2
          {{/if}}
          </code>
          <code class="has-text-grey is-size-8">
            {{backend.accessor}}
          </code>
        </div>
      </div>
      <div class="level-right is-flex is-paddingless is-marginless">
        <div class="level-item">
          <button class="button is-more-icon is-ghost" data-test-secret-backend-detail=true type="button" {{action (toggle (concat backend.accessor '-open') this)}}>
            {{i-con glyph="more" size=16 aria-label=(concat backend.path ' details')}}
          </button>
        </div>
      </div>
    </div>
    {{#if (get this (concat backend.accessor '-open'))}}
      {{partial "partials/backend-details"}}
    {{/if}}
  {{/linked-block}}
{{/each}}
{{#each unsupportedBackends as |backend|}}
  <div class="box is-sideless is-marginless has-background-transition {{if (get this (concat backend.accessor '-open')) 'has-background-white-bis'}}"
       data-test-secret-backend-row={{backend.id}}
    >
    <div class="level is-mobile">
      <div class="level-left">
        <div>
          <div class="has-text-weight-semibold">
            {{i-con glyph="folder" size=14 class="has-text-grey-light"}} {{backend.path}}
          </div>
          <span class="tag">
            <code>
              {{#if (eq backend.type 'plugin')}}
                {{backend.type}}: {{backend.config.plugin_name}}
              {{else}}
                {{backend.type}}
              {{/if}}
            </code>
          </span>
          <code class="has-text-grey is-size-8">
            {{backend.accessor}}
          </code>
        </div>
      </div>
      <div class="level-right is-flex is-paddingless is-marginless">
        <div class="level-item">
          <button class="button is-more-icon is-ghost" data-test-secret-backend-detail=true type="button" {{action (toggle (concat backend.accessor '-open') this)}}>
            {{i-con glyph="more" size=16 aria-label=(concat backend.path ' details')}}
          </button>
        </div>
      </div>
    </div>
    {{#if (get this (concat backend.accessor '-open'))}}
      {{partial "partials/backend-details"}}
    {{/if}}
  </div>
{{/each}}