Bad implementation of hot loading images (Temporary)

src/components/ImageUpload.vue

@@ -11,7 +11,7 @@
         "
         multiple
       />
-      <button :disabled="notImage || noImage" @click="submitImages()">
+      <button :disabled="notImage || noImage" @click="submitImages">
         Submit
       </button>
     </div>
@@ -49,12 +49,13 @@ export default {
         }
       }
     },
-    submitImages() {
+    async submitImages() {
       let formData = new FormData();
       for (let i = 0; i < this.imageList.length; i++) {
         formData.set("image", this.imageList[i]);
-        this.postImage(formData);
+        await this.postImage(formData);
       }
+      this.$emit("image-submitted");
     },
     async postImage(fd) {
       try {
@@ -68,13 +69,10 @@ export default {
         const response = await fetch("api/image", options);
         const data = await response.json();
         console.log(data);
-        this.addStateHashArray(data.hash);
-        console.log("Hash added");
       } catch {
         (error) => console.error(error);
       }
     },
-    ...mapActions(["addStateHashArray"]),
   },
 };
 </script>