open-vault/ui/app/templates/components/generated-item.hbs
Jordan Reimer 5b33b6fdf2
Form Field Glimmer (#15026)
* glimmerizes form field components

* updates model validations handling in components that use form field
2022-04-13 15:51:44 -06:00

97 lines
2.8 KiB
Handlebars

<PageHeader as |p|>
<p.top>
<nav class="breadcrumb">
<ul>
<li>
<span class="sep">
/
</span>
<LinkTo @route="vault.cluster.access.method.item.list" @model={{this.itemType}}>
{{pluralize this.itemType}}
</LinkTo>
</li>
</ul>
</nav>
</p.top>
<p.levelLeft>
{{#if (eq this.mode "show")}}
<h1 class="title is-3">
{{this.model.id}}
</h1>
{{else}}
<h1 class="title is-3">
{{capitalize this.mode}}
{{singularize this.itemType}}
{{#if (eq this.mode "edit")}}
{{this.model.id}}
{{/if}}
</h1>
{{/if}}
</p.levelLeft>
</PageHeader>
{{#if (eq this.mode "show")}}
<Toolbar>
<ToolbarActions>
<ConfirmAction
@buttonClasses="toolbar-link"
@onConfirmAction={{action "deleteItem"}}
@confirmMessage={{concat "Are you sure you want to delete " this.itemType " " this.model.id "?"}}
@cancelButtonText="Cancel"
data-test-secret-delete="true"
>
Delete
{{this.itemType}}
</ConfirmAction>
<div class="toolbar-separator"></div>
<ToolbarLink
@params={{array "vault.cluster.access.method.item.edit" this.itemType this.model.id}}
data-test-configure-link="true"
>
Edit
{{singularize this.itemType}}
</ToolbarLink>
</ToolbarActions>
</Toolbar>
{{/if}}
{{#if (eq this.mode "show")}}
<FieldGroupShow @model={{this.model}} @showAllFields={{true}} />
{{else}}
<form {{action (perform this.saveModel) on="submit"}}>
<div class="box is-sideless is-fullwidth is-marginless">
<NamespaceReminder @mode="save" @noun={{this.itemType}} />
<MessageError @model={{this.model}} />
<FormFieldGroups
@model={{this.model}}
@mode={{this.mode}}
@onKeyUp={{action "onKeyUp"}}
@modelValidations={{this.modelValidations}}
/>
</div>
<div class="field is-grouped-split box is-fullwidth is-bottomless">
<div class="control">
<button
type="submit"
data-test-save-config="true"
class="button is-primary {{if this.saveModel.isRunning 'loading'}}"
disabled={{or this.saveModel.isRunning this.isFormInvalid}}
>
Save
</button>
{{#if (eq this.mode "create")}}
<LinkTo @route="vault.cluster.access.method.item.list" class="button" data-test-cancel-link={{true}}>
Cancel
</LinkTo>
{{else}}
<LinkTo
@route="vault.cluster.access.method.item.show"
@model={{this.model.id}}
class="button"
data-test-cancel-link={{true}}
>
Cancel
</LinkTo>
{{/if}}
</div>
</div>
</form>
{{/if}}