utils: introduce global API error notification (#296)

Fixes #294

Introduce a new global `this.$notifyError(error)` that takes in the `error` in a catch block and displays error notification with duration: 0, refactored to replace error handling codebase-wide.

Signed-off-by: Abhishek Kumar <abhishek.mrt22@gmail.com>
Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
Co-authored-by: Rohit Yadav <rohit.yadav@shapeblue.com>

ui/src/components/view/DedicateData.vue

@@ -121,10 +121,7 @@ export default {
           this.dedicatedAccountId = response.listdedicatedzonesresponse.dedicatedzone[0].accountid
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     fetchDedicatedPods () {
@@ -137,10 +134,7 @@ export default {
           this.dedicatedAccountId = response.listdedicatedpodsresponse.dedicatedpod[0].accountid
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     fetchDedicatedClusters () {
@@ -153,10 +147,7 @@ export default {
           this.dedicatedAccountId = response.listdedicatedclustersresponse.dedicatedcluster[0].accountid
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     fetchDedicatedHosts () {
@@ -169,10 +160,7 @@ export default {
           this.dedicatedAccountId = response.listdedicatedhostsresponse.dedicatedhost[0].accountid
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     releaseDedidcatedZone () {
@@ -202,10 +190,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     releaseDedidcatedPod () {
@@ -235,10 +220,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     releaseDedidcatedCluster () {
@@ -268,10 +250,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     releaseDedidcatedHost () {
@@ -301,10 +280,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     handleRelease () {

ui/src/components/view/DedicateDomain.vue

@@ -80,12 +80,9 @@ export default {
           this.domainId = this.domainsList[0].id
           this.handleChangeDomain(this.domainId)
         }
-        this.domainsLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
+      }).finally(() => {
-          description: error.response.data.errorresponse.errortext
-        })
         this.domainsLoading = false
       })
     },
@@ -98,10 +95,7 @@ export default {
           this.handleChangeAccount(null)
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     handleChangeDomain (e) {

ui/src/components/view/DedicateModal.vue

@@ -118,10 +118,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.dedicatedDomainModal = false
       })
     },
@@ -165,10 +162,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.dedicatedDomainModal = false
       })
     },
@@ -212,10 +206,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.dedicatedDomainModal = false
       })
     },
@@ -259,10 +250,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.dedicatedDomainModal = false
       })
     },

ui/src/components/view/DetailSettings.vue

@@ -193,10 +193,7 @@ export default {
           return { name: k, value: details[k], edit: false }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Failed to add setting',
-          description: error.response.headers['x-description']
-        })
       }).finally(f => {
         this.loading = false
         this.showAddDetail = false

ui/src/components/view/ResourceLimitTab.vue

@@ -135,10 +135,7 @@ export default {
           this.$message.success('Apply Successful')
           this.fetchData()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.formLoading = false
         })

ui/src/components/view/VmwareData.vue

@@ -71,10 +71,7 @@ export default {
         }
         this.$set(this.resource, 'vmwaredc', this.vmwaredc)
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     }
   }

ui/src/main.js

@@ -27,11 +27,12 @@ import './core/use'
 import './core/ext'
 import './permission' // permission control
 import './utils/filter' // global filter
-import { pollJobPlugin } from './utils/plugins'
+import { pollJobPlugin, notifierPlugin } from './utils/plugins'
 
 Vue.config.productionTip = false
 Vue.use(VueAxios, router)
 Vue.use(pollJobPlugin)
+Vue.use(notifierPlugin)
 
 new Vue({
   router,

ui/src/utils/plugins.js

@@ -15,6 +15,7 @@
 // specific language governing permissions and limitations
 // under the License.
 
+import _ from 'lodash'
 import { api } from '@/api'
 import { message, notification } from 'ant-design-vue'
 
@@ -77,3 +78,35 @@ export const pollJobPlugin = {
   }
 
 }
+
+export const notifierPlugin = {
+
+  install (Vue) {
+    Vue.prototype.$notifyError = function (error) {
+      var msg = 'Request Failed'
+      var desc = ''
+      if (error && error.response) {
+        if (error.response.status) {
+          msg = `Request Failed (${error.response.status})`
+        }
+        if (error.message) {
+          desc = error.message
+        }
+        if (error.response.headers && 'x-description' in error.response.headers) {
+          desc = error.response.headers['x-description']
+        }
+        if (desc === '' && error.response.data) {
+          const responseKey = _.findKey(error.response.data, 'errortext')
+          if (responseKey) {
+            desc = error.response.data[responseKey].errortext
+          }
+        }
+      }
+      notification.error({
+        message: msg,
+        description: error && error.response && 'x-description' in error.response.headers ? error.response.headers['x-description'] : error.message,
+        duration: 0
+      })
+    }
+  }
+}

ui/src/utils/request.js

@@ -41,7 +41,7 @@ const err = (error) => {
       if (response.config && response.config.params && ['listIdps'].includes(response.config.params.command)) {
         return
       }
-      notification.error({ message: 'Unauthorized', description: 'Authorization verification failed' })
+      notification.error({ message: 'Unauthorized', description: 'Session expired, authorization verification failed' })
       if (token) {
         store.dispatch('Logout').then(() => {
           setTimeout(() => {

ui/src/views/AutogenView.vue

@@ -507,11 +507,7 @@ export default {
           this.treeSelected = {}
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
 
         if ([401, 405].includes(error.response.status)) {
           this.$router.push({ path: '/exception/403' })
@@ -771,10 +767,7 @@ export default {
             }
           }).catch(error => {
             console.log(error)
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-            })
           }).finally(f => {
             this.closeAction()
           })

ui/src/views/compute/AssignInstance.vue

@@ -216,10 +216,7 @@ export default {
         this.$parent.$parent.close()
         this.parentFetchData()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Failed to assign instance',
-          description: error.response.data.assignvirtualmachineresponse.errortext && error.response.data.assignvirtualmachineresponse.errortext
-        })
         this.$parent.$parent.close()
         this.parentFetchData()
       })

ui/src/views/compute/CreateKubernetesCluster.vue

@@ -405,10 +405,7 @@ export default {
         api('createKubernetesCluster', params).then(json => {
           this.$message.success('Successfully created Kubernetes cluster: ' + values.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/compute/CreateSSHKeyPair.vue

@@ -166,10 +166,7 @@ export default {
           api('registerSSHKeyPair', params).then(json => {
             this.$message.success('Successfully registered SSH key pair: ' + values.name)
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-            })
           }).finally(() => {
             this.$emit('refresh-data')
             this.loading = false
@@ -186,10 +183,7 @@ export default {
               })
             }
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-            })
           }).finally(() => {
             this.$emit('refresh-data')
             this.loading = false

ui/src/views/compute/DeployVM.vue

@@ -946,10 +946,7 @@ export default {
           }
           this.$router.back()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading.deploy = false
         })

ui/src/views/compute/InstanceHardware.vue

@@ -422,10 +422,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loadingNic = false
       })
     },
@@ -455,10 +452,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loadingNic = false
       })
     },
@@ -493,10 +487,7 @@ export default {
         })
       })
         .catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
           this.loadingNic = false
         })
     },
@@ -528,10 +519,7 @@ export default {
         })
       })
         .catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
           this.loadingNic = false
         })
     },
@@ -568,10 +556,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.addiptovmnicresponse.errortext
-        })
         this.loadingNic = false
       })
     },
@@ -602,10 +587,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loadingNic = false
         this.fetchSecondaryIPs(this.selectedNicId)
       })

ui/src/views/compute/KubernetesServiceTab.vue

@@ -293,10 +293,7 @@ export default {
             this.kubernetesVersion = versionObjs[0]
           }
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.versionLoading = false
           if (!this.isObjectEmpty(this.kubernetesVersion) && this.isValidValueForKey(this.kubernetesVersion, 'semanticversion')) {
@@ -333,10 +330,7 @@ export default {
             this.virtualmachines = this.virtualmachines.concat(listVms)
           }
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.instanceLoading = false
         })
@@ -363,10 +357,7 @@ export default {
           this.publicIpAddress = ips[0]
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.networkLoading = false
       })

ui/src/views/compute/ScaleKubernetesCluster.vue

@@ -173,10 +173,7 @@ export default {
         api('scaleKubernetesCluster', params).then(json => {
           this.$message.success('Successfully scaled Kubernetes cluster: ' + this.resource.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/compute/UpgradeKubernetesCluster.vue

@@ -149,10 +149,7 @@ export default {
         api('upgradeKubernetesCluster', params).then(json => {
           this.$message.success('Successfully upgraded Kubernetes cluster: ' + this.resource.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/compute/backup/BackupSchedule.vue

@@ -164,10 +164,7 @@ export default {
         }
         this.refreshSchedule()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(() => {
         this.actionLoading = false
       })

ui/src/views/compute/backup/FormSchedule.vue

@@ -274,10 +274,7 @@ export default {
           this.refreshSchedule()
           this.resetForm()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.actionLoading = false
         })

ui/src/views/iam/AddLdapAccount.vue

@@ -198,10 +198,7 @@ export default {
         this.fetchListDomains(),
         this.fetchListRoles()
       ]).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(() => {
         this.listLoading = false
         this.timeZoneLoading = false
@@ -319,10 +316,7 @@ export default {
           this.$emit('refresh-data')
           this.handleClose()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
           this.$emit('refresh-data')
         }).finally(() => {
           this.loading = false
@@ -365,10 +359,7 @@ export default {
         }))
       }
       Promise.all(promises).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       })
     },
     onSelectChange (selectedRowKeys) {

ui/src/views/iam/ChangeUserPassword.vue

@@ -146,10 +146,7 @@ export default {
             description: 'Successfully changed password for user "' + this.resource.username + '"'
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Error',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/iam/SSLCertificateTab.vue

@@ -164,10 +164,7 @@ export default {
 
         this.dataSource = listSslResponse
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -203,10 +200,7 @@ export default {
         setTimeout(loading)
 
         // show error
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       })
     },
     onShowConfirm (row) {

ui/src/views/image/AddKubernetesSupportedVersion.vue

@@ -206,10 +206,7 @@ export default {
         api('addKubernetesSupportedVersion', params).then(json => {
           this.$message.success('Successfully added Kubernetes version: ' + values.semanticversion)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/image/IsoZones.vue

@@ -127,10 +127,7 @@ export default {
           this.itemCount = count
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/image/RegisterOrUploadIso.vue

@@ -334,11 +334,7 @@ export default {
               description: 'Sucessfully registered ISO ' + params.name
             })
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message,
-              duration: 0
-            })
           }).finally(() => {
             this.loading = false
             this.closeAction()
@@ -359,11 +355,7 @@ export default {
               })
             }
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message,
-              duration: 0
-            })
           }).finally(() => {
             this.loading = false
           })

ui/src/views/image/RegisterOrUploadTemplate.vue

@@ -873,11 +873,7 @@ export default {
               description: 'Successfully registered template ' + params.name
             })
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message,
-              duration: 0
-            })
           }).finally(() => {
             this.loading = false
             this.closeAction()
@@ -895,11 +891,7 @@ export default {
             this.uploadParams = (json.postuploadtemplateresponse && json.postuploadtemplateresponse.getuploadparams) ? json.postuploadtemplateresponse.getuploadparams : ''
             this.handleUpload()
           }).catch(error => {
-            this.$notification.error({
+            this.$notifyError(error)
-              message: 'Request Failed',
-              description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message,
-              duration: 0
-            })
           }).finally(() => {
             this.loading = false
           })

ui/src/views/image/TemplateZones.vue

@@ -124,10 +124,7 @@ export default {
           this.itemCount = count
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/image/UpdateKubernetesSupportedVersion.vue

@@ -131,10 +131,7 @@ export default {
         api('updateKubernetesSupportedVersion', params).then(json => {
           this.$message.success('Successfully updated Kubernetes supported version: ' + this.resource.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/image/UpdateTemplateIsoPermissions.vue

@@ -254,12 +254,7 @@ export default {
           })
         })
         .catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Failed to update ' + resourceType + ' permissions',
-            description: this.isImageTypeIso
-              ? error.response.data.updateisopermissions.errortext
-              : error.response.data.updatetemplatepermissions.errortext
-          })
         })
         .finally(e => {
           this.loading = false

ui/src/views/infra/AddPrimaryStorage.vue

@@ -534,10 +534,7 @@ export default {
             description: this.$t('label.add.primary.storage')
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.closeModal()

ui/src/views/infra/AddSecondaryStorage.vue

@@ -278,10 +278,7 @@ export default {
             description: this.$t('label.add.secondary.storage')
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.closeModal()

ui/src/views/infra/ClusterAdd.vue

@@ -167,10 +167,7 @@ export default {
         this.zoneId = this.zonesList[0].id || null
         this.fetchPods()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -181,10 +178,7 @@ export default {
         this.hypervisorsList = response.listhypervisorsresponse.hypervisor || []
         this.hypervisor = this.hypervisorsList[0].name || null
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -197,10 +191,7 @@ export default {
         this.podsList = response.listpodsresponse.pod || []
         this.podId = this.podsList[0].id || null
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })

ui/src/views/infra/HostAdd.vue

@@ -188,10 +188,7 @@ export default {
         this.zoneId = this.zonesList[0].id || null
         this.fetchPods()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -205,10 +202,7 @@ export default {
         this.podId = this.podsList[0].id || null
         this.fetchClusters()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.podsList = []
         this.podId = ''
       }).finally(() => {
@@ -226,10 +220,7 @@ export default {
           this.handleChangeCluster()
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listclustersresponse.errortext
-        })
         this.clustersList = []
         this.clusterId = null
       }).finally(() => {
@@ -241,10 +232,7 @@ export default {
       api('listHostTags').then(response => {
         this.hostTagsList = response.listhosttagsresponse.hosttag || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listhosttagsresponse.errortext
-        })
         this.hostTagsList = []
       }).finally(() => {
         this.loading = false

ui/src/views/infra/HostInfoTab.vue

@@ -135,10 +135,7 @@ export default {
       api('listHosts', { id: this.resource.id }).then(json => {
         this.host = json.listhostsresponse.host[0]
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/infra/PodAdd.vue

@@ -161,10 +161,7 @@ export default {
         this.params = this.$store.getters.apis.createPod.params
         Object.keys(this.placeholder).forEach(item => { this.returnPlaceholder(item) })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })

ui/src/views/infra/network/DedicatedVLANTab.vue

@@ -220,10 +220,7 @@ export default {
         }
         this.formLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.formLoading = false
       })
     },
@@ -247,10 +244,7 @@ export default {
         }
         this.formLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.formLoading = false
       })
     },
@@ -273,10 +267,7 @@ export default {
         }
         this.formLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.formLoading = false
       })
     },
@@ -334,10 +325,7 @@ export default {
           this.modal = false
           this.fetchData()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.dedicateguestvlanrangeresponse.errortext
-          })
           this.modal = false
           this.fetchData()
         })

ui/src/views/infra/network/IpRangesTabManagement.vue

@@ -220,11 +220,7 @@ export default {
         }
       }).catch(error => {
         console.log(error)
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listpodsresponse
-            ? error.response.data.listpodsresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.componentLoading = false
       })
@@ -271,11 +267,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletemanagementnetworkiprangeresponse
-            ? error.response.data.deletemanagementnetworkiprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
         this.componentLoading = false
         this.fetchData()
       })
@@ -319,11 +311,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createmanagementnetworkiprangeresponse
-              ? error.response.data.createmanagementnetworkiprangeresponse.errortext : error.response.data.errorresponse.errortext
-          })
         }).finally(() => {
           this.componentLoading = false
           this.fetchData()

ui/src/views/infra/network/IpRangesTabPublic.vue

@@ -268,11 +268,7 @@ export default {
       }).then(response => {
         this.items = response.listvlaniprangesresponse.vlaniprange ? response.listvlaniprangesresponse.vlaniprange : []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listvlaniprangesresponse
-            ? error.response.data.listvlaniprangesresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.componentLoading = false
       })
@@ -289,11 +285,7 @@ export default {
           this.form.setFieldsValue({ domain: this.domains[0].id })
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listdomains
-            ? error.response.data.listdomains.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.domainsLoading = false
       })
@@ -312,11 +304,7 @@ export default {
         domainid: this.addAccount.domain,
         account: this.addAccount.account
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.dedicatepubliciprangeresponse
-            ? error.response.data.dedicatepubliciprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.addAccountModal = false
         this.domainsLoading = false
@@ -326,11 +314,7 @@ export default {
     handleRemoveAccount (id) {
       this.componentLoading = true
       api('releasePublicIpRange', { id }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.releasepubliciprangeresponse
-            ? error.response.data.releasepubliciprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.fetchData()
       })
@@ -364,11 +348,7 @@ export default {
           message: 'Removed IP Range'
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletevlaniprangeresponse
-            ? error.response.data.deletevlaniprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.componentLoading = false
         this.fetchData()

ui/src/views/infra/network/IpRangesTabStorage.vue

@@ -190,11 +190,7 @@ export default {
       }).then(response => {
         this.items = response.liststoragenetworkiprangeresponse.storagenetworkiprange ? response.liststoragenetworkiprangeresponse.storagenetworkiprange : []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.liststoragenetworkiprangeresponse
-            ? error.response.data.liststoragenetworkiprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.componentLoading = false
       })
@@ -206,11 +202,7 @@ export default {
       }).then(response => {
         this.pods = response.listpodsresponse.pod ? response.listpodsresponse.pod : []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.listpodsresponse
-            ? error.response.data.listpodsresponse.errortext : error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.componentLoading = false
       })
@@ -256,11 +248,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletestoragenetworkiprangeresponse
-            ? error.response.data.deletestoragenetworkiprangeresponse.errortext : error.response.data.errorresponse.errortext
-        })
         this.componentLoading = false
         this.fetchData()
       })
@@ -304,11 +292,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createstoragenetworkiprangeresponse
-              ? error.response.data.createstoragenetworkiprangeresponse.errortext : error.response.data.errorresponse.errortext
-          })
         }).finally(() => {
           this.componentLoading = false
           this.fetchData()

ui/src/views/infra/network/ServiceProvidersTab.vue

@@ -129,11 +129,7 @@ export default {
           }
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/infra/network/TrafficTypesTab.vue

@@ -99,10 +99,7 @@ export default {
       api('listTrafficTypes', { physicalnetworkid: this.resource.id }).then(json => {
         this.traffictypes = json.listtraffictypesresponse.traffictype
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -116,10 +113,7 @@ export default {
       }).then(json => {
         this.publicNetwork = json.listnetworksresponse.network[0] || {}
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/infra/zone/PhysicalNetworksTab.vue

@@ -102,10 +102,7 @@ export default {
       api('listPhysicalNetworks', { zoneid: this.resource.id }).then(json => {
         this.networks = json.listphysicalnetworksresponse.physicalnetwork || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/infra/zone/SystemVmsTab.vue

@@ -110,10 +110,7 @@ export default {
       api('listSystemVms', { zoneid: this.resource.id }).then(json => {
         this.vms = json.listsystemvmsresponse.systemvm || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/infra/zone/ZoneResources.vue

@@ -73,10 +73,7 @@ export default {
         this.resourcesList = response.listcapacityresponse.capacity
         this.animatePercentVals()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/network/AclListRulesTab.vue

@@ -271,10 +271,7 @@ export default {
           this.acls.sort((a, b) => a.number - b.number)
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -287,10 +284,7 @@ export default {
       }).then(response => {
         this.tags = response.listtagsresponse.tag || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     openTagsModal (acl) {
@@ -332,10 +326,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.tagsLoading = false
       })
     },
@@ -380,10 +371,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createtagsresponse.errortext
-          })
           this.tagsLoading = false
         })
       })
@@ -451,10 +439,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createnetworkaclresponse.errortext
-          })
           this.fetchLoading = false
         })
       })
@@ -487,10 +472,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletenetworkaclresponse.errortext
-        })
         this.fetchLoading = false
       })
     },
@@ -552,10 +534,7 @@ export default {
             description: 'Successfully added new rule'
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.fetchLoading = false
           this.fetchData()
@@ -602,10 +581,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.headers['x-description']
-        })
         this.fetchLoading = false
       })
     },

ui/src/views/network/CreateIsolatedNetworkForm.vue

@@ -409,10 +409,7 @@ export default {
           })
           this.$emit('refresh-data')
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.actionLoading = false
           this.closeAction()

ui/src/views/network/CreateL2NetworkForm.vue

@@ -329,10 +329,7 @@ export default {
             description: 'Successfully created L2 network'
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.actionLoading = false

ui/src/views/network/CreateSharedNetworkForm.vue

@@ -652,10 +652,7 @@ export default {
           })
           this.resetForm()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.actionLoading = false

ui/src/views/network/EgressRulesTab.vue

@@ -199,10 +199,7 @@ export default {
           catchMethod: () => this.fetchData()
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.fetchData()
       })
     },
@@ -229,10 +226,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createegressfirewallruleresponse.errortext
-        })
         this.resetAllRules()
         this.fetchData()
       })

ui/src/views/network/EnableStaticNat.vue

@@ -174,10 +174,7 @@ export default {
       }).then(response => {
         this.vmsList = response.listvirtualmachinesresponse.virtualmachine
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -196,10 +193,7 @@ export default {
       }).then(response => {
         this.vmsList = response.listvirtualmachinesresponse.virtualmachine || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -223,10 +217,7 @@ export default {
 
         this.selectedNic = this.nicsList[0]
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -241,10 +232,7 @@ export default {
       }).then(response => {
         this.networksList = response.listnetworksresponse.network
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -259,11 +247,7 @@ export default {
       }).then(() => {
         this.parentFetchData()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
       }).finally(() => {
         this.loading = false
         this.handleClose()

ui/src/views/network/FirewallRules.vue

@@ -213,10 +213,7 @@ export default {
         this.firewallRules = response.listfirewallrulesresponse.firewallrule || []
         this.totalCount = response.listfirewallrulesresponse.count || 0
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -235,10 +232,7 @@ export default {
           catchMethod: () => this.fetchData()
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.fetchData()
       })
     },
@@ -265,10 +259,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createfirewallruleresponse.errortext
-        })
         this.resetAllRules()
         this.fetchData()
       })
@@ -301,10 +292,7 @@ export default {
       }).then(response => {
         this.tags = response.listtagsresponse.tag
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -339,10 +327,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createtagsresponse.errortext
-        })
         this.closeModal()
       }).finally(() => {
         this.addTagLoading = false
@@ -378,10 +363,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.closeModal()
       })
     },

ui/src/views/network/IngressEgressRuleConfigure.vue

@@ -267,12 +267,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: this.tabType === 'ingress'
-            ? error.response.data.authorizesecuritygroupingressresponse.errortext
-            : error.response.data.authorizesecuritygroupegressresponse.errortext
-        })
         this.parentToggleLoading()
       })
     },
@@ -304,11 +299,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: this.tabType === 'ingress' ? error.response.data.revokesecuritygroupingressresponse.errortext
-            : error.response.data.revokesecuritygroupegressresponse.errortext
-        })
         this.parentToggleLoading()
       })
     },
@@ -320,10 +311,7 @@ export default {
       }).then(response => {
         this.tags = response.listtagsresponse.tag
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     handleDeleteTag (tag) {
@@ -361,10 +349,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.parentToggleLoading()
         this.tagsLoading = false
       })
@@ -412,10 +397,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createtagsresponse.errortext
-          })
           this.parentToggleLoading()
           this.tagsLoading = false
         })

ui/src/views/network/InternalLBAssignVmForm.vue

@@ -175,10 +175,7 @@ export default {
         this.iLb.vmguestip[index] = this.nics[index][0]
         this.addVmModalNicLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}` || 'Error',
-          description: error.response.data.errorresponse.errortext || 'Error'
-        })
         this.closeModal()
       })
     },

ui/src/views/network/LoadBalancing.vue

@@ -466,10 +466,7 @@ export default {
         }
         this.loading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loading = false
       })
     },
@@ -483,10 +480,7 @@ export default {
         }).then(response => {
           this.$set(rule, 'ruleInstances', response.listloadbalancerruleinstancesresponse.lbrulevmidip)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
         }).finally(() => {
           this.loading = false
         })
@@ -501,10 +495,7 @@ export default {
         }).then(response => {
           this.stickinessPolicies.push(...response.listlbstickinesspoliciesresponse.stickinesspolicies)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
         }).finally(() => {
           this.loading = false
         })
@@ -543,10 +534,7 @@ export default {
         this.tags = response.listtagsresponse.tag
         this.tagsModalLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -589,10 +577,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createtagsresponse.errortext
-          })
           this.closeModal()
         })
       })
@@ -628,10 +613,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -692,10 +674,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createLBStickinessPolicy.errortext
-        })
         this.closeModal()
       })
     },
@@ -728,10 +707,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -800,10 +776,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.fetchData()
       })
     },
@@ -847,10 +820,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loading = false
         this.closeModal()
       })
@@ -886,10 +856,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.loading = false
         this.closeModal()
       })
@@ -931,10 +898,7 @@ export default {
         })
         this.addVmModalLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -962,10 +926,7 @@ export default {
         this.newRule.vmguestip[index] = this.nics[index][0]
         this.addVmModalNicLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -1042,10 +1003,7 @@ export default {
         this.addVmModalVisible = false
         this.handleAssignToLBRule(response.createloadbalancerruleresponse.id)
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createloadbalancerruleresponse.errortext
-        })
         this.loading = false
       })
 

ui/src/views/network/PortForwarding.vue

@@ -299,10 +299,7 @@ export default {
         this.portForwardRules = response.listportforwardingrulesresponse.portforwardingrule || []
         this.totalCount = response.listportforwardingrulesresponse.count || 0
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -321,10 +318,7 @@ export default {
           catchMethod: () => this.fetchData()
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.fetchData()
       })
     },
@@ -356,10 +350,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createportforwardingruleresponse.errortext
-        })
         this.closeModal()
         this.fetchData()
       })
@@ -403,10 +394,7 @@ export default {
         this.tags = response.listtagsresponse.tag
         this.tagsModalLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -441,10 +429,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createtagsresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -479,10 +464,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -500,10 +482,7 @@ export default {
         this.vms = response.listvirtualmachinesresponse.virtualmachine
         this.addVmModalLoading = false
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -523,10 +502,7 @@ export default {
         this.addVmModalNicLoading = false
       }).catch(error => {
         console.log(error)
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },

ui/src/views/network/RoutersTab.vue

@@ -128,11 +128,7 @@ export default {
       api('listRouters', params).then(json => {
         this.routers = json.listroutersresponse.router || []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
       }).finally(() => {
         this.fetchLoading = false
       })

ui/src/views/network/StaticRoutesTab.vue

@@ -115,10 +115,7 @@ export default {
       api('listStaticRoutes', { gatewayid: this.resource.id }).then(json => {
         this.routes = json.liststaticroutesresponse.staticroute
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.componentLoading = false
       })
@@ -156,10 +153,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.headers['x-description']
-        })
         this.fetchData()
         this.componentLoading = false
       })
@@ -193,10 +187,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.headers['x-description']
-        })
         this.fetchData()
         this.componentLoading = false
       })
@@ -209,10 +200,7 @@ export default {
       }).then(response => {
         this.tags = response.listtagsresponse.tag
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     handleDeleteTag (tag) {
@@ -243,10 +231,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deletetagsresponse.errortext
-        })
         this.tagsLoading = false
       })
     },
@@ -286,10 +271,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.createtagsresponse.errortext
-          })
           this.tagsLoading = false
         })
       })

ui/src/views/network/VpcTab.vue

@@ -408,10 +408,7 @@ export default {
         this.privateGateways = json.listprivategatewaysresponse.privategateway
         this.itemCounts.privateGateways = json.listprivategatewaysresponse.count
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -424,10 +421,7 @@ export default {
       }).then(json => {
         this.vpnGateways = json.listvpngatewaysresponse.vpngateway ? json.listvpngatewaysresponse.vpngateway : []
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -443,10 +437,7 @@ export default {
         this.vpnConnections = json.listvpnconnectionsresponse.vpnconnection
         this.itemCounts.vpnConnections = json.listvpnconnectionsresponse.count
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -467,10 +458,7 @@ export default {
           })
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
       })
@@ -485,10 +473,7 @@ export default {
           })
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.modals.gatewayLoading = false
       })
@@ -503,10 +488,7 @@ export default {
           })
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.modals.vpnConnectionLoading = false
       })
@@ -576,10 +558,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.modals.gatewayLoading = false
           this.modals.gateway = false
@@ -626,10 +605,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.fetchVpnConnections()
           this.fetchLoading = false
@@ -671,10 +647,7 @@ export default {
             }
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.fetchLoading = false
           this.fetchAclList()
@@ -707,10 +680,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.fetchLoading = false
         this.handleFetchData()

ui/src/views/network/VpcTiersTab.vue

@@ -366,11 +366,7 @@ export default {
           })
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
       }).finally(() => {
         this.fetchLoading = false
         this.modalLoading = false
@@ -392,11 +388,7 @@ export default {
           })
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description'],
-          duration: 0
-        })
       }).finally(() => {
         this.fetchLoading = false
         this.modalLoading = false
@@ -474,11 +466,7 @@ export default {
           })
           this.fetchData()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description'],
-            duration: 0
-          })
         }).finally(() => {
           this.fetchData()
         })

ui/src/views/network/VpnDetails.vue

@@ -94,10 +94,7 @@ export default {
           ? response.listremoteaccessvpnsresponse.remoteaccessvpn[0] : null
       }).catch(error => {
         console.log(error)
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
       })
     },
     handleCreateVpn () {
@@ -137,11 +134,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.createremoteaccessvpnresponse
-            ? error.response.data.createremoteaccessvpnresponse.errortext : error.response.data.errorresponse.errortext
-        })
         this.fetchData()
         this.parentFetchData()
         this.parentToggleLoading()
@@ -177,11 +170,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.deleteremoteaccessvpnresponse
-            ? error.response.data.deleteremoteaccessvpnresponse.errortext : error.response.data.errorresponse.errortext
-        })
         this.fetchData()
         this.parentFetchData()
         this.parentToggleLoading()

ui/src/views/offering/AddComputeOffering.vue

@@ -833,10 +833,7 @@ export default {
         api('createServiceOffering', params).then(json => {
           this.$message.success((this.isSystem ? 'Service offering created: ' : 'Compute offering created: ') + values.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.$emit('refresh-data')

ui/src/views/offering/AddDiskOffering.vue

@@ -495,10 +495,7 @@ export default {
         api('createDiskOffering', params).then(json => {
           this.$message.success(this.$t('message.disk.offering.created', { name: values.name }))
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.$emit('refresh-data')

ui/src/views/offering/AddNetworkOffering.vue

@@ -838,10 +838,7 @@ export default {
         api('createNetworkOffering', params).then(json => {
           this.$message.success('Network offering created: ' + values.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.$emit('refresh-data')

ui/src/views/offering/AddVpcOffering.vue

@@ -368,10 +368,7 @@ export default {
         api('createVPCOffering', params).then(json => {
           this.$message.success('VPC offering created: ' + values.name)
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.$emit('refresh-data')

ui/src/views/offering/ImportBackupOffering.vue

@@ -105,10 +105,7 @@ export default {
         this.zones.opts = json.listzonesresponse.zone || []
         this.$forceUpdate()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(f => {
         this.zones.loading = false
       })
@@ -123,10 +120,7 @@ export default {
         this.externals.opts = json.listbackupproviderofferingsresponse.backupoffering || []
         this.$forceUpdate()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(f => {
         this.externals.loading = false
       })
@@ -170,10 +164,7 @@ export default {
             })
           }
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(f => {
           this.loading = false
         })

ui/src/views/offering/UpdateOfferingAccess.vue

@@ -285,10 +285,7 @@ export default {
             description: this.$t('label.action.update.offering.access')
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.loading = false
           this.closeAction()

ui/src/views/plugins/CloudianPlugin.vue

@@ -44,16 +44,13 @@ export default {
   },
   methods: {
     doSso () {
+      this.showError = false
       api('cloudianSsoLogin').then(json => {
         const url = json.cloudianssologinresponse.cloudianssologin.url
         const cmcWindow = window.open(url, 'CMCWindow')
         cmcWindow.focus()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Single-Sign-On Failed',
-          description: error.response.headers['x-description'] || 'Request Failed',
-          duration: 0
-        })
         this.showError = true
       })
     }

ui/src/views/project/AccountsTab.vue

@@ -144,10 +144,7 @@ export default {
         this.itemCount = itemCount
         this.dataSource = listProjectAccount
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -178,10 +175,7 @@ export default {
         }
       }).catch(error => {
         // show error
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         setTimeout(loading, 1000)
       })
@@ -217,10 +211,7 @@ export default {
         }
       }).catch(error => {
         // show error
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         setTimeout(loading, 1000)
       })

ui/src/views/project/InvitationTokenTemplate.vue

@@ -80,10 +80,7 @@ export default {
           this.checkForAddAsyncJob(json, title, description)
           this.$emit('close-action')
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: error.response.headers['x-description']
-          })
         }).finally(() => {
           this.$emit('refresh-data')
           this.loading = false

ui/src/views/project/InvitationsTemplate.vue

@@ -179,10 +179,7 @@ export default {
         this.dataSource = listProjectInvitations
         this.itemCount = itemCount
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         this.loading = false
       })
@@ -237,10 +234,7 @@ export default {
         }
       }).catch(error => {
         // show error
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: error.response.headers['x-description']
-        })
       }).finally(() => {
         setTimeout(loading, 1000)
       })

ui/src/views/storage/CreateVolume.vue

@@ -144,10 +144,7 @@ export default {
             catchMessage: 'Error encountered while fetching async job result'
           })
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
         }).finally(() => {
           this.loading = false
           this.$emit('refresh-data')

ui/src/views/storage/FormSchedule.vue

@@ -370,10 +370,7 @@ export default {
           })
           this.resetForm()
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.actionLoading = false
         })

ui/src/views/storage/MigrateVolume.vue

@@ -91,10 +91,7 @@ export default {
           this.storagePools = response.findstoragepoolsformigrationresponse.storagepool || []
           this.selectedStoragePool = this.storagePools[0].id || ''
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
           this.closeModal()
         })
       } else {
@@ -104,10 +101,7 @@ export default {
           this.storagePools = response.liststoragepoolsresponse.storagepool || []
           this.selectedStoragePool = this.storagePools[0].id || ''
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: `Error ${error.response.status}`,
-            description: error.response.data.errorresponse.errortext
-          })
           this.closeModal()
         })
       }
@@ -119,10 +113,7 @@ export default {
         this.diskOfferings = response.listdiskofferingsresponse.diskoffering
         this.selectedDiskOffering = this.diskOfferings[0].id
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     },
@@ -158,10 +149,7 @@ export default {
           }
         })
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: `Error ${error.response.status}`,
-          description: error.response.data.errorresponse.errortext
-        })
         this.closeModal()
       })
     }

ui/src/views/storage/RestoreAttachBackupVolume.vue

@@ -101,10 +101,7 @@ export default {
         this.virtualMachineOptions.opts = json.listvirtualmachinesresponse.virtualmachine || []
         this.$forceUpdate()
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(() => {
         this.virtualMachineOptions.loading = false
       })
@@ -162,10 +159,7 @@ export default {
             })
           }
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         }).finally(() => {
           this.actionLoading = false
         })

ui/src/views/storage/ScheduledSnapshots.vue

@@ -170,10 +170,7 @@ export default {
           this.$emit('refresh')
         }
       }).catch(error => {
-        this.$notification.error({
+        this.$notifyError(error)
-          message: 'Request Failed',
-          description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-        })
       }).finally(() => {
         this.actionLoading = false
       })

ui/src/views/storage/TakeSnapshot.vue

@@ -183,10 +183,7 @@ export default {
             })
           }
         }).catch(error => {
-          this.$notification.error({
+          this.$notifyError(error)
-            message: 'Request Failed',
-            description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
-          })
         })
       })
     },