<PageHeader as |p|>
  <p.top>
    <Page::Breadcrumbs @breadcrumbs={{@breadcrumbs}} />
  </p.top>
  <p.levelLeft>
    <h1 class="title is-3" data-test-pki-engine-page-title>
      {{this.title}}
    </h1>
  </p.levelLeft>
</PageHeader>

{{#if @config.id}}
  <Toolbar />
{{else}}
  <div class="box is-bottomless is-fullwidth is-marginless">
    <div class="columns">
      {{#each this.configTypes as |option|}}
        <div class="column is-flex">
          <label for={{option.key}} class="box-label is-column {{if (eq @config.actionType option.key) 'is-selected'}}">
            <div>
              <h3 class="box-label-header title is-6">
                <Icon @size="24" @name={{option.icon}} />
                {{option.label}}
              </h3>
              <p class="help has-text-grey-dark">
                {{option.description}}
              </p>
            </div>
            <div>
              <RadioButton
                id={{option.key}}
                name="pki-config-type"
                @value={{option.key}}
                @groupValue={{@config.actionType}}
                @onChange={{fn (mut @config.actionType) option.key}}
                data-test-pki-config-option={{option.key}}
              />
              <label for={{option.key}}></label>
            </div>
          </label>
        </div>
      {{/each}}
    </div>
  </div>
{{/if}}
{{#if (eq @config.actionType "import")}}
  <PkiImportPemBundle
    @model={{@config}}
    @onCancel={{@onCancel}}
    @onSave={{fn (mut this.title) "View imported items"}}
    @onComplete={{transition-to "vault.cluster.secrets.backend.pki.overview"}}
    @adapterOptions={{hash actionType=@config.actionType useIssuer=@config.canImportBundle}}
  />
{{else if (eq @config.actionType "generate-root")}}
  {{#if @config.privateKey}}
    <div class="has-top-margin-m">
      <AlertBanner
        @title="Next steps"
        @type="warning"
        @message="The private_key is only available once. Make sure you copy and save it now."
      />
    </div>
  {{/if}}
  <PkiGenerateRoot
    @model={{@config}}
    @urls={{@urls}}
    @onCancel={{@onCancel}}
    @adapterOptions={{hash actionType=@config.actionType useIssuer=@config.canGenerateIssuerRoot}}
    @onSave={{fn (mut this.title) "View root certificate"}}
    @onComplete={{transition-to "vault.cluster.secrets.backend.pki.overview"}}
  />
{{else if (eq @config.actionType "generate-csr")}}
  <PkiGenerateCsr
    @model={{@config}}
    @onCancel={{@onCancel}}
    @onSave={{fn (mut this.title) "View generated CSR"}}
    @onComplete={{transition-to "vault.cluster.secrets.backend.pki.overview"}}
  />
{{else}}
  <EmptyState
    @title="Choose an option"
    @message="To see configuration options, choose your desired output above."
    data-test-configuration-empty-state
  />
  <div class="field is-grouped box is-fullwidth is-bottomless">
    <div class="control">
      <button type="button" class="button is-primary" disabled={{true}} data-test-pki-config-save>
        Done
      </button>
      <button type="button" class="button has-left-margin-s" {{on "click" @onCancel}} data-test-pki-config-cancel>
        Cancel
      </button>
    </div>
  </div>
{{/if}}