Hot reload after adding new objects

src/components/utilities/assetManager/partials/ObjectDetails.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="object-manager">
     <div class="image-container">
-<!--      @TODO show img with width100% to keep quality and show it center with padding around it, preferably the window wont jump if a larger object is selected -->
+      <!--      @TODO show img with width100% to keep quality and show it center with padding around it, preferably the window wont jump if a larger object is selected -->
       <img :src="objectImageUrl" :alt="'Object ' + selectedObject" />
     </div>
     <div class="modal-form asset-manager">

src/components/utilities/assetManager/partials/ObjectList.vue

@@ -8,7 +8,7 @@
   </div>
   <a class="asset" :class="{ active: assetManagerStore.selectedObject === object.id }" v-for="(object, index) in assetManagerStore.objectList" :key="index" @click="assetManagerStore.setSelectedObject(object.id)">
     <div class="asset-details">
-<!--      @TODO make all img have same width so text aligns nicely -->
+      <!--      @TODO make all img have same width so text aligns nicely -->
       <img :src="`${config.server_endpoint}/assets/objects/${object.id}.png`" alt="Object" />
       <span class="asset-name">{{ object.name }}</span>
     </div>
@@ -20,11 +20,13 @@ import config from '@/config'
 import { useSocketStore } from '@/stores/socket'
 import { onMounted, ref } from 'vue'
 import { useAssetManagerStore } from '@/stores/assetManager'
+import { useAssetStore } from '@/stores/assets'
 import type { Object } from '@/types'
 
 const socket = useSocketStore()
 const objectUploadField = ref(null)
 const assetManagerStore = useAssetManagerStore()
+const assetStore = useAssetStore()
 
 const handleFileUpload = (e: Event) => {
   const files = (e.target as HTMLInputElement).files
@@ -34,6 +36,9 @@ const handleFileUpload = (e: Event) => {
       if (config.development) console.error('Failed to upload object')
       return
     }
+
+    assetStore.fetchAssets()
+
     socket.connection.emit('gm:object:list', {}, (response: Object[]) => {
       assetManagerStore.setObjectList(response)
     })

src/components/utilities/assetManager/partials/TileList.vue

@@ -19,10 +19,12 @@ import config from '@/config'
 import { useSocketStore } from '@/stores/socket'
 import { onMounted, ref } from 'vue'
 import { useAssetManagerStore } from '@/stores/assetManager'
+import { useAssetStore } from '@/stores/assets'
 
 const socket = useSocketStore()
 const tileUploadField = ref(null)
 const assetManagerStore = useAssetManagerStore()
+const assetStore = useAssetStore()
 
 const handleFileUpload = (e: Event) => {
   const files = (e.target as HTMLInputElement).files
@@ -32,6 +34,8 @@ const handleFileUpload = (e: Event) => {
       if (config.development) console.error('Failed to upload tile')
       return
     }
+
+    assetStore.fetchAssets()
     socket.connection.emit('gm:tile:list', {}, (response: string[]) => {
       assetManagerStore.setTileList(response)
     })