open-vault/ui/app/templates/components/transit-form-create.hbs
Chelsea Shaw b00d966054
UI/transit auto rotate interval (#13970)
* Add format-ttl helper

* Add autoRotateInterval to model and serializer for transit key

* Add goSafeTimeString to object returned from TtlPicker2 component

* Add auto rotate interval to transit key components

* clean up unit calculator on ttl-picker, with tests

* Fix tests, cleanup

* Add changelog
2022-02-09 10:56:49 -06:00

138 lines
4.5 KiB
Handlebars

<form onsubmit={{@createOrUpdateKey}}>
<div class="box is-sideless is-fullwidth is-marginless">
<MessageError @model={{@key}} />
<NamespaceReminder @mode="create" @noun="transit key" />
<div class="field">
<label for="key-name" class="is-label">Name</label>
<Input id="key-name" @value={{@key.name}} class="input" data-test-transit-key-name={{true}} />
</div>
<div class="field">
<TtlPicker2
@initialValue="1h"
@initialEnabled={{false}}
@label="Auto-rotation interval"
@helperTextDisabled="Key will never be automatically rotated"
@helperTextEnabled="Key will be automatically rotated every"
@onChange={{@handleAutoRotateChange}}
@errorMessage={{if @autoRotateInvalid "Duration must be longer than 1 hour"}}
/>
</div>
<div class="field">
<label for="key-type" class="is-label">Type</label>
<div class="control is-expanded">
<div class="select is-fullwidth">
<select
name="key-type"
id="key-type"
onchange={{action (mut @key.type) value="target.value"}}
data-test-transit-key-type={{true}}
>
<option selected={{eq @key.type "aes128-gcm96"}} value="aes128-gcm96">
aes128-gcm96
</option>
<option selected={{eq @key.type "aes256-gcm96"}} value="aes256-gcm96">
aes256-gcm96
</option>
<option selected={{eq @key.type "chacha20-poly1305"}} value="chacha20-poly1305">
chacha20-poly1305
</option>
<option selected={{eq @key.type "ecdsa-p256"}} value="ecdsa-p256">
ecdsa-p256
</option>
<option selected={{eq @key.type "ecdsa-p384"}} value="ecdsa-p384">
ecdsa-p384
</option>
<option selected={{eq @key.type "ecdsa-p521"}} value="ecdsa-p521">
ecdsa-p521
</option>
<option selected={{eq @key.type "ed25519"}} value="ed25519">
ed25519
</option>
<option selected={{eq @key.type "rsa-2048"}} value="rsa-2048">
rsa-2048
</option>
<option selected={{eq @key.type "rsa-3072"}} value="rsa-3072">
rsa-3072
</option>
<option selected={{eq @key.type "rsa-4096"}} value="rsa-4096">
rsa-4096
</option>
</select>
</div>
</div>
</div>
<div class="field">
<div class="b-checkbox">
<input
type="checkbox"
id="key-exportable"
class="styled"
checked={{@key.exportable}}
onchange={{@setValueOnKey}}
data-test-transit-key-exportable={{true}}
/>
<label for="key-exportable" class="is-label">
Exportable
</label>
</div>
</div>
{{#if
(or
(eq @key.type "aes128-gcm96")
(eq @key.type "aes256-gcm96")
(eq @key.type "chacha20-poly1305")
(eq @key.type "ed25519")
)
}}
<div class="field">
<div class="b-checkbox">
<input
type="checkbox"
id="key-derived"
class="styled"
checked={{@key.derived}}
onchange={{@derivedChange}}
data-test-transit-key-derived={{true}}
/>
<label for="key-derived" class="is-label">
Derived
</label>
</div>
</div>
{{/if}}
{{#if (or (eq @key.type "aes128-gcm96") (eq @key.type "aes256-gcm96") (eq @key.type "chacha20-poly1305"))}}
<div class="field">
<div class="b-checkbox">
<input
type="checkbox"
data-test-transit-key-convergent-encryption
id="key-convergent"
class="styled"
checked={{@key.convergentEncryption}}
onchange={{@convergentEncryptionChange}}
/>
<label for="key-convergent" class="is-label">
Enable convergent encryption
</label>
</div>
</div>
{{/if}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button
data-test-transit-key-create
type="submit"
disabled={{@requestInFlight}}
class="button is-primary {{if @requestInFlight "is-loading"}}"
>
Create encryption key
</button>
</div>
<div class="control">
<SecretLink @mode="list" @class="button">
Cancel
</SecretLink>
</div>
</div>
</form>