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

<SyncHeader
  @title="Sync Secrets to {{@destination.name}}"
  @icon={{@destination.icon}}
  @breadcrumbs={{array
    (hash label="Secrets Sync" route="secrets.overview")
    (hash label="Destinations" route="secrets.destinations")
    (hash label="Destination" route="secrets.destinations.destination")
    (hash label="Sync")
  }}
/>

<form {{on "submit" (perform this.setAssociation)}}>
  <MessageError @errorMessage={{this.error}} />

  {{#if this.syncedSecret}}
    <Hds::Alert @type="inline" @color="success" @icon="sync" as |A|>
      <A.Title>Sync initiated</A.Title>
      <A.Description data-test-sync-success-message>
        Sync operation successfully initiated for
        <Hds::Link::Inline
          @isRouteExternal={{true}}
          @route="kvSecretOverview"
          @models={{array this.mountPath this.syncedSecret}}
        >{{this.syncedSecret}}</Hds::Link::Inline>. You can continue on this page to sync more secrets.
      </A.Description>
    </Hds::Alert>
  {{/if}}

  <div class="has-top-margin-l">

    <p class="is-label">Which secrets would you like us to sync?</p>
    <p class="sub-text">
      Select a KV engine mount and path to sync a secret to the
      {{@destination.typeDisplayName}}
      destination. Selecting a previously synced secret will re-sync that secret.
      {{#if (eq @destination.granularity "secret-key")}}
        This destination is configured to sync with
        <strong>secret key</strong>
        granularity. Each key-value pair of the selected secret will sync as a distinct entry at the destination.
      {{/if}}
    </p>

    <div class="has-top-margin-l">
      {{#if this.mounts}}
        <SearchSelect
          @label="Select a mount for the KV engine"
          @options={{this.mounts}}
          @selectLimit={{1}}
          @disallowNewItems={{true}}
          @onChange={{this.setMount}}
          @renderInPlace={{true}}
          data-test-sync-mount-select
        />
      {{else}}
        <FormFieldLabel for="kv-mount-input" @label="Enter an existing KV engine mount" />
        <FilterInput
          id="kv-mount-input"
          placeholder="KV engine mount path"
          value={{this.mountPath}}
          @onInput={{fn (mut this.mountPath)}}
          data-test-sync-mount-input
        />
      {{/if}}

      <KvSuggestionInput
        @label="Select a secret to sync"
        @subText="Enter the full path to the secret. Suggestions will display below if permitted by policy."
        @value={{this.secretPath}}
        @mountPath={{this.mountPath}}
        @onChange={{fn (mut this.secretPath)}}
      />

      <div class="field box is-fullwidth is-bottomless has-top-margin-xxxl">
        <Hds::ButtonSet>
          <Hds::Button
            @text="Sync to destination"
            @color="primary"
            @icon={{if this.setAssociation.isRunning "loading"}}
            type="submit"
            disabled={{this.isSubmitDisabled}}
            data-test-sync-submit
          />
          <Hds::Button
            @text={{if this.syncedSecret "View synced secrets" "Back"}}
            @icon={{if this.syncedSecret "chevron-right"}}
            @iconPosition="trailing"
            @color={{if this.syncedSecret "tertiary" "secondary"}}
            @route="secrets.destinations.destination.secrets"
            data-test-sync-cancel
          />
        </Hds::ButtonSet>
        {{#if this.isSecretDirectory}}
          <AlertInline
            @type="warning"
            @message="Syncing secret directories is not available at this time, please type a path to a single secret"
            class="has-top-margin-s"
          />
        {{/if}}
      </div>

    </div>
  </div>
</form>