diff options
author | Jacques Erasmus <jerasmus@gitlab.com> | 2019-04-25 14:50:57 +0000 |
---|---|---|
committer | Fatih Acet <acetfatih@gmail.com> | 2019-04-25 14:50:57 +0000 |
commit | 1dc5b6ab378caa4c61ad405080e276760a49b336 (patch) | |
tree | 9068db0b5ba1c1e05cef16985dd520a45b08a7a3 /app/assets | |
parent | 93f4e5e8b327758033347749009eeeeab27228af (diff) | |
download | gitlab-ce-1dc5b6ab378caa4c61ad405080e276760a49b336.tar.gz |
Implement toast component
Implemented the toast component for success messages
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/clusters/clusters_bundle.js | 9 | ||||
-rw-r--r-- | app/assets/javascripts/clusters/components/application_row.vue | 16 | ||||
-rw-r--r-- | app/assets/stylesheets/components/toast.scss | 3 |
3 files changed, 8 insertions, 20 deletions
diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js index df855261b3c..7f07e592f84 100644 --- a/app/assets/javascripts/clusters/clusters_bundle.js +++ b/app/assets/javascripts/clusters/clusters_bundle.js @@ -1,5 +1,6 @@ import Visibility from 'visibilityjs'; import Vue from 'vue'; +import { GlToast } from '@gitlab/ui'; import PersistentUserCallout from '../persistent_user_callout'; import { s__, sprintf } from '../locale'; import Flash from '../flash'; @@ -20,6 +21,8 @@ import ClustersStore from './stores/clusters_store'; import Applications from './components/applications.vue'; import setupToggleButtons from '../toggle_buttons'; +Vue.use(GlToast); + /** * Cluster page has 2 separate parts: * Toggle button and applications section @@ -135,7 +138,6 @@ export default class Clusters { eventHub.$on('installApplication', this.installApplication); eventHub.$on('upgradeApplication', data => this.upgradeApplication(data)); eventHub.$on('upgradeFailed', appId => this.upgradeFailed(appId)); - eventHub.$on('dismissUpgradeSuccess', appId => this.dismissUpgradeSuccess(appId)); eventHub.$on('saveKnativeDomain', data => this.saveKnativeDomain(data)); eventHub.$on('setKnativeHostname', data => this.setKnativeHostname(data)); } @@ -145,7 +147,6 @@ export default class Clusters { eventHub.$off('installApplication', this.installApplication); eventHub.$off('upgradeApplication', this.upgradeApplication); eventHub.$off('upgradeFailed', this.upgradeFailed); - eventHub.$off('dismissUpgradeSuccess', this.dismissUpgradeSuccess); eventHub.$off('saveKnativeDomain'); eventHub.$off('setKnativeHostname'); } @@ -283,10 +284,6 @@ export default class Clusters { this.store.updateAppProperty(appId, 'requestStatus', UPGRADE_REQUEST_FAILURE); } - dismissUpgradeSuccess(appId) { - this.store.updateAppProperty(appId, 'requestStatus', null); - } - toggleIngressDomainHelpText(ingressPreviousState, ingressNewState) { const { externalIp, status } = ingressNewState; const helpTextHidden = status !== APPLICATION_STATUS.INSTALLED || !externalIp; diff --git a/app/assets/javascripts/clusters/components/application_row.vue b/app/assets/javascripts/clusters/components/application_row.vue index 937e4c3bfc3..17fe816e62b 100644 --- a/app/assets/javascripts/clusters/components/application_row.vue +++ b/app/assets/javascripts/clusters/components/application_row.vue @@ -241,6 +241,8 @@ export default { status() { if (this.status === APPLICATION_STATUS.UPDATE_ERRORED) { eventHub.$emit('upgradeFailed', this.id); + } else if (this.upgradeRequested && this.upgradeSuccessful) { + this.$toast.show(this.upgradeSuccessDescription); } }, }, @@ -257,9 +259,6 @@ export default { params: this.installApplicationRequestParams, }); }, - dismissUpgradeSuccess() { - eventHub.$emit('dismissUpgradeSuccess', this.id); - }, }, }; </script> @@ -335,17 +334,6 @@ export default { > {{ upgradeFailureDescription }} </div> - - <div - v-if="upgradeRequested && upgradeSuccessful" - class="bs-callout bs-callout-success cluster-application-banner mt-2 mb-0 p-0 pl-3" - > - {{ upgradeSuccessDescription }} - <button class="close cluster-application-banner-close" @click="dismissUpgradeSuccess"> - × - </button> - </div> - <loading-button v-if="upgradeAvailable || upgradeFailed || isUpgrading" class="btn btn-primary js-cluster-application-upgrade-button mt-2" diff --git a/app/assets/stylesheets/components/toast.scss b/app/assets/stylesheets/components/toast.scss new file mode 100644 index 00000000000..91d16c8e98d --- /dev/null +++ b/app/assets/stylesheets/components/toast.scss @@ -0,0 +1,3 @@ +.toast-close { + font-size: $default-icon-size !important; +} |