diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2019-08-05 14:51:08 +0100 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2019-08-06 11:30:10 +0100 |
commit | 48b93f7aee2e00c8ab6263591f8c4ba90436bdf9 (patch) | |
tree | 423a09b67c34db2b31d4b28fc29ca352f9191143 /app/assets/javascripts/pipelines/components | |
parent | 32d89f07f5569c5ca6248dc50866a545cdfee58f (diff) | |
download | gitlab-ce-48b93f7aee2e00c8ab6263591f8c4ba90436bdf9.tar.gz |
Hides loading spinner after request65263-manual-action
In the pipeline's actions, moves the request
to the component to allow to manage the inner
state properly
Diffstat (limited to 'app/assets/javascripts/pipelines/components')
-rw-r--r-- | app/assets/javascripts/pipelines/components/pipelines_actions.vue | 25 |
1 files changed, 22 insertions, 3 deletions
diff --git a/app/assets/javascripts/pipelines/components/pipelines_actions.vue b/app/assets/javascripts/pipelines/components/pipelines_actions.vue index 244d332f38f..4b2d816c6a0 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_actions.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_actions.vue @@ -1,9 +1,11 @@ <script> import { GlButton, GlTooltipDirective, GlLoadingIcon } from '@gitlab/ui'; -import { s__, sprintf } from '~/locale'; +import axios from '~/lib/utils/axios_utils'; +import flash from '~/flash'; +import { s__, __, sprintf } from '~/locale'; import GlCountdown from '~/vue_shared/components/gl_countdown.vue'; +import Icon from '~/vue_shared/components/icon.vue'; import eventHub from '../event_hub'; -import Icon from '../../vue_shared/components/icon.vue'; export default { directives: { @@ -44,7 +46,24 @@ export default { this.isLoading = true; - eventHub.$emit('postAction', action.path); + /** + * Ideally, the component would not make an api call directly. + * However, in order to use the eventhub and know when to + * toggle back the `isLoading` property we'd need an ID + * to track the request with a wacther - since this component + * is rendered at least 20 times in the same page, moving the + * api call directly here is the most performant solution + */ + axios + .post(`${action.path}.json`) + .then(() => { + this.isLoading = false; + eventHub.$emit('updateTable'); + }) + .catch(() => { + this.isLoading = false; + flash(__('An error occurred while making the request.')); + }); }, isActionDisabled(action) { |