Commit 25aec20f authored by Filipa Lacerda's avatar Filipa Lacerda

Show loading icon only when making the request

parent 3f7b9244
......@@ -37,6 +37,7 @@
return {
pipelineId: '',
endpoint: '',
cancelingPipeline: null,
};
},
computed: {
......@@ -64,6 +65,7 @@
},
onSubmit() {
eventHub.$emit('postAction', this.endpoint);
this.cancelingPipeline = this.pipelineId;
},
},
};
......@@ -106,6 +108,7 @@
:update-graph-dropdown="updateGraphDropdown"
:auto-devops-help-path="autoDevopsHelpPath"
:view-type="viewType"
:canceling-pipeline="cancelingPipeline"
/>
<modal
......
......@@ -46,12 +46,16 @@
type: String,
required: true,
},
cancelingPipeline: {
type: String,
required: false,
default: null,
},
},
pipelinesTable: PIPELINES_TABLE,
data() {
return {
isRetrying: false,
isCancelling: false,
};
},
computed: {
......@@ -227,12 +231,14 @@
isChildView() {
return this.viewType === 'child';
},
isCancelling() {
return this.cancelingPipeline === this.pipeline.id;
},
},
methods: {
handleCancelClick() {
this.isCancelling = true;
eventHub.$emit('openConfirmationModal', {
pipelineId: this.pipeline.id,
endpoint: this.pipeline.cancel_path,
......
......@@ -182,7 +182,16 @@ describe('Pipelines Table Row', () => {
});
component.$el.querySelector('.js-pipelines-cancel-button').click();
expect(component.isCancelling).toEqual(true);
});
it('renders a loading icon when `cancelingPipeline` matches pipeline id', done => {
component.cancelingPipeline = pipeline.id;
component.$nextTick()
.then(() => {
expect(component.isCancelling).toEqual(true);
})
.then(done)
.catch(done.fail);
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment