UI/tools partial (#11672)

* hash tools from partial to component

* initial setup of tools random, but issue remaining with bytes

* rewrap

* unwrap

* final two partials

* fix issues with actions on tool wrap

* fix hash

* changelog

* address pr comments

* fix onClear

* trigger run

* triggering test suite
This commit is contained in:
Angel Garbarino 2021-05-24 10:45:35 -06:00 committed by GitHub
parent 4e23452620
commit cf511a895b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 364 additions and 100 deletions

4
changelog/11672.txt Normal file
View File

@ -0,0 +1,4 @@
```release-note:improvement
ui: Replace tool partials with components.
```

View File

@ -106,7 +106,6 @@ export default Component.extend(DEFAULTS, {
if (action === 'random') {
return { bytes: this.bytes, format: this.format };
}
if (action === 'hash') {
return { input: this.input, format: this.format, algorithm: this.algorithm };
}
@ -135,14 +134,11 @@ export default Component.extend(DEFAULTS, {
this.reset();
},
updateTtl(evt) {
const ttl = evt.enabled ? `${evt.seconds}s` : '30m';
updateTtl(ttl) {
set(this, 'wrapTTL', ttl);
},
codemirrorUpdated(val, codemirror) {
codemirror.performLint();
const hasErrors = codemirror.state.lint.marked.length > 0;
codemirrorUpdated(val, hasErrors) {
setProperties(this, {
buttonDisabled: hasErrors,
data: val,

View File

@ -0,0 +1,28 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module ToolHash
* ToolHash components are components that sys/wrapping/hash functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolHash
* @onClear={{action "onClear"}}
* @sum={{sum}}
* @algorithm={{algorithm}}
* @format={{format}}
* @errors={{errors}}/>
* ```
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param sum=null {String} - property passed from parent to child and then passed back up to parent.
* @param algorithm {String} - property returned from parent.
* @param format {String} - property returned from parent.
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolHash extends Component {
@action
onClear() {
this.args.onClear();
}
}

View File

@ -0,0 +1,34 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module ToolLookup
* ToolLookup components are components that sys/wrapping/lookup functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolLookup
* @creation_time={{creation_time}}
* @creation_ttl={{creation_ttl}}
* @creation_path={{creation_path}}
* @expirationDate={{expirationDate}}
* @selectedAction={{selectedAction}}
* @token={{token}}
* @onClear={{action "onClear"}}
* @errors={{errors}}/>
* ```
* @param creation_time {Function} - parent action that is passed through.
* @param creation_ttl {Function} - parent action that is passed through.
* @param creation_path {Function} - parent action that is passed through.
* @param expirationDate='' {String} - value returned from lookup.
* @param selectedAction="wrap" - passed in from parent. This is the wrap action, others include hash, etc.
* @param token=null {String} - property passed from parent to child and then passed back up to parent
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolLookup extends Component {
@action
onClear() {
this.args.onClear();
}
}

View File

@ -0,0 +1,29 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module ToolRandom
* ToolRandom components are components that sys/wrapping/random functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolRandom
* @onClear={{action "onClear"}}
* @format={{format}}
* @bytes={{bytes}}
* @random_bytes={{random_bytes}}
* @errors={{errors}}/>
* ```
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param format {String} - property returned from parent.
* @param bytes {String} - property returned from parent.
* @param random_bytes {String} - property returned from parent.
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolRandom extends Component {
@action
onClear() {
this.args.onClear();
}
}

View File

@ -0,0 +1,31 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module ToolRewrap
* ToolRewrap components are components that sys/wrapping/rewrap functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolRewrap
* @onClear={{action "onClear"}}
* @token={{token}}
* @rewrap_token={{rewrap_token}}
* @selectedAction={{selectedAction}}
* @bytes={{bytes}}
* @errors={{errors}}/>
* ```
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param token=null {String} - property passed from parent to child and then passed back up to parent
* @param rewrap_token {String} - property returned from parent.
* @param selectedAction {String} - property returned from parent.
* @param bytes {String} - property returned from parent.
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolRewrap extends Component {
@action
onClear() {
this.args.onClear();
}
}

View File

@ -0,0 +1,31 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
/**
* @module ToolUnwrap
* ToolUnwrap components are components that sys/wrapping/unwrap functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolUnwrap
* @onClear={{action "onClear"}}
* @token={{token}}
* @unwrap_data={{unwrap_data}}
* @unwrapActiveTab={{unwrapActiveTab}}
* @details={{details}}
* @errors={{errors}}/>
* ```
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param token=null {String} - property passed from parent to child and then passed back up to parent
* @param unwrap_data {String} - property returned from parent.
* @param unwrapActiveTab {String} - property returned from parent.
* @param details {String} - property returned from parent.
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolUnwrap extends Component {
@action
onClear() {
this.args.onClear();
}
}

View File

@ -0,0 +1,51 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
/**
* @module ToolWrap
* ToolWrap components are components that sys/wrapping/wrap functionality. Most of the functionality is passed through as actions from the tool-actions-form and then called back with properties.
*
* @example
* ```js
* <ToolWrap
* @onClear={{action "onClear"}}
* @token={{token}}
* @selectedAction="wrap"
* @codemirrorUpdated={{action "codemirrorUpdated"}}
* @updateTtl={{action "updateTtl"}}
* @buttonDisabled={{buttonDisabled}}
* @errors={{errors}}/>
* ```
* @param onClear {Function} - parent action that is passed through. Must be passed as {{action "onClear"}}
* @param token=null {String} - property passed from parent to child and then passed back up to parent
* @param selectedAction="wrap" - passed in from parent. This is the wrap action, others include hash, etc.
* @param codemirrorUpdated {Function} - parent action that is passed through. Must be passed as {{action "codemirrorUpdated"}}.
* @param updateTtl {Function} - parent action that is passed through. Must be passed as {{action "updateTtl"}}
* @param buttonDisabled=false {Boolean} - false default and if there is an error on codemirror it turns to true.
* @param error=null {Object} - errors passed from parent as default then from child back to parent.
*/
export default class ToolWrap extends Component {
@tracked data = '{\n}';
@tracked buttonDisabled = false;
@action
onClear() {
this.args.onClear();
}
@action
updateTtl(evt) {
if (!evt) return;
const ttl = evt.enabled ? `${evt.seconds}s` : '30m';
this.args.updateTtl(ttl);
}
@action
codemirrorUpdated(val, codemirror) {
codemirror.performLint();
const hasErrors = codemirror?.state.lint.marked?.length > 0;
this.data = val;
this.buttonDisabled = hasErrors;
this.args.codemirrorUpdated(val, hasErrors);
}
}

View File

@ -1,3 +1,63 @@
<form onsubmit={{action "doSubmit"}}>
{{partial (concat "partials/tools/" selectedAction)}}
{{#if (eq selectedAction 'hash')}}
<ToolHash
@onClear={{action "onClear"}}
@sum={{sum}}
@algorithm={{algorithm}}
@errors={{errors}}
@format={{format}}
@input={{input}}
/>
{{else if (eq selectedAction 'random')}}
<ToolRandom
@onClear={{action "onClear"}}
@random_bytes={{random_bytes}}
@errors={{errors}}
@format={{format}}
@bytes={{bytes}}
/>
{{else if (eq selectedAction 'rewrap')}}
<ToolRewrap
@onClear={{action "onClear"}}
@rewrap_token={{rewrap_token}}
@selectedAction={{selectedAction}}
@errors={{errors}}
@token={{token}}
@bytes={{bytes}}
/>
{{else if (eq selectedAction 'unwrap')}}
<ToolUnwrap
@onClear={{action "onClear"}}
@unwrap_data={{unwrap_data}}
@unwrapActiveTab={{unwrapActiveTab}}
@details={{details}}
@errors={{errors}}
@token={{token}}
/>
{{else if (eq selectedAction 'lookup')}}
<ToolLookup
@creation_time={{creation_time}}
@creation_ttl={{creation_ttl}}
@creation_path={{creation_path}}
@expirationDate={{expirationDate}}
@selectedAction={{selectedAction}}
@token={{token}}
@onClear={{action "onClear"}}
@errors={{errors}}
/>
{{else if (eq selectedAction 'wrap')}}
<ToolWrap
@token={{token}}
@selectedAction={{selectedAction}}
@onClear={{action "onClear"}}
@codemirrorUpdated={{action "codemirrorUpdated"}}
@updateTtl={{action "updateTtl"}}
@buttonDisabled={{buttonDisabled}}
@errors={{errors}}
/>
{{else}}
<EmptyState
@title="Tool not available"
/>
{{/if}}
</form>

View File

@ -6,37 +6,37 @@
</p.levelLeft>
</PageHeader>
{{#if sum}}
{{#if @sum}}
<div class="box is-sideless is-fullwidth is-marginless">
<div class="field">
<label for="sum" class="is-input">Sum</label>
<div class="control">
<textarea readonly class="textarea" id="sum" data-test-tools-input="sum">{{sum}}</textarea>
<textarea readonly class="textarea" id="sum" data-test-tools-input="sum">{{@sum}}</textarea>
</div>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{sum}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Hashed data copied!")}}>
<CopyButton @clipboardText={{@sum}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Hashed data copied!")}}>
Copy
</CopyButton>
</div>
<div class="control">
<button {{action 'onClear'}} type="button" class="button" data-test-tools-back=true>
<button {{on "click" this.onClear}} type="button" class="button" data-test-tools-back=true>
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<MessageError @errors={{errors}} />
<MessageError @errors={{@errors}} />
<div class="field">
<label for="input" class="is-label">
Input
</label>
<div class="control">
<Textarea @id="input" @name="input" @value={{input}} class="textarea" data-test-tools-input="hash-input" />
<B64Toggle @value={{input}} @isInput={{false}} @data-test-tools-b64-toggle="input" />
<Textarea @id="input-hash" @name="input" @value={{@input}} class="textarea" data-test-tools-input="hash-input" />
<B64Toggle @value={{@input}} @isInput={{false}} @data-test-tools-b64-toggle="input" />
</div>
</div>
<div class="field is-horizontal">
@ -48,10 +48,10 @@
<select
name="algorithm"
id="algorithm"
onchange={{action (mut algorithm) value="target.value"}}
onchange={{action (mut @algorithm) value="target.value"}}
>
{{#each (sha2-digest-sizes) as |algo|}}
<option selected={{if algorithm (eq algorithm algo)}} value={{algo}}>
<option selected={{if @algorithm (eq @algorithm algo)}} value={{algo}}>
{{algo}}
</option>
{{/each}}
@ -66,10 +66,10 @@
<select
name="format"
id="format"
onchange={{action (mut format) value="target.value"}}
onchange={{action (mut @format) value="target.value"}}
>
{{#each (array 'base64' 'hex') as |formatOption|}}
<option selected={{if format (eq format formatOption)}} value={{formatOption}}>
<option selected={{if @format (eq @format formatOption)}} value={{formatOption}}>
{{formatOption}}
</option>
{{/each}}

View File

@ -0,0 +1,44 @@
<PageHeader as |p|>
<p.levelLeft>
<h1 class="title is-3">
Lookup token
</h1>
</p.levelLeft>
</PageHeader>
{{#if (or @creation_time @creation_ttl)}}
<div class="box is-fullwidth is-sideless is-paddingless is-marginless">
<InfoTableRow @label="Creation path" @value={{@creation_path}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Creation time" @value={{@creation_time}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Creation TTL" @value={{@creation_ttl}} @data-test-tools="token-lookup-row" />
{{#if @expirationDate}}
<InfoTableRow @label="Expiration date" @value={{@expirationDate}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Expires in" @value={{date-from-now @expirationDate}} @data-test-tools="token-lookup-row" />
{{/if}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button {{on "click" this.onClear}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun={{@selectedAction}} />
<MessageError @errors={{@errors}} />
<div class="field">
<label for="token" class="is-label">Wrapping token</label>
<div class="control">
<Input @value={{@token}} class="input" @id="token" @name="token" data-test-tools-input="wrapping-token" />
</div>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button type="submit" data-test-tools-submit="true" class="button is-primary">
Lookup token
</button>
</div>
</div>
{{/if}}

View File

@ -6,26 +6,26 @@
</p.levelLeft>
</PageHeader>
{{#if random_bytes}}
{{#if @random_bytes}}
<div class="box is-sideless is-fullwidth is-marginless">
<label for="rand" class="is-label">Random bytes</label>
<textarea readonly class="textarea" id="rand" data-test-tools-input="random-bytes">{{random_bytes}}</textarea>
<textarea readonly class="textarea" id="rand" data-test-tools-input="random-bytes">{{@random_bytes}}</textarea>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{random_bytes}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Random bytes copied!")}}>
<CopyButton @clipboardText={{@random_bytes}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Random bytes copied!")}}>
Copy
</CopyButton>
</div>
<div class="control">
<button {{action 'onClear'}} type="button" class="button">
<button {{on "click" this.onClear}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<MessageError @errors={{errors}} />
<MessageError @errors={{@errors}} />
<div class="field is-horizontal">
<div class="field-body">
<div class="field">
@ -33,7 +33,7 @@
Number of bytes
</label>
<div class="control">
<Input @id="bytes" class="input" @value={{bytes}} data-test-tools-input="bytes" />
<Input @id="bytes" class="input" @value={{@bytes}} data-test-tools-input="bytes" />
</div>
</div>
<div class="field">
@ -45,10 +45,10 @@
<select
name="format"
id="format"
onchange={{action (mut format) value="target.value"}}
onchange={{action (mut @format) value="target.value"}}
>
{{#each (array 'base64' 'hex') as |formatOption|}}
<option selected={{if format (eq format formatOption)}} value={{formatOption}}>
<option selected={{if @format (eq @format formatOption)}} value={{formatOption}}>
{{formatOption}}
</option>
{{/each}}

View File

@ -6,35 +6,35 @@
</p.levelLeft>
</PageHeader>
{{#if rewrap_token}}
{{#if @rewrap_token}}
<div class="box is-sideless is-fullwidth is-marginless">
<div class="field">
<label for="wrap-info" class="is-label">Rewrapped token</label>
<div class="control">
<Textarea @value={{rewrap_token}} @readonly={{true}} class="textarea" @id="wrap-info" @name="wrap-info" data-test-tools-input="rewrapped-token" />
<Textarea @value={{@rewrap_token}} @readonly={{true}} class="textarea" @id="wrap-info" @name="wrap-info" data-test-tools-input="rewrapped-token" />
</div>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{rewrap_token}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Token copied!")}}>
<CopyButton @clipboardText={{@rewrap_token}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Token copied!")}}>
Copy
</CopyButton>
</div>
<div class="control">
<button {{action 'onClear'}} type="button" class="button">
<button {{on "click" this.onClear}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun={{selectedAction}} />
<MessageError @errors={{errors}} />
<NamespaceReminder @mode="perform" @noun={{@selectedAction}} />
<MessageError @errors={{@errors}} />
<div class="field">
<label for="token" class="is-label">Wrapping token</label>
<div class="control">
<Input @value={{token}} class="input" @id="token" @name="token" data-test-tools-input="wrapping-token" />
<Input @value={{@token}} class="input" @id="token" @name="token" data-test-tools-input="wrapping-token" />
</div>
</div>
</div>

View File

@ -6,29 +6,29 @@
</p.levelLeft>
</PageHeader>
{{#if unwrap_data}}
{{#if @unwrap_data}}
<div class="box is-sideless is-fullwidth is-marginless">
<nav class="tabs">
<ul>
<li role="tab" aria-selected={{if (eq unwrapActiveTab "data") "true" "false"}} class="{{if (eq unwrapActiveTab "data") "is-active"}}">
<button type="button" class="link link-plain tab has-text-weight-semibold" {{action (mut unwrapActiveTab) "data"}} data-test-button-data>Data</button>
<li role="tab" aria-selected={{if (eq @unwrapActiveTab "data") "true" "false"}} class="{{if (eq @unwrapActiveTab "data") "is-active"}}">
<button type="button" class="link link-plain tab has-text-weight-semibold" {{action (mut @unwrapActiveTab) "data"}} data-test-button-data>Data</button>
</li>
<li role="tab" aria-selected={{if (eq unwrapActiveTab "data") "true" "false"}} class="{{if (eq unwrapActiveTab "details") "is-active"}}">
<button type="button" class="link link-plain tab has-text-weight-semibold" {{action (mut unwrapActiveTab) "details"}} data-test-button-details>Wrap Details</button>
<li role="tab" aria-selected={{if (eq @unwrapActiveTab "data") "true" "false"}} class="{{if (eq @unwrapActiveTab "details") "is-active"}}">
<button type="button" class="link link-plain tab has-text-weight-semibold" {{action (mut @unwrapActiveTab) "details"}} data-test-button-details>Wrap Details</button>
</li>
</ul>
</nav>
{{#if (eq unwrapActiveTab "data")}}
{{#if (eq @unwrapActiveTab "data")}}
<div class="field">
<div class="control">
<JsonEditor @title="Unwrapped Data" @value={{stringify unwrap_data}} @options={{hash
<JsonEditor @title="Unwrapped Data" @value={{stringify @unwrap_data}} @options={{hash
readOnly=true
}} />
</div>
</div>
{{else}}
<div class="field box is-fullwidth is-shadowless is-paddingless is-marginless">
{{#each-in details as |key detail|}}
{{#each-in @details as |key detail|}}
<InfoTableRow @label={{key}} @value={{key}}>
{{#if (or (eq detail "No") (eq detail "None"))}}
<Icon class="has-text-grey" @glyph="cancel-square-outline" /> {{detail}}
@ -45,24 +45,24 @@
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{stringify unwrap_data}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Data copied!")}}>
<CopyButton @clipboardText={{stringify @unwrap_data}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Data copied!")}}>
Copy
</CopyButton>
</div>
<div class="control">
<button {{action 'onClear'}} type="button" class="button">
<button {{on "click" this.onClear}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun={{selectedAction}} />
<MessageError @errors={{errors}} />
<NamespaceReminder @mode="perform" @noun={{@selectedAction}} />
<MessageError @errors={{@errors}} />
<div class="field">
<label for="token" class="is-label">Wrapping token</label>
<div class="control">
<Input @value={{token}} class="input" @id="token" @name="token" @autocomplete="off" @spellcheck="false" data-test-tools-input="wrapping-token" />
<Input @value={{@token}} class="input" @id="token" @name="token" @autocomplete="off" @spellcheck="false" data-test-tools-input="wrapping-token" />
</div>
</div>
</div>

View File

@ -6,43 +6,43 @@
</p.levelLeft>
</PageHeader>
{{#if token}}
{{#if @token}}
<div class="box is-sideless is-fullwidth is-marginless">
<div class="field">
<label for="wrap-info" class="is-label">Wrapping token</label>
<div class="control">
<Textarea @value={{token}} @readonly={{true}} class="textarea" @id="wrap-info" @name="wrap-info" data-test-tools-input="wrapping-token" />
<Textarea @value={{@token}} @readonly={{true}} class="textarea" @id="wrap-info" @name="wrap-info" data-test-tools-input="wrapping-token" />
</div>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<CopyButton @clipboardText={{token}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Token copied!")}}>
<CopyButton @clipboardText={{@token}} @class="button is-primary" @buttonType="button" @success={{action (set-flash-message "Token copied!")}}>
Copy
</CopyButton>
</div>
<div class="control">
<button {{action 'onClear'}} type="button" class="button">
<button {{on "click" this.onClear}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun={{selectedAction}} />
<MessageError @errors={{errors}} />
<NamespaceReminder @mode="perform" @noun={{@selectedAction}} />
<MessageError @errors={{@errors}} />
<div class="field">
<div class="control">
<JsonEditor @title="Data to wrap"
@subTitle="json-formatted"
@value={{data}}
@valueUpdated={{action "codemirrorUpdated"}} />
@value={{this.data}}
@valueUpdated={{action this.codemirrorUpdated}} />
</div>
</div>
<TtlPicker2
@label="Wrap TTL"
@initialValue="30m"
@onChange={{action 'updateTtl'}}
@onChange={{action "updateTtl"}}
@helperTextDisabled="Vault will use the default (30m)"
@helperTextEnabled="Wrap will expire after"
@changeOnInit={{true}}
@ -50,7 +50,7 @@
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button type="submit" class="button is-primary" data-test-tools-submit="true" disabled={{buttonDisabled}}>
<button type="submit" class="button is-primary" data-test-tools-submit="true" disabled={{@buttonDisabled}}>
Wrap data
</button>
</div>

View File

@ -1,44 +0,0 @@
<PageHeader as |p|>
<p.levelLeft>
<h1 class="title is-3">
Lookup token
</h1>
</p.levelLeft>
</PageHeader>
{{#if (or creation_time creation_ttl)}}
<div class="box is-fullwidth is-sideless is-paddingless is-marginless">
<InfoTableRow @label="Creation path" @value={{creation_path}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Creation time" @value={{creation_time}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Creation TTL" @value={{creation_ttl}} @data-test-tools="token-lookup-row" />
{{#if expirationDate}}
<InfoTableRow @label="Expiration date" @value={{expirationDate}} @data-test-tools="token-lookup-row" />
<InfoTableRow @label="Expires in" @value={{date-from-now expirationDate}} @data-test-tools="token-lookup-row" />
{{/if}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button {{action 'onClear'}} type="button" class="button">
Back
</button>
</div>
</div>
{{else}}
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="perform" @noun={{selectedAction}} />
<MessageError @errors={{errors}} />
<div class="field">
<label for="token" class="is-label">Wrapping token</label>
<div class="control">
<Input @value={{token}} class="input" @id="token" @name="token" data-test-tools-input="wrapping-token" />
</div>
</div>
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button type="submit" data-test-tools-submit="true" class="button is-primary">
Lookup token
</button>
</div>
</div>
{{/if}}