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

<section class="section">
    <header class="run-job-header">
        <h1 class="title is-3">Choose a template</h1>
        <p>Select a custom or default job template below. You will have an opportunity to modify and plan your job before it is submitted.</p>
    </header>
    {{#if (eq this.templates.length 0)}}
        <h3 data-test-empty-templates-list-headline class="empty-message-headline">
          You have no templates to choose from. Would you like to <Hds::Link::Inline @route="jobs.run.templates.new" data-test-create-inline>create</Hds::Link::Inline> one?
        </h3>
        <Hds::Button class="button-group" @text="Back to editor" @route="jobs.run" @icon="arrow-left" data-test-cancel />
    {{else}}
    <main class="radio-group" data-test-template-list>
        <Hds::Form::RadioCard::Group as |G|>
            <G.Legend>Select a Template</G.Legend>
            {{#each this.templates as |card|}}
                <G.RadioCard class="form-container" @layout="fixed" @maxWidth="30%" @checked={{eq card.id this.selectedTemplate}} id={{card.id}} data-test-template-card={{format-template-label card.path}} {{on "change" this.onChange}} as |R|>
                    <R.Label data-test-template-label>{{format-template-label card.path}}</R.Label>
                    <R.Description data-test-template-description>{{card.items.description}}</R.Description>
                </G.RadioCard>
            {{/each}}
        </Hds::Form::RadioCard::Group>
    </main>
    <footer class="buttonset">
        <Hds::ButtonSet class="button-group">
            <Hds::Button @text="Apply" @route="jobs.run" @query={{hash template=this.selectedTemplate}} disabled={{is-equal this.selectedTemplate null}} data-test-apply />
            <Hds::Button @text="Cancel" @route="jobs.run" @color="secondary" data-test-cancel />
        </Hds::ButtonSet>
        <Hds::ButtonSet class="button-group align-right">
            <Hds::Button @text="Manage" @color="tertiary" @icon="edit" @route="jobs.run.templates.manage" data-test-manage-button />
            <Hds::Button @text="Create New Template" @color="tertiary" @icon="file-plus" @route="jobs.run.templates.new" data-test-create-new-button />
        </Hds::ButtonSet>
    </footer>
    {{/if}}
</section>