modiry nofirication and test celery

frontend/src/components/NotificationsManager.vue

@@ -2,7 +2,10 @@
   <div>
     <v-snackbar auto-height :color="currentNotificationColor" v-model="show">
       <v-progress-circular class="ma-2" indeterminate v-show="showProgress"></v-progress-circular>{{ currentNotificationContent }}
-      <v-btn flat @click.native="close">Close</v-btn>
+      <template v-slot:actions>
+        <v-btn flat @click.native="close">Close</v-btn>
+      </template>
+      
     </v-snackbar>
   </div>
 </template>
@@ -15,18 +18,21 @@
 
   const show = ref(false);
   const showProgress = ref(false);
-  const defaultAppNotification:AppNotification = {
-    content:'',
-  }
-  const currentNotification = ref(defaultAppNotification);
+  const currentNotification = ref<AppNotification|false>(false);
   const currentNotificationFlag =  ref(false);
 
   const mainStore = useMainStore();
   const mainStoreRef = storeToRefs(mainStore);
 
-  const currentNotificationContent = currentNotification && currentNotification.value.content || '';
-  const currentNotificationColor = currentNotification && currentNotification.value.color || 'info';
- 
+  const currentNotificationContent = computed(() => { 
+    return currentNotification.value && currentNotification.value.content || ''
+  });
+  const currentNotificationColor = computed(() => {
+    return currentNotification.value && currentNotification.value.color || 'info'
+  });
+  
+  const firstNotification = mainStoreRef.readFirstNotification;
+
   async function hide() {
     show.value = false;
     await new Promise<void>((resolve, reject) => setTimeout(() => resolve(), 500));
@@ -37,17 +43,17 @@
   }
 
   async function removeCurrentNotification() {
-    if (currentNotificationFlag.value) {
+    if (currentNotification.value) {
       mainStore.removeNotification(currentNotification.value);
       }
   }
 
-  const firstNotification = computed(() => mainStoreRef.readFirstNotification);
-    watch(firstNotification, async (newNotification, oldNotification,) => {
-    if (newNotification !== currentNotification) {
-      await setNotification(newNotification.value);
-      if (typeof newNotification.value === 'object') {
-        mainStore.dispatchRemoveNotification({notification: newNotification.value, timeout: 6500});
+
+  watch(firstNotification, async (newNotification, oldNotification,) => {
+    if (newNotification !== currentNotification.value) {
+      await setNotification(newNotification);
+      if (newNotification) {
+        mainStore.dispatchRemoveNotification({notification: newNotification, timeout: 6500});
       }
     }
   })

frontend/src/views/main/admin/TestCelery.vue

@@ -6,7 +6,7 @@
       </v-card-title>
       <v-card-text>
           <v-form v-model="valid" ref="form">
-            <v-text-field label="Message" v-model="msg" :rules="required" ></v-text-field>
+            <v-text-field @keyup.enter="submit" label="Message" v-model="msg" :rules="required" ></v-text-field>
           </v-form>
       </v-card-text>
       <v-card-actions>