Error Handling

src/charts/bar.vue

@@ -51,33 +51,7 @@ export default class VueComponent extends Vue {
     this.$emit('dimension-resizer', { id: this.cardId, resizer: this.changeDimensions })
     this.$emit('isLoaded')
 
-    // Example Error and Warnings
-    //
-    this.$store.commit('setStatus', {
-      type: Status.ERROR,
-      msg: `This is an Example Error (Bar Plot)`,
-      desc: 'Das ist eine detailierte Beschreibung des Fehlers. Damit der Fehler behoben werden kann, muss einiges geändert werden.',
-    })
-    this.$store.commit('setStatus', {
-      type: Status.WARNING,
-      msg: `This is an Example Error (Bar Plot)`,
-      desc: 'Das ist eine detailierte Beschreibung des Fehlers. Damit der Fehler behoben werden kann, muss einiges geändert werden.',
-    })
-    this.$store.commit('setStatus', {
-      type: Status.ERROR,
-      msg: `You did a misstake!`,
-      desc: 'Leider hast du einen Fehler.....',
-    })
-    this.$store.commit('setStatus', {
-      type: Status.WARNING,
-      msg: `The data is missing!`,
-      desc: 'Please upload some data.',
-    })
-    // this.$store.commit('setStatus', {
-    //   type: Status.ERROR,
-    //   msg: `Oooopppsss.. Data is missing`,
-    //   desc: 'Leider hast du einen Fehler.....',
-    // })
+    this.checkWarningsAndErrors()
   }
 
   private changeDimensions(dimensions: { width: number; height: number }) {
@@ -90,6 +64,21 @@ export default class VueComponent extends Vue {
     } catch (e) {}
   }
 
+  // Check this plot for warnings and errors
+  private checkWarningsAndErrors() {
+    var plotTitle = this.cardTitle
+    // warnings
+    // missing title
+    if (plotTitle.length == 0) {
+      this.$store.commit('setStatus', {
+        type: Status.WARNING,
+        msg: `The plot title is missing!`,
+        desc: "Please add a plot title in the .yaml-file (title: 'Example title')",
+      })
+    }
+    // errors
+  }
+
   @Watch('globalState.isDarkMode')
   updateTheme() {
     const colors = {

src/charts/heatmap.vue

@@ -36,6 +36,7 @@ export default class VueComponent extends Vue {
 
   private async mounted() {
     this.updateTheme()
+    this.checkWarningsAndErrors()
     this.dataSet = await this.loadData()
     if (Object.keys(this.dataSet).length) {
       this.updateChart()
@@ -149,6 +150,21 @@ export default class VueComponent extends Vue {
     ]
   }
 
+  // Check this plot for warnings and errors
+  private checkWarningsAndErrors() {
+    var plotTitle = this.cardTitle
+    // warnings
+    // missing title
+    if (plotTitle.length == 0) {
+      this.$store.commit('setStatus', {
+        type: Status.WARNING,
+        msg: `The plot title is missing!`,
+        desc: "Please add a plot title in the .yaml-file (title: 'Example title')",
+      })
+    }
+    // errors
+  }
+
   private layout: any = {
     margin: { t: 8, b: 50 },
     font: {

src/components/RunFinderPanel.vue

@@ -12,15 +12,15 @@
 
           tree-view.things(:initialData="node" @navigate="$emit('navigate', $event)")
       .warnings(v-else)
-        .message-area(v-if="!state.statusErrors.length") 
+        .message-area(v-if="!state.statusErrors.length && !state.statusWarnings.length") 
           p.no-error There are no errors and warnings.
         .message-area(v-else)
-          h3 {{state.statusErrors.length}} Errors
+          h3(v-if="state.statusErrors.length") {{state.statusErrors.length}} Errors
           .single-message(v-for="err,i in state.statusErrors")
             li(v-html="err.msg" @click="toggleShowDescription(i, true)")
             .description(v-if="descriptionIndexListError.includes(i)")
               p(v-html="err.desc")
-          h3 {{state.statusWarnings.length}} Warnings
+          h3(v-if="state.statusWarnings.length") {{state.statusWarnings.length}} Warnings
           .single-message(v-for="err,i in state.statusWarnings")
             li(v-html="err.msg" @click="toggleShowDescription(i, false)")
             .description(v-if="descriptionIndexListWarning.includes(i)")
@@ -30,7 +30,7 @@
   .bottom-panel
     //- h3 Search
     //- input.input(placeholder="Search text (TBA)")
-    button.button.clear-button(v-if="state.statusErrors.length && showWarnings" @click="clearAllButtons()") Clear all errors...
+    button.button.clear-button(v-if="state.statusErrors.length && showWarnings || state.statusWarnings.length && showWarnings" @click="clearAllButtons()") Clear all errors...
 
 
     .commands
@@ -96,6 +96,10 @@ class MyComponent extends Vue {
     this.onRunFoldersChanged()
   }
 
+  @Watch('$route.path') test() {
+    this.clearAllButtons()
+  }
+
   @Watch('$store.state.runFolderCount') updatedCount() {
     this.debounceRunFoldersChanged()
   }
@@ -167,7 +171,6 @@ class MyComponent extends Vue {
   }
 
   private clearAllButtons() {
-    console.log(this.state.statusErrors)
     this.$store.commit('clearAllErrors')
   }
 

src/js/DashboardDataManager.ts

@@ -279,8 +279,12 @@ export default class DashboardDataManager {
             //globalStore.commit('error', e.data.error)
             globalStore.commit('setStatus', {
               type: Status.ERROR,
-              message: '' + msg,
-              desc: 'Add a desription!',
+              msg: `File cannot be loaded.`,
+              desc:
+                'Please check if the file exists. It is this file: ' +
+                this.subfolder +
+                '/' +
+                config.dataset,
             })
             reject()
           }

src/store.ts

@@ -182,6 +182,7 @@ export default new Vuex.Store({
     },
     clearAllErrors(state: GlobalState) {
       state.statusErrors = []
+      state.statusWarnings = []
     },
     resize(state: GlobalState) {
       state.resizeEvents += 1

src/views/ScreenSplitter.vue

@@ -88,6 +88,7 @@ class MyComponent extends Vue {
     } else {
       this.buildLayoutFromURL()
       globalStore.commit('resize')
+      // TODO clear error
     }
   }