<PageHeader as |p|>
  <p.top>
    {{key-value-header
      baseKey=baseKey
      path="vault.cluster.secrets.backend.list"
      mode=mode
      root=root
      showCurrent=true
    }}
  </p.top>
  <p.levelLeft>
    <h1 class="title is-3">
      {{#if (eq mode "create") }}
        Create Secret
      {{else if (eq mode 'edit')}}
        Edit Secret
      {{else}}
        {{key.id}}
      {{/if}}
    </h1>
  </p.levelLeft>
</PageHeader>
<div class="box is-sideless has-background-grey-lighter has-slim-padding is-marginless">
  <div class="level">
    <div class="level-left">
    </div>
    <div class="level-right is-marginless">
      <div class="field is-horizontal is-flex-end is-single-line">
        <div class="control is-flex">
          <input
            data-test-secret-json-toggle=true
            id="json"
            type="checkbox"
            name="json"
            class="switch is-rounded is-success is-small"
            checked={{showAdvancedMode}}
            onchange={{action "toggleAdvanced" value="target.checked"}}
            disabled={{and (eq mode 'show') secretDataIsAdvanced}}
          />
          <label for="json">JSON</label>
        </div>
        {{#if (and (not-eq mode 'create') (or capabilities.canUpdate capabilities.canDelete))}}
          <div class="control is-flex">
            {{input
              id="edit"
              type="checkbox"
              name="navToEdit"
              class="switch is-rounded is-success is-small"
              checked=(eq mode 'edit')
              change=(action (nav-to-route (concat 'vault.cluster.secrets.backend.' (if (eq mode 'show') 'edit' 'show')) key.id replace=true) )
            }}
            <label for="edit">Edit</label>
          </div>
        {{/if}}
      </div>
    </div>
  </div>
</div>
{{partial partialName}}
