{{#if this.job.latestDeployment}}
  <div class="boxed-section {{if this.job.latestDeployment.isRunning "is-info"}}" data-test-active-deployment>
    <div class="boxed-section-head">
      <div class="boxed-section-row">
        {{if this.job.latestDeployment.isRunning "Active" "Latest"}} Deployment
        <span class="badge is-white {{if this.job.latestDeployment.isRunning "is-subtle"}} bumper-left" data-test-active-deployment-stat="id">{{this.job.latestDeployment.shortId}}</span>
        {{#if this.job.latestDeployment.version.submitTime}}
          <span class="pull-right submit-time tooltip" data-test-active-deployment-stat="submit-time" aria-label="{{format-ts this.job.latestDeployment.version.submitTime}}">
            {{moment-from-now this.job.latestDeployment.version.submitTime}}
          </span>
        {{/if}}
      </div>
      <div class="boxed-section-row">
        <span class="tag is-outlined {{this.job.latestDeployment.statusClass}}" data-test-deployment-status="{{this.job.latestDeployment.statusClass}}">
          {{this.job.latestDeployment.status}}
        </span>
        <div class="pull-right">
          {{#if this.job.latestDeployment.isRunning}}
            <TwoStepButton
              data-test-fail
              @classes={{hash
                idleButton="is-danger"
                confirmationMessage="inherit-color"
                confirmButton="is-danger"}}
              @idleText="Fail Deployment"
              @cancelText="Cancel"
              @confirmText="Yes, Fail"
              @confirmationMessage="Are you sure?"
              @inlineText={{true}}
              @awaitingConfirmation={{this.fail.isRunning}}
              @disabled={{this.fail.isRunning}}
              @onConfirm={{perform this.fail}} />
          {{/if}}
          {{#if this.job.latestDeployment.requiresPromotion}}
            <button
              data-test-promote-canary
              type="button"
              class="button is-warning is-small {{if this.promote.isRunning "is-loading"}}"
              disabled={{this.promote.isRunning}}
              onclick={{perform this.promote}}>Promote Canary</button>
          {{/if}}
        </div>
      </div>
    </div>
    <div class="boxed-section-body with-foot">
      <JobDeploymentDetails @deployment={{this.job.latestDeployment}} as |d|>
        <d.metrics />
        {{#if this.isShowingDeploymentDetails}}
          <d.taskGroups />
          <d.allocations />
        {{/if}}
      </JobDeploymentDetails>
    </div>
    <div class="boxed-section-foot">
      <a class="pull-right" {{action (toggle "isShowingDeploymentDetails" this)}} href="#" data-test-deployment-toggle-details>
        {{if this.isShowingDeploymentDetails "Hide" "Show"}} deployment task groups and allocations
      </a>
    </div>
  </div>
{{/if}}