From bbbfbc1061fbced2c8ccf4879597305ab0d89157 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 12 Jan 2023 20:19:12 +0100
Subject: [PATCH] hopefully this fixed chat updates

---
 packages/client/src/components/MkPagination.vue |  1 +
 packages/client/src/pages/messaging/index.vue   | 11 +++++++++--
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index 9f1fad38e3..703e8c66b5 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -64,6 +64,7 @@ const props = withDefaults(defineProps<{
 	pagination: Paging;
 	disableAutoLoad?: boolean;
 	displayLimit?: number;
+	reloadKey?: number;
 }>(), {
 	displayLimit: 30,
 });
diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index af2baf8525..3798ec6f87 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -37,7 +37,7 @@
 </template>
 
 <script lang="ts" setup>
-import { markRaw, onMounted, onUnmounted, watch } from 'vue';
+import { markRaw, onMounted, onUnmounted, watch, ref } from 'vue';
 import * as Acct from 'calckey-js/built/acct';
 import { Virtual } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/vue';
@@ -59,11 +59,16 @@ const router = useRouter();
 
 let messages = $ref([]);
 let connection = $ref(null);
+const reloadingKey = ref(0);
 
 const tabs = ['dms', 'groups'];
 let tab = $ref(tabs[0]);
 watch($$(tab), () => (syncSlide(tabs.indexOf(tab))));
 
+const forceRerender = () => {
+  reloadingKey.value += 1;
+};
+
 const headerActions = $computed(() => [{
 	asFullButton: true,
 	icon: 'ph-plus-bold ph-lg',
@@ -112,6 +117,7 @@ function onMessage(message): void {
 		messages = messages.filter(m => m.groupId !== message.groupId);
 		messages.unshift(message);
 	}
+	forceRerender();
 }
 
 function onRead(ids): void {
@@ -183,11 +189,12 @@ function syncSlide(index) {
 }
 
 onMounted(() => {
-	syncSlide(tabs.indexOf(swiperRef.activeIndex));
+	syncSlide(tabs.indexOf(swiperRef?.activeIndex));
 
 	connection = markRaw(stream.useChannel('messagingIndex'));
 
 	connection.on('message', onMessage);
+	connection.on('messagingMessage', onMessage);
 	connection.on('read', onRead);
 
 	os.api('messaging/history', { group: false, limit: 5 }).then(userMessages => {