open-vault/ui/app/templates/components/generate-credentials.hbs
Angel Garbarino 2e35e9578c
UI/obscure secret on input (#11284)
* new font and add as font-family to be used in masked-input

* clean up logic

* refactor for displayOnly

* start cert masking

* work on certificates

* upload cert work

* fix global styling

* fix styling for class no longer used

* make mask by default and remove option

* glimmerize start and certificate on LDAP a file field

* glimmerize actions

* first part of glimmerizing text-file still need to do some clean up

* not doing awesome over here

* getting ready to un-glimmer

* unglimmerize

* remove placeholder based on conversations with design

* clean up text-file

* cleanup

* fix class bindings

* handle class binding

* set up for test

* fix elementId

* track down index

* update masked-input test

* add more to the masked-input test

* test-file test

* fix broken test

* clear old style

* clean up

* remove pgp key masked font, this really needs to be refactored to text-file component

* changelog

* cover other certificate view

* add allowCopy

* address some pr styling comments

* improve test coverage

* fix some issues

* add attr.options.masked
2021-04-22 08:58:37 -06:00

133 lines
4.4 KiB
Handlebars

<PageHeader as |p|>
<p.top>
<nav class="breadcrumb">
<ul>
<li>
<span class="sep">&#x0002f;</span>
<LinkTo @route="vault.cluster.secrets.backend" @model={{backendPath}} data-test-link="role-list">
{{backendPath}}
</LinkTo>
</li>
<li class="is-active">
<span class="sep">&#x0002f;</span>
<LinkTo @route="vault.cluster.secrets.backend" @model={{backendPath}}>
creds
</LinkTo>
</li>
<li>
<span class="sep">&#x0002f;</span>
<LinkTo @route="vault.cluster.secrets.backend.show" @model={{roleName}}>
{{roleName}}
</LinkTo>
</li>
</ul>
</nav>
</p.top>
<p.levelLeft>
<h1 data-test-title class="title is-3">
{{options.title}}
</h1>
</p.levelLeft>
</PageHeader>
{{#if model.hasGenerated}}
<div class="box is-fullwidth is-sideless is-paddingless is-marginless">
<MessageError @model={{model}} />
{{#unless model.isError}}
<AlertBanner
@type="warning"
@message="You will not be able to access this information later, so please copy the information below."
data-test-warning
/>
{{/unless}}
{{#each model.attrs as |attr|}}
{{#if (eq attr.type "object")}}
<InfoTableRow @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}} @value={{stringify (get model attr.name)}} />
{{else}}
{{#if (or
(eq attr.name "key")
(eq attr.name "secretKey")
(eq attr.name "securityToken")
(eq attr.name "privateKey")
attr.options.masked
)}}
<InfoTableRow @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}} @value={{get model attr.name}}>
<MaskedInput
@value={{get model attr.name}}
@name={{attr.name}}
@displayOnly={{true}}
@allowCopy={{true}}
/>
</InfoTableRow>
{{else}}
<InfoTableRow @label={{capitalize (or attr.options.label (humanize (dasherize attr.name)))}} @value={{get model attr.name}} />
{{/if}}
{{/if}}
{{/each}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{model.toCreds}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Credentials copied!")}}>
Copy credentials
</CopyButton>
</div>
{{#if model.leaseId}}
<div class="control">
<CopyButton @clipboardText={{model.leaseId}} @class="button" @buttonType="button" @success={{action (set-flash-message "Lease ID copied!")}}>
Copy Lease ID
</CopyButton>
</div>
{{/if}}
<div class="control">
{{#if options.backIsListLink}}
<LinkTo @route="vault.cluster.secrets.backend.list-root" @model={{backendPath}} data-test-secret-generate-back={{true}} class="button">
Back
</LinkTo>
{{else}}
<button
type="button"
{{action "newModel"}}
class="button"
data-test-secret-generate-back="true"
>
Back
</button>
{{/if}}
</div>
</div>
{{else}}
<form {{action "create" on="submit"}} data-test-secret-generate-form="true">
<div class="box is-sideless no-padding-top is-fullwidth is-marginless">
<NamespaceReminder @mode="generate" @noun="credential" />
<MessageError @model={{model}} />
{{#if model.helpText}}
<p class="is-hint">{{model.helpText}}</p>
{{/if}}
{{#if model.fieldGroups}}
{{partial "partials/form-field-groups-loop"}}
{{else}}
{{#each model.attrs as |attr|}}
{{form-field data-test-field attr=attr model=model}}
{{/each}}
{{/if}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button
type="submit"
disabled={{loading}}
class="button is-primary {{if loading 'is-loading'}}"
data-test-secret-generate=true
>
Generate
</button>
</div>
<div class="control">
<LinkTo @route="vault.cluster.secrets.backend.list-root" @model={{backendPath}} class="button" data-test-secret-generate-cancel={{true}}>
Cancel
</LinkTo>
</div>
</div>
</form>
{{/if}}