{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: BUSL-1.1
}}

<form {{on "submit" (perform this.save)}}>
  <div class="box is-sideless is-fullwidth is-marginless">
    <MessageError @errorMessage={{this.errorBanner}} />
    <FormFieldLabel for="name" @label="Name" />
    <input
      autocomplete="off"
      spellcheck="false"
      value={{@model.name}}
      disabled={{not @model.isNew}}
      class="input field {{if this.modelValidations.name.errors 'has-error-border'}}"
      {{on "input" this.handleOperation}}
      data-test-input="name"
      id="name"
    />
    {{#if this.modelValidations.name.errors}}
      <AlertInline @type="danger" @message={{join ", " this.modelValidations.name.errors}} />
    {{/if}}
    <SearchSelect
      @id="entities"
      @label="Entities"
      @placeholder="Search"
      @models={{array "identity/entity"}}
      @inputValue={{@model.entityIds}}
      @shouldRenderName={{true}}
      @onChange={{this.onEntitiesSelect}}
      @disallowNewItems={{true}}
      @fallbackComponent="string-list"
      data-test-search-select="entities"
    />
    <SearchSelect
      @id="groups"
      @label="Groups"
      @placeholder="Search"
      @models={{array "identity/group"}}
      @inputValue={{@model.groupIds}}
      @shouldRenderName={{true}}
      @onChange={{this.onGroupsSelect}}
      @disallowNewItems={{true}}
      @fallbackComponent="string-list"
      data-test-search-select="groups"
    />
  </div>
  <div class="has-top-padding-s">
    <Hds::Button
      @text={{if @model.isNew "Create" "Update"}}
      @icon={{if this.save.isRunning "loading"}}
      type="submit"
      disabled={{this.save.isRunning}}
      data-test-oidc-assignment-save
    />
    <Hds::Button
      @text="Cancel"
      @color="secondary"
      class="has-left-margin-s"
      disabled={{this.save.isRunning}}
      {{on "click" this.cancel}}
      data-test-oidc-assignment-cancel
    />
    {{#if this.modelValidations.targets.errors}}
      <AlertInline @type="danger" @message={{join ", " this.modelValidations.targets.errors}} class="has-top-padding-s" />
    {{/if}}
  </div>
</form>