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

<PageHeader as |p|>
  <p.top>
    <Page::Breadcrumbs @breadcrumbs={{@breadcrumbs}} />
  </p.top>
  <p.levelLeft>
    <h1 class="title is-3">Configure LDAP</h1>
  </p.levelLeft>
</PageHeader>

<hr class="is-marginless has-background-gray-200" />

<form class="has-top-margin-l" {{on "submit" (perform this.save)}}>
  <Hds::Form::RadioCard::Group @name="schema options" as |RadioGroup|>
    {{#each this.schemaOptions as |option|}}
      <RadioGroup.RadioCard
        @checked={{eq option.value @model.schema}}
        {{on "change" (fn (mut @model.schema) option.value)}}
        data-test-radio-card={{option.title}}
        as |Card|
      >
        <Card.Icon @name={{option.icon}} />
        <Card.Label>{{option.title}}</Card.Label>
        <Card.Description>{{option.description}}</Card.Description>
      </RadioGroup.RadioCard>
    {{/each}}
  </Hds::Form::RadioCard::Group>

  <div class="has-top-margin-xl">
    <MessageError @errorMessage={{this.error}} />

    <h2 class="title is-4">Schema Options</h2>
    <hr class="has-background-gray-200" />

    {{#if @model.schema}}
      <div class="has-top-margin-l">
        <FormFieldGroups @model={{@model}} @groupName="formFieldGroups" @modelValidations={{this.modelValidations}} />
      </div>
    {{else}}
      <EmptyState
        class="is-shadowless has-top-margin-l"
        @title="Choose an option"
        @message="Pick an option above to see available configuration options"
      />
    {{/if}}
  </div>

  <hr class="has-background-gray-200 has-top-margin-l" />

  <div class="has-top-margin-l has-bottom-margin-l is-flex">
    <Hds::Button
      @text="Save"
      data-test-config-save
      type="submit"
      disabled={{or this.save.isRunning (not @model.schema)}}
      {{on "click" (perform this.save)}}
    />
    <Hds::Button
      @text="Back"
      @color="secondary"
      class="has-left-margin-xs"
      data-test-config-cancel
      disabled={{or this.save.isRunning this.fetchInferred.isRunning}}
      {{on "click" this.cancel}}
    />
    {{#if this.invalidFormMessage}}
      <AlertInline
        @type="danger"
        class="has-top-padding-s"
        @message={{this.invalidFormMessage}}
        data-test-invalid-form-message
      />
    {{/if}}
  </div>
</form>

{{#if this.showRotatePrompt}}
  <Hds::Modal id="ldap-rotate-password-modal" @onClose={{fn (mut this.showRotatePrompt) false}} as |M|>
    <M.Header @icon="info">
      Rotate your root password?
    </M.Header>
    <M.Body>
      <p>
        It’s best practice to rotate the administrator (root) password immediately after the initial configuration of the
        LDAP engine. The rotation will update the password both in Vault and your directory server. Once rotated,
        <span class="has-text-weight-semibold">only Vault knows the new root password.</span>
      </p>
      <br />
      <p>
        Would you like to rotate your new credentials? You can also do this later.
      </p>
    </M.Body>
    <M.Footer>
      <Hds::ButtonSet>
        <Hds::Button data-test-save-with-rotate @text="Save and rotate" {{on "click" (fn (perform this.save) null true)}} />
        <Hds::Button
          data-test-save-without-rotate
          @text="Save without rotating"
          @color="secondary"
          {{on "click" (fn (perform this.save) null false)}}
        />
      </Hds::ButtonSet>
    </M.Footer>
  </Hds::Modal>
{{/if}}