fix: instanceJoinHistory not updating correctly (#1478)

src/components/dialogs/WorldDialog/WorldDialog.vue

@@ -342,6 +342,7 @@
                         <template
                             v-if="isAgeGatedInstancesVisible || !(room.ageGate || room.location?.includes('~ageGate'))">
                             <div style="margin: 5px 0">
+                                <div class="flex-align-center">
                                     <LocationWorld
                                         :locationobject="room.$location"
                                         :currentuserid="currentUser.id"
@@ -378,6 +379,7 @@
                                         :location="room.tag"
                                         :instance="room.ref"
                                         :friendcount="room.friendCount" />
+                                </div>
                                 <div
                                     v-if="room.$location.userId || room.users.length"
                                     class="x-friend-list"
@@ -1400,3 +1402,10 @@
         D.visible = true;
     }
 </script>
+
+<style scoped>
+    .flex-align-center {
+        display: flex;
+        align-items: center;
+    }
+</style>

src/stores/instance.js

@@ -16,7 +16,8 @@ import {
     hasGroupPermission,
     isRealInstance,
     parseLocation,
-    replaceBioSymbols
+    replaceBioSymbols,
+    replaceReactiveObject
 } from '../shared/utils';
 import { instanceRequest, userRequest, worldRequest } from '../api';
 import { database } from '../service/database';
@@ -79,7 +80,7 @@ export const useInstanceStore = defineStore('Instance', () => {
 
     const previousInstancesInfoDialogInstanceId = ref('');
 
-    let instanceJoinHistory = reactive(new Map());
+    const instanceJoinHistory = reactive(new Map());
 
     const currentInstanceUsersData = ref([]);
     const currentInstanceUsersTable = computed(() => {
@@ -116,9 +117,8 @@ export const useInstanceStore = defineStore('Instance', () => {
 
     async function getInstanceJoinHistory() {
         try {
-            instanceJoinHistory = reactive(
-                await database.getInstanceJoinHistory()
-            );
+            const data = await database.getInstanceJoinHistory();
+            replaceReactiveObject(instanceJoinHistory, data);
         } catch (error) {
             console.error('Failed to get instance join history:', error);
         }