open-vault/ui/app/templates/vault/cluster/policies/create.hbs
Angel Garbarino 0455d31b84
Remove Ivy Codemirror (#14659)
* setup

* fix mode issue

* actions

* readonly styling

* remove ivycodemirror from package json

* wip

* test coverage for json editor

* text fixes

* fix tests

* fix cursor issue

* changelog

* clean up

* fix

* address pr comments

* unused css and it overides other styling.

* fix

* fix comment
2022-03-29 10:25:16 -06:00

86 lines
2.8 KiB
Handlebars

<PageHeader as |p|>
<p.top>
<div class="breadcrumb">
<LinkTo @route="vault.cluster.policies" @model={{this.policyType}} data-test-policy-list-link={{true}}>
<span class="sep">&#x0002f;</span>
{{uppercase this.policyType}}
Policies
</LinkTo>
</div>
</p.top>
<p.levelLeft>
<h1 class="title is-3">
Create
{{uppercase this.policyType}}
policy
</h1>
</p.levelLeft>
</PageHeader>
<form {{action "savePolicy" this.model on="submit"}}>
<div class="box is-bottomless is-fullwidth is-marginless">
<MessageError @model={{this.model}} @errors={{this.model.errors}} />
<NamespaceReminder @mode="create" @noun="policy" />
<div class="field">
<label for="policy-name" class="is-label">Name</label>
<div class="control">
<input
type="text"
id="policy-name"
class="input"
value={{this.model.name}}
oninput={{action "setModelName" this.model}}
data-test-policy-input="name"
/>
</div>
</div>
<div class="field">
<Toolbar>
<label class="is-label">Policy</label>
<ToolbarActions>
<div class="toolbar-separator"></div>
<div class="control is-flex">
<Input
id="fileUploadToggle"
@type="checkbox"
name="fileUploadToggle"
class="switch is-rounded is-success is-small"
@checked={{this.showFileUpload}}
{{on "change" (toggle-action "showFileUpload" this)}}
data-test-policy-edit-toggle={{true}}
/>
<label for="fileUploadToggle">Upload file</label>
</div>
</ToolbarActions>
</Toolbar>
{{#if this.showFileUpload}}
<TextFile @inputOnly={{true}} @file={{this.file}} @onChange={{action "setPolicyFromFile"}} />
{{else}}
<JsonEditor
@title="Policy"
@helpText="You can use Alt+Tab (Option+Tab on MacOS) in the code editor to skip to the next field"
@showToolbar={{false}}
@value={{this.model.policy}}
@valueUpdated={{action (mut this.model.policy)}}
@mode="ruby"
@extraKeys={{hash Shift-Enter=(action "savePolicy" this.model)}}
/>
{{/if}}
</div>
{{#each this.model.additionalAttrs as |attr|}}
<FormField data-test-field={{true}} @attr={{attr}} @model={{@model}} />
{{/each}}
</div>
<div class="field is-grouped box is-fullwidth is-bottomless">
<div class="control">
<button type="submit" disabled={{this.buttonDisabled}} class="button is-primary" data-test-policy-save={{true}}>
Create policy
</button>
</div>
<div class="control">
<LinkTo @route="vault.cluster.policies" @replace={{true}} class="button">
Cancel
</LinkTo>
</div>
</div>
</form>