<form {{action "onSubmit" "secondary-token" "primary" (hash ttl=ttl id=id saveFilterConfig=showFilterConfig) on="submit"}}>
  <div class="box is-fullwidth is-shadowless is-marginless">
    <h4 class="title is-5">
      Generate a secondary token
    </h4>
    <p>Generate a token to enable {{replicationMode}} replication or change primaries on secondary cluster.</p>
  </div>
  {{message-error errors=errors}}
  {{#if token}}
    <div class="field">
      <label for="activation-token" class="is-label">
        Activation token
      </label>
      <div class="control">
        <textarea readonly value={{token}} class="textarea" />
      </div>
    </div>
    <div class="field is-grouped box is-fullwidth is-bottomless">
      <div class="control">
        {{#copy-button
          clipboardText=token
          class="button is-primary"
          buttonType="button"
          success=(action (set-flash-message 'Activation token copied!'))
        }}
          Copy
        {{/copy-button}}
      </div>
      <div class="control">
        <button {{action 'clear'}} type="button" class="button">
          Back
        </button>
      </div>
    </div>
  {{else}}
    <div class="field">
      <label for="activation-token-id" class="is-label">
        Secondary ID
      </label>
      <div class="control">
        {{input class="input" name="activation-token-id" id="activation-token-id" value=id data-test-replication-secondary-id=true}}
      </div>
      <p class="help has-text-grey">
        This will be used to identify secondary cluster once a connection has been established with the primary.
      </p>
    </div>
    <div class="field">
      {{ttl-picker onChange=(action (mut ttl)) class="is-marginless"}}
      <p class="help has-text-grey">
        This is the Time To Live for the generated secondary token. After this period, the generated token will no longer be valid.
      </p>
    </div>
    {{#if (eq replicationMode "performance")}}
      <div class="field">
        {{toggle-button
        toggleTarget=this
        toggleAttr='showFilterConfig'
        closedLabel='Configure performance mount filtering'
        openLabel='Hide performance mount filtering config'
        data-test-replication-secondary-token-options=true
        }}
        {{#if showFilterConfig}}
          <div class="box">
            {{mount-filter-config-list
              config=filterConfig
              mounts=mounts
              id=id
            }}
          </div>
        {{/if}}
      </div>
    {{/if}}
    <div class="field is-grouped box is-fullwidth is-bottomless">
      <div class="control">
        <button
          type="submit"
          class="button is-primary"
          data-test-secondary-add=true
          >
          Generate token
        </button>
      </div>
      <div class="control">
        {{#link-to "vault.cluster.replication.mode.secondaries" model.name replicationMode class="button"}}
          Cancel
        {{/link-to}}
      </div>
    </div>
  {{/if}}
</form>
