open-vault/ui/app/templates/components/secret-create-or-update.hbs

265 lines
9.1 KiB
Handlebars

{{#if (eq @mode "create")}}
<form
class={{if @showAdvancedMode "advanced-edit" "simple-edit"}}
onsubmit={{action "createOrUpdateKey" @mode}}
aria-label="secret create form"
{{did-insert this.setup @secretData @model @mode}}
>
<div class="field box is-fullwidth is-sideless is-marginless">
<NamespaceReminder @mode="create" @noun="secret" />
<MessageError @model={{@modelForData}} @errorMessage={{this.error}} />
<label class="is-label" for="kv-key">Path for this secret</label>
<p class="control is-expanded">
<Input
autocomplete="off"
spellcheck="false"
data-test-secret-path="true"
id="kv-key"
class="input {{if (get this.validationMessages 'path') 'has-error-border'}}"
@value={{get @modelForData @modelForData.pathAttr}}
{{on "keyup" (perform this.waitForKeyUp "path" value="target.value")}}
/>
</p>
{{#if (get this.validationMessages "path")}}
<AlertInline
@type="danger"
@message={{get this.validationMessages "path"}}
@paddingTop={{true}}
@isMarginless={{true}}
/>
{{/if}}
{{#if @modelForData.isFolder}}
<p class="help has-text-danger">
The secret path may not end in
<code>/</code>
</p>
{{/if}}
{{#if this.pathWhiteSpaceWarning}}
<div class="has-top-margin-m">
<AlertBanner
@type="warning"
@message="Your secret path contains whitespace. If this is desired, you'll need to encode it with %20 in API calls."
@marginTop={{true}}
data-test-whitespace-warning
/>
</div>
{{/if}}
</div>
{{#if @showAdvancedMode}}
<div class="form-section">
<JsonEditor
@title={{if @isV2 "Version Data" "Secret Data"}}
@value={{this.codemirrorString}}
@valueUpdated={{action "codemirrorUpdated"}}
@onFocusOut={{action "formatJSON"}}
/>
</div>
{{else}}
<div class="form-section">
<label class="title is-5">
Secret data
</label>
{{#each @secretData as |secret index|}}
<div class="info-table-row">
<div class="column is-one-quarter info-table-row-edit">
<Input
data-test-secret-key={{true}}
@value={{secret.name}}
placeholder="key"
{{on "change" (action "handleChange")}}
class="input"
autocomplete="off"
spellcheck="false"
/>
</div>
<div class="column info-table-row-edit">
<MaskedInput
@name={{secret.name}}
@onChange={{fn this.handleMaskedInputChange secret index}}
@value={{secret.value}}
data-test-secret-value="true"
/>
</div>
<div class="column is-narrow info-table-row-edit">
{{#if (eq @secretData.length (inc index))}}
<button
type="button"
{{action "addRow"}}
class="button is-outlined is-primary"
data-test-secret-add-row="true"
>
Add
</button>
{{else}}
<button
class="button has-text-grey is-expanded is-icon"
type="button"
{{on "click" (fn this.deleteRow secret.name)}}
aria-label="Delete row"
>
<Icon @name="trash" class="has-text-grey-light" />
</button>
{{/if}}
</div>
</div>
{{#if this.validationMessages.key}}
<AlertInline
@type="danger"
@message={{this.validationMessages.key}}
@paddingTop={{true}}
@isMarginless={{true}}
/>
{{/if}}
{{/each}}
</div>
{{/if}}
{{! must have UPDATE permissions to add secret metadata. Create only will not work }}
{{#if (and @isV2 @canUpdateSecretMetadata)}}
<ToggleButton
@isOpen={{this.showMetadata}}
@openLabel="Hide secret metadata"
@closedLabel="Show secret metadata"
@onClick={{fn (mut this.showMetadata)}}
class="is-block"
data-test-show-metadata-toggle
/>
{{#if this.showMetadata}}
<SecretEditMetadata
@model={{@model}}
@mode="create"
@updateValidationErrorCount={{action "updateValidationErrorCount"}}
/>
{{/if}}
{{/if}}
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button
type="submit"
disabled={{or @buttonDisabled this.validationErrorCount this.error}}
class="button is-primary"
data-test-secret-save={{true}}
>
Save
</button>
</div>
<div class="control">
<SecretLink @mode="list" @secret={{@model.parentKey}} class="button">
Cancel
</SecretLink>
</div>
</div>
</form>
{{/if}}
{{#if (eq @mode "edit")}}
{{! no metadata option because metadata is version agnostic }}
<form
onsubmit={{action "createOrUpdateKey" "edit"}}
aria-label="secret edit form"
{{did-insert this.setup @secretData @model @mode}}
>
<div class="box is-sideless is-fullwidth is-marginless padding-top">
<MessageError @model={{@modelForData}} @errorMessage={{this.error}} />
{{#if (eq @canReadSecretData false)}}
<AlertBanner
@type="warning"
@message="You do not have read permissions. If a secret exists here creating a new secret will overwrite it."
data-test-warning-no-read-permissions
/>
{{/if}}
<NamespaceReminder @mode="edit" @noun="secret" />
{{#if this.isCreateNewVersionFromOldVersion}}
<div class="form-section">
<AlertBanner
@type="warning"
@class="is-marginless"
@message="You are creating a new version based on data from Version {{@model.selectedVersion.version}}. The current version for {{@model.id}} is Version {{@model.currentVersion}}."
/>
</div>
{{/if}}
{{#if @showAdvancedMode}}
<div class="form-section">
<JsonEditor
@title={{if @isV2 "Version Data" "Secret Data"}}
@value={{this.codemirrorString}}
@valueUpdated={{action "codemirrorUpdated"}}
@onFocusOut={{action "formatJSON"}}
/>
</div>
{{else}}
<div class="form-section">
<label class="title is-5">
{{#if @isV2}}
Version data
{{else}}
Secret data
{{/if}}
</label>
{{#each @secretData as |secret index|}}
<div class="columns is-variable has-no-shadow">
<div class="column is-one-quarter">
<Input
data-test-secret-key={{true}}
@value={{secret.name}}
placeholder="key"
{{on "change" (action "handleChange")}}
class="input"
autocomplete="off"
spellcheck="false"
/>
</div>
<div class="column">
<MaskedInput
@name={{secret.name}}
@onChange={{fn this.handleMaskedInputChange secret index}}
@value={{secret.value}}
data-test-secret-value="true"
/>
</div>
<div class="column is-narrow">
{{#if (eq @secretData.length (inc index))}}
<button
type="button"
{{action "addRow"}}
class="button is-outlined is-primary"
data-test-secret-add-row="true"
>
Add
</button>
{{else}}
<button
class="button has-text-grey is-expanded is-icon"
type="button"
{{action "deleteRow" secret.name}}
aria-label="Delete row"
>
<Icon @name="trash" class="has-text-grey-light" />
</button>
{{/if}}
</div>
</div>
{{/each}}
</div>
{{/if}}
</div>
<div class="field is-grouped is-grouped-split is-fullwidth box is-bottomless">
<div class="field is-grouped">
<div class="control">
<button
data-test-secret-save
type="submit"
disabled={{or @buttonDisabled this.validationErrorCount}}
class="button is-primary"
>
Save
</button>
</div>
<div class="control">
<SecretLink @mode="show" @secret={{@model.id}} @queryParams={{hash version=@modelForData.version}} class="button">
Cancel
</SecretLink>
</div>
</div>
</div>
</form>
{{/if}}