Move the update hash array function to the relevant component

src/components/ImageList.vue

 <template>
   <section id="list-container">
-    <div id="item-container" v-for="(hash, index) in hashArray" :key="index">
+    <div
+      id="item-container"
+      v-for="(hash, index) in stateHashArray"
+      :key="index"
+    >
       <ImageItem :hash="hash" @checked="appendToDeleteArray"></ImageItem>
     </div>
     <button v-show="deleteArray.length" @click="deleteImages(deleteArray)">
@@ -11,7 +15,7 @@
 
 <script>
 import ImageItem from "@/components/ImageItem.vue";
-import { mapState } from "vuex";
+import { mapState, mapActions } from "vuex";
 export default {
   components: {
     ImageItem,
@@ -21,15 +25,21 @@ export default {
       deleteArray: [],
     };
   },
-  props: {
-    hashArray: {
-      required: true,
-    },
-  },
   computed: {
-    ...mapState(["stateUser"]),
+    ...mapState(["stateUser", "stateHashArray"]),
+  },
+  created() {
+    this.updateHashArray();
   },
   methods: {
+    async updateHashArray() {
+      const response = await fetch("../api/image");
+      const data = await response.json();
+      if (data) {
+        this.setStateHashArray(data);
+        console.log("Set State Hash Array");
+      }
+    },
     appendToDeleteArray(...args) {
       const [checked, hash] = args;
       checked
@@ -46,6 +56,7 @@ export default {
       }
       this.deleteArray = [];
     },
+    ...mapActions(["setStateHashArray"]),
   },
 };
 </script>

src/views/Home.vue

@@ -7,7 +7,7 @@
         <UserAuthentication class="absolute bottom-0"></UserAuthentication>
       </div>
     </section>
-    <ImageList :hashArray="stateHashArray"></ImageList>
+    <ImageList></ImageList>
   </div>
 </template>
 
@@ -16,7 +16,6 @@ import ImageList from "@/components/ImageList.vue";
 import ImageUpload from "@/components/ImageUpload.vue";
 import TagCreation from "@/components/TagCreation.vue";
 import UserAuthentication from "@/components/UserAuthentication.vue";
-import { mapState, mapActions } from "vuex";
 
 export default {
   components: {
@@ -25,23 +24,6 @@ export default {
     TagCreation,
     UserAuthentication,
   },
-  computed: {
-    ...mapState(["stateHashArray"]),
-  },
-  created() {
-    this.updateHashArray();
-  },
-  methods: {
-    async updateHashArray() {
-      const response = await fetch("../api/image");
-      const data = await response.json();
-      if (data) {
-        this.setStateHashArray(data);
-        console.log("Set State Hash Array");
-      }
-    },
-    ...mapActions(["setStateHashArray"]),
-  },
 };
 </script>