summaryrefslogtreecommitdiff
path: root/app/assets
diff options
context:
space:
mode:
authorJacques Erasmus <jerasmus@gitlab.com>2019-04-25 14:50:57 +0000
committerFatih Acet <acetfatih@gmail.com>2019-04-25 14:50:57 +0000
commit1dc5b6ab378caa4c61ad405080e276760a49b336 (patch)
tree9068db0b5ba1c1e05cef16985dd520a45b08a7a3 /app/assets
parent93f4e5e8b327758033347749009eeeeab27228af (diff)
downloadgitlab-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.js9
-rw-r--r--app/assets/javascripts/clusters/components/application_row.vue16
-rw-r--r--app/assets/stylesheets/components/toast.scss3
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">
- &times;
- </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;
+}