<form onsubmit={{this.onSaveChanges}}>
  <div
    data-test-metadata-fields
    class={{if (eq @mode "create") "box has-container is-fullwidth" "form-section is-fullwidth"}}
  >
    <p class="field">
      The options below are all version-agnostic; they apply to all versions of this secret.
      {{if (eq @mode "create") "After the secret is created, this can be edited in the Metadata tab." ""}}
    </p>
    {{#each @model.fields as |attr|}}
      {{#if (eq attr.name "customMetadata")}}
        <MessageError @errorMessage={{this.error}} @model={{@model}} />
        <FormField
          data-test-field
          @attr={{attr}}
          @model={{@model}}
          @onKeyUp={{action "onKeyUp"}}
          @modelValidations={{this.modelValidations}}
          @mode={{@mode}}
        />
        <label class="title has-top-padding-m is-{{if (eq @mode 'create') '5' '4'}}">
          Additional options
        </label>
      {{/if}}
      {{#if (not-eq attr.name "customMetadata")}}
        <FormField
          data-test-field
          @attr={{attr}}
          @model={{@model}}
          @onKeyUp={{action "onKeyUp"}}
          @modelValidations={{this.modelValidations}}
        />
      {{/if}}
    {{/each}}
  </div>
  {{#if (not-eq @mode "create")}}
    <div class="field is-grouped is-grouped-split is-fullwidth box is-bottomless">
      <div class="field is-grouped">
        <div class="control">
          <button type="submit" disabled={{this.validationErrorCount}} class="button is-primary" data-test-save-metadata>
            Save
          </button>
        </div>
        <div class="control">
          <SecretLink @secret={{@model.id}} class="button" @mode="show">
            Cancel
          </SecretLink>
        </div>
      </div>
    </div>
  {{/if}}
</form>