notifications

client/package.json

@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@chartwerk/line-pod": "^0.2.4",
+    "@kyvg/vue3-notification": "^2.3.4",
     "@types/lodash": "^4.14.176",
     "axios": "^0.23.0",
     "lodash": "^4.17.21",

client/src/App.vue

@@ -1,4 +1,5 @@
 <template>
+  <notifications />
   <div id="nav">
     <router-link to="/">Home</router-link> |
     <router-link to="/about">About</router-link>

client/src/components/Graph.vue

@@ -45,9 +45,15 @@ export default defineComponent({
         options
       );
       pod.render();
+    }).catch(e => {
+      this.$notify({
+        title: "Error during extracting metric",
+        text: e,
+        type: 'error',
+      });
+      console.error(e);
     })
-    
-    
+ 
   }
 });
 </script>

client/src/main.ts

@@ -3,4 +3,10 @@ import App from './App.vue'
 import router from './router'
 import store from './store'
 
-createApp(App).use(store).use(router).mount('#app')
+import Notifications from '@kyvg/vue3-notification'
+
+createApp(App)
+  .use(store)
+  .use(router)
+  .use(Notifications)
+  .mount('#app')

client/yarn.lock

@@ -432,6 +432,11 @@
     "@types/istanbul-reports" "^1.1.1"
     "@types/yargs" "^13.0.0"
 
+"@kyvg/vue3-notification@^2.3.4":
+  version "2.3.4"
+  resolved "https://registry.yarnpkg.com/@kyvg/vue3-notification/-/vue3-notification-2.3.4.tgz#7503647ae1d26a7c58bbf5182b505ca345c0882a"
+  integrity sha512-20Km1L75gncIZCjosT1OKbJl9HhNiOd7LRXqVIqlehHHem9NgBjQhDFz6XGo1RcF0MyA4/BC7kV7tcq/PMT+tA==
+
 "@mrmlnc/readdir-enhanced@^2.2.1":
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz#524af240d1a360527b730475ecfa1344aa540dde"