open-nomad/ui/app/templates/components/job-page/parts/latest-deployment.hbs
Buck Doyle f462d7d1c2
Add button to fail running deployments (#9831)
This closes #8744 and #9826.

It necessitated some customisation options for TwoStepButton. One is inlineText, which puts the confirmation text in the same line as the buttons. Also, there was a single-use configuration option named isInfoAction that I removed in favour of passing a set of class configuration options like this:

                @classes={{hash
                  idleButton="is-warning"
                  confirmationMessage="inherit-color"
                  cancelButton="is-danger is-important"
                  confirmButton="is-warning"}}
2021-02-10 08:38:37 -06:00

61 lines
2.8 KiB
Handlebars

{{#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}}