<PageHeader as |p|>
  <p.top>
    <nav class="breadcrumb">
      <li>
        <LinkTo @route="vault.cluster.policies" @model={{this.policyType}} data-test-policy-list-link={{true}}>
          <span class="sep">&#x0002f;</span>
          {{uppercase this.policyType}}
          policies
        </LinkTo>
      </li>
    </nav>
  </p.top>
  <p.levelLeft>
    <h1 class="title is-3">
      {{this.model.id}}
      {{#if this.model.enforcementLevel}}
        <span class="tag is-medium" aria-label="Enforcement level: {{this.model.enforcementLevel}}">
          {{this.model.enforcementLevel}}
        </span>
      {{/if}}
    </h1>
  </p.levelLeft>
</PageHeader>
{{#if (and (not-eq this.model.id "root") (or this.capabilities.canUpdate this.capabilities.canDelete))}}
  <Toolbar>
    <ToolbarActions>
      {{#if (and (not-eq this.model.id "default") this.capabilities.canDelete)}}
        <ConfirmAction
          @buttonClasses="toolbar-link"
          @confirmMessage="This may affect access to Vault data."
          @onConfirmAction={{action "deletePolicy" this.model}}
          data-test-policy-delete="true"
        >
          Delete
        </ConfirmAction>
        <div class="toolbar-separator"></div>
      {{/if}}
      <ToolbarLink @params={{array "vault.cluster.policy.show" this.model.id}} data-test-policy-edit-toggle={{true}}>
        Back to policy
      </ToolbarLink>
    </ToolbarActions>
  </Toolbar>
{{/if}}
<form {{action "savePolicy" this.model on="submit"}}>
  <div class="box is-bottomless is-fullwidth is-marginless">
    <MessageError @model={{this.model}} />
    <NamespaceReminder @mode="edit" @noun="policy" />
    <div class="field">
      <JsonEditor
        @title="Policy"
        @value={{this.model.policy}}
        @valueUpdated={{action (mut this.model.policy)}}
        @mode="ruby"
        @extraKeys={{hash Shift-Enter=(action "savePolicy" this.model)}}
      />
      <div class="box is-shadowless is-fullwidth has-short-padding">
        <p class="help-text has-text-grey-dark is-size-7">
          You can use Alt+Tab (Option+Tab on MacOS) in the code editor to skip to the next field
        </p>
      </div>
    </div>
    {{#each this.model.additionalAttrs as |attr|}}
      <FormField data-test-field={{true}} @attr={{attr}} @model={{@model}} />
    {{/each}}
    <div class="field is-grouped is-grouped-split is-fullwidth box is-bottomless">
      <div class="field is-grouped">
        {{#if this.capabilities.canUpdate}}
          <div class="control">
            <button type="submit" disabled={{this.buttonDisabled}} class="button is-primary" data-test-policy-save={{true}}>
              Save
            </button>
          </div>
        {{/if}}
        <div class="control">
          <LinkTo @route="vault.cluster.policy.show" @model={{this.model.id}} @replace={{true}} class="button">
            Cancel
          </LinkTo>
        </div>
      </div>
    </div>
  </div>
</form>