diff --git a/src/App.vue b/src/App.vue
index 4d52ec45b2f742f865c8fd8d455ee4e3be056083..026d0174c8217b044e22c2aa1f5ff57457976664 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -159,7 +159,7 @@
               :key="'message-' + index"
               :class="['ui', message.level ? message.level : 'info', 'message']"
             >
-              <i class="close icon" @click="discardMessage(message)"></i>
+              <i class="close icon" @click="DISCARD_MESSAGE(message)"></i>
               <div class="header">
                 <i class="info circle icon"></i> Informations
               </div>
@@ -194,8 +194,7 @@
 
 <script>
 import frag from "vue-frag";
-import { mapState } from "vuex";
-import { mapGetters } from "vuex";
+import { mapMutations, mapState, mapGetters } from "vuex";
 
 export default {
   name: "App",
@@ -250,6 +249,7 @@ export default {
   },
 
   methods: {
+    ...mapMutations(['DISCARD_MESSAGE']),
     logout() {
       this.$store.dispatch("LOGOUT");
     },
@@ -258,10 +258,6 @@ export default {
       if (e.target.closest && !e.target.closest("#menu-dropdown"))
         this.menuIsOpen = false;
     },
-
-    discardMessage(message) {
-      this.$store.commit("DISCARD_MESSAGE", message)
-    }
   },
 
   created() {