open-vault/ui/app/templates/components/secret-edit.hbs

<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 (and isV2 (eq mode 'edit'))}}
        Create New Version
      {{else if (eq mode 'edit')}}
        Edit Secret
      {{else}}
        {{key.id}}
      {{/if}}
    </h1>
  </p.levelLeft>
  <p.levelRight>
    {{#if canDelete}}
      <ConfirmAction
        @buttonClasses="button is-compact is-ghost has-icon-right"
        @onConfirmAction={{action "deleteKey"}}
        @confirmMessage={{if isV2 
          (concat "Are you sure you want to delete " model.id " AND ALL ITS VERSIONS?")
          (concat "Are you sure you want to delete " model.id "?")
        }}
        @cancelButtonText="Cancel"
        data-test-secret-delete="true"
        >
        Delete secret <ICon @glyph="chevron-right" @size="11" />
      </ConfirmAction>
    {{/if}}
  </p.levelRight>
</PageHeader>
<div class="secret-control-bar">
  <div class="control">
    <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" class="has-text-grey">JSON</label>
  </div>
  {{#if (and (eq mode 'show') canEdit)}}
    <div class="control">
      <LinkTo
        @params={{array (concat 'vault.cluster.secrets.backend.' (if (eq mode 'show') 'edit' 'show')) model.id }}
        @replace={{true}}
        class="link link-plain has-text-weight-semibold"
      >
      Edit Secret
      </LinkTo>
    </div>
  {{/if}}
  {{#if (and (eq @mode "show") this.isV2)}}
    <div class="control">
    <BasicDropdown 
      @class="popup-menu" 
      @horizontalPosition="auto-right" 
      @verticalPosition="below" 
      as |D|
    >
      <D.trigger 
        data-test-popup-menu-trigger="true"
        @class={{concat "popup-menu-trigger button is-ghost has-text-grey" (if D.isOpen " is-active")}} 
        @tagName="button" 
      >
      Version {{this.modelForData.version}} 
      <ICon @glyph="chevron-right" @size="11" />
      </D.trigger>
      <D.content @class="popup-menu-content ">
        <nav class="box menu">
          <ul class="menu-list">
            {{#if this.modelForData.destroyed}}
              <li class="action has-text-grey">
                <button type="button" class="link" disabled >
                  The data for {{this.model.id}} version {{this.modelForData.version}} has been destroyed.
                </button>
              </li>
            {{else}}
              <li class="action">
                {{#if this.modelForData.deleted}}
                  <button type="button" class="link" {{action "deleteVersion" "undelete"}}>
                    Undelete version
                  </button>
                {{else}}
                  <ConfirmAction
                    @buttonClasses="link has-text-danger"
                    @containerClasses="message-body is-block"
                    @messageClasses="is-block"
                    @onConfirmAction={{action "deleteVersion" "delete"}}
                    @confirmMessage={{
                      concat "Are you sure you want to delete " model.id " version " this.modelForData.version "?"
                    }}
                    @cancelButtonText="Cancel"
                    data-test-secret-v2-delete="true"
                    >
                      Delete version
                  </ConfirmAction>
                {{/if}}
              </li>
              {{!-- TODO - check if canDestroy --}}
              {{#if true}}
                <li class="action">
                  <ConfirmAction
                    @buttonClasses="link has-text-danger"
                    @containerClasses="message-body is-block"
                    @messageClasses="is-block"
                    @onConfirmAction={{action "deleteVersion" "destroy"}}
                    @confirmMessage={{
                      concat "This will permanently destroy " model.id " version " this.modelForData.version ". Are you sure you want to do this?"
                    }}
                    @cancelButtonText="Cancel"
                    data-test-secret-v2-destroy="true"
                    >
                      Permanently destroy version
                  </ConfirmAction>
                </li>
              {{/if}}
            {{/if}}
          </ul>
        </nav>
      </D.content>
    </BasicDropdown>
    </div>
    <div class="control">
    <BasicDropdown 
      @class="popup-menu" 
      @horizontalPosition="auto-right" 
      @verticalPosition="below" 
      as |D|
    >
      <D.trigger 
        data-test-popup-menu-trigger="true"
        @class={{concat "popup-menu-trigger button is-ghost has-text-grey" (if D.isOpen " is-active")}} 
        @tagName="button" 
      >
        History <ICon @glyph="chevron-right" @size="11" />
      </D.trigger>
      <D.content @class="popup-menu-content ">
        <nav class="box menu">
          <h5 class="list-header">Versions</h5>
          <ul class="menu-list">
            {{#each (reverse this.model.versions) as |secretVersion|}}
            <li class="action">
              <LinkTo class="link" @params={{array (query-params version=secretVersion.version)}}>
                Version {{secretVersion.version}}
                {{#if (eq secretVersion.version this.model.currentVersion)}}
                <ICon @glyph="checkmark-circled-outline" @excludeIconClass={{true}} @size="13" @class="has-text-success is-pulled-right" />
                {{else if secretVersion.deleted}}
                <ICon @glyph="cancel-square-outline" @size="13" @excludeIconClass={{true}} @class="has-text-grey is-pulled-right" />
                {{/if}}
              </LinkTo>
            </li>
            {{/each}}
          </ul>
        </nav>
      </D.content>
    </BasicDropdown>
    </div>
  {{/if}}
</div>
{{partial partialName}}