From d12ebc3422e6616c4da2ffc7a3dca7f684600624 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Wed, 18 Jan 2023 21:35:38 +0100
Subject: [PATCH 01/21] potential fix

---
 packages/client/src/pages/messaging/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 1966f29690..79cb1f7313 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -89,14 +89,14 @@ definePageMetadata({
 
 const dmsPagination = {
 	endpoint: 'messaging/history' as const,
-	limit: 15,
+	limit: 100,
 	params: {
 		group: false,
 	},
 };
 const groupsPagination = {
 	endpoint: 'messaging/history' as const,
-	limit: 5,
+	limit: 30,
 	params: {
 		group: true,
 	},

From 58b2f7f138edaf2179bce0db86ee7118892249ce Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Wed, 18 Jan 2023 22:01:33 +0100
Subject: [PATCH 02/21] quick fix

---
 packages/client/src/pages/messaging/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 79cb1f7313..c9d68ccaeb 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -89,7 +89,7 @@ definePageMetadata({
 
 const dmsPagination = {
 	endpoint: 'messaging/history' as const,
-	limit: 100,
+	limit: 99,
 	params: {
 		group: false,
 	},

From 86bb42b52985e966ba207f604feb1071b0b1a15f Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Wed, 18 Jan 2023 23:48:05 +0100
Subject: [PATCH 03/21] YEET

---
 packages/client/src/components/MkPagination.vue | 17 ++++-------------
 1 file changed, 4 insertions(+), 13 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index 3327a67966..95b86c51ab 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -278,17 +278,6 @@ const prepend = (item: Item): void => {
 			// Prepend the item
 			items.value.unshift(item);
 			if(props.externalItemArray) props.externalItemArray.value.unshift(item);
-
-			// オーバーフローしたら古いアイテムは捨てる
-			if (items.value.length >= props.displayLimit) {
-				// このやり方だとVue 3.2以降アニメーションが動かなくなる
-				//this.items = items.value.slice(0, props.displayLimit);
-				while (items.value.length >= props.displayLimit) {
-					items.value.pop();
-					if(props.externalItemArray) props.externalItemArray.value.pop();
-				}
-				more.value = true;
-			}
 		} else {
 			queue.value.push(item);
 			onScrollTop(rootEl.value, () => {
@@ -308,7 +297,8 @@ const append = (item: Item): void => {
 
 const removeItem = (finder: (item: Item) => boolean): boolean => {
 	const i = items.value.findIndex(finder);
-	if (i === -1) {
+	const j = props.externalItemArray?.findIndex(finder);
+	if (i === -1 && j === -1) {
 		return false;
 	}
 
@@ -319,7 +309,8 @@ const removeItem = (finder: (item: Item) => boolean): boolean => {
 
 const updateItem = (id: Item['id'], replacer: (old: Item) => Item): boolean => {
 	const i = items.value.findIndex(item => item.id === id);
-	if (i === -1) {
+	const j = props.externalItemArray?.findIndex(item => item.id === id);
+	if (i === -1 && j === -1) {
 		return false;
 	}
 

From f85f072b4b08338341c629adba8c85533ca51545 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Wed, 18 Jan 2023 23:54:59 +0100
Subject: [PATCH 04/21] chore: reformat MkPagination

---
 .../client/src/components/MkPagination.vue    | 89 ++++++++++---------
 1 file changed, 48 insertions(+), 41 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index 95b86c51ab..84c79fe28a 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -1,34 +1,37 @@
 <template>
-<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
-	<MkLoading v-if="fetching"/>
+	<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
+		<MkLoading v-if="fetching" />
 
-	<MkError v-else-if="error" @retry="init()"/>
+		<MkError v-else-if="error" @retry="init()" />
 
-	<div v-else-if="empty" key="_empty_" class="empty">
-		<slot name="empty">
-			<div class="_fullinfo">
-				<img src="/static-assets/badges/info.png" class="_ghost" alt="Error"/>
-				<div>{{ i18n.ts.nothing }}</div>
+		<div v-else-if="empty" key="_empty_" class="empty">
+			<slot name="empty">
+				<div class="_fullinfo">
+					<img src="/static-assets/badges/info.png" class="_ghost" alt="Error" />
+					<div>{{ i18n.ts.nothing }}</div>
+				</div>
+			</slot>
+		</div>
+
+		<div v-else ref="rootEl">
+			<div v-show="pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
+				<MkButton v-if="!moreFetching" class="button" :disabled="moreFetching"
+					:style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead">
+					{{ i18n.ts.loadMore }}
+				</MkButton>
+				<MkLoading v-else class="loading" />
+			</div>
+			<slot :items="items"></slot>
+			<div v-show="!pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
+				<MkButton v-if="!moreFetching"
+					v-appear="($store.state.enableInfiniteScroll && !disableAutoLoad) ? fetchMore : null" class="button"
+					:disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore">
+					{{ i18n.ts.loadMore }}
+				</MkButton>
+				<MkLoading v-else class="loading" />
 			</div>
-		</slot>
-	</div>
-
-	<div v-else ref="rootEl">
-		<div v-show="pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
-			<MkButton v-if="!moreFetching" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead">
-				{{ i18n.ts.loadMore }}
-			</MkButton>
-			<MkLoading v-else class="loading"/>
 		</div>
-		<slot :items="items"></slot>
-		<div v-show="!pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
-			<MkButton v-if="!moreFetching" v-appear="($store.state.enableInfiniteScroll && !disableAutoLoad) ? fetchMore : null" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore">
-				{{ i18n.ts.loadMore }}
-			</MkButton>
-			<MkLoading v-else class="loading"/>
-		</div>
-	</div>
-</transition>
+	</transition>
 </template>
 
 <script lang="ts" setup>
@@ -74,7 +77,7 @@ const emit = defineEmits<{
 	(ev: 'queue', count: number): void;
 }>();
 
-type Item = { id: string; [another: string]: unknown; };
+type Item = { id: string;[another: string]: unknown; };
 
 const rootEl = ref<HTMLElement>();
 const items = ref<Item[]>([]);
@@ -112,7 +115,7 @@ const init = async (): Promise<void> => {
 			items.value = props.pagination.reversed ? [...res].reverse() : res;
 			more.value = false;
 		}
-		if(props.externalItemArray) {
+		if (props.externalItemArray) {
 			props.externalItemArray.value = items.value;
 		}
 		offset.value = res.length;
@@ -126,7 +129,7 @@ const init = async (): Promise<void> => {
 
 const reload = (): void => {
 	items.value = [];
-	if(props.externalItemArray) {
+	if (props.externalItemArray) {
 		props.externalItemArray.value = [];
 	}
 	init();
@@ -193,7 +196,7 @@ const fetchMore = async (): Promise<void> => {
 			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			more.value = false;
 		}
-		if(props.externalItemArray) {
+		if (props.externalItemArray) {
 			props.externalItemArray.value = items.value;
 		}
 		offset.value += res.length;
@@ -220,15 +223,18 @@ const fetchMoreAhead = async (): Promise<void> => {
 	}).then(res => {
 		if (res.length > SECOND_FETCH_LIMIT) {
 			res.pop();
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			more.value = true;
 		} else {
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			more.value = false;
 		}
-		if(props.externalItemArray) {
-			props.externalItemArray.value = items.value;
-		}
 		offset.value += res.length;
 		moreFetching.value = false;
 	}, err => {
@@ -254,7 +260,7 @@ const prepend = (item: Item): void => {
 						//items.value = items.value.slice(-props.displayLimit);
 						while (items.value.length >= props.displayLimit) {
 							items.value.shift();
-							if(props.externalItemArray) props.externalItemArray.value.shift();
+							if (props.externalItemArray) props.externalItemArray.value.shift();
 						}
 						more.value = true;
 					}
@@ -262,13 +268,13 @@ const prepend = (item: Item): void => {
 			}
 		}
 		items.value.push(item);
-		if(props.externalItemArray) props.externalItemArray.value.push(item);
+		if (props.externalItemArray) props.externalItemArray.value.push(item);
 		// TODO
 	} else {
 		// 初回表示時はunshiftだけでOK
 		if (!rootEl.value) {
 			items.value.unshift(item);
-			if(props.externalItemArray) props.externalItemArray.value.unshift(item);
+			if (props.externalItemArray) props.externalItemArray.value.unshift(item);
 			return;
 		}
 
@@ -277,7 +283,7 @@ const prepend = (item: Item): void => {
 		if (isTop) {
 			// Prepend the item
 			items.value.unshift(item);
-			if(props.externalItemArray) props.externalItemArray.value.unshift(item);
+			if (props.externalItemArray) props.externalItemArray.value.unshift(item);
 		} else {
 			queue.value.push(item);
 			onScrollTop(rootEl.value, () => {
@@ -292,7 +298,7 @@ const prepend = (item: Item): void => {
 
 const append = (item: Item): void => {
 	items.value.push(item);
-	if(props.externalItemArray) props.externalItemArray.value.push(item);
+	if (props.externalItemArray) props.externalItemArray.value.push(item);
 };
 
 const removeItem = (finder: (item: Item) => boolean): boolean => {
@@ -303,7 +309,7 @@ const removeItem = (finder: (item: Item) => boolean): boolean => {
 	}
 
 	items.value.splice(i, 1);
-	if(props.externalItemArray) props.externalItemArray.value.splice(i, 1);
+	if (props.externalItemArray) props.externalItemArray.value.splice(i, 1);
 	return true;
 };
 
@@ -315,7 +321,7 @@ const updateItem = (id: Item['id'], replacer: (old: Item) => Item): boolean => {
 	}
 
 	items.value[i] = replacer(items.value[i]);
-	if(props.externalItemArray) props.externalItemArray.value[i] = items.value[i];
+	if (props.externalItemArray) props.externalItemArray.value[i] = items.value[i];
 	return true;
 };
 
@@ -356,13 +362,14 @@ defineExpose({
 .fade-leave-active {
 	transition: opacity 0.15s ease;
 }
+
 .fade-enter-from,
 .fade-leave-to {
 	opacity: 0;
 }
 
 .cxiknjgy {
-	> .button {
+	>.button {
 		margin-left: auto;
 		margin-right: auto;
 	}

From 02e82697933eea26cc2a8f330590ad6b1907a262 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Wed, 18 Jan 2023 23:58:16 +0100
Subject: [PATCH 05/21] wip

---
 packages/client/src/components/MkPagination.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index 84c79fe28a..fe1c565500 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -223,16 +223,16 @@ const fetchMoreAhead = async (): Promise<void> => {
 	}).then(res => {
 		if (res.length > SECOND_FETCH_LIMIT) {
 			res.pop();
+			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			if (props.externalItemArray) {
 				props.externalItemArray.value = items.value;
 			}
-			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			more.value = true;
 		} else {
+			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			if (props.externalItemArray) {
 				props.externalItemArray.value = items.value;
 			}
-			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
 			more.value = false;
 		}
 		offset.value += res.length;

From 2dcdb7d29ec6fc98505df0b4bf33a42e69241b73 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 00:00:36 +0100
Subject: [PATCH 06/21] wip

---
 .../client/src/components/MkPagination.vue     | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index fe1c565500..c262ee931c 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -110,14 +110,17 @@ const init = async (): Promise<void> => {
 		if (!props.pagination.noPaging && (res.length > (props.pagination.limit || 10))) {
 			res.pop();
 			items.value = props.pagination.reversed ? [...res].reverse() : res;
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			more.value = true;
 		} else {
 			items.value = props.pagination.reversed ? [...res].reverse() : res;
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			more.value = false;
 		}
-		if (props.externalItemArray) {
-			props.externalItemArray.value = items.value;
-		}
 		offset.value = res.length;
 		error.value = false;
 		fetching.value = false;
@@ -191,14 +194,17 @@ const fetchMore = async (): Promise<void> => {
 		if (res.length > SECOND_FETCH_LIMIT) {
 			res.pop();
 			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			more.value = true;
 		} else {
 			items.value = props.pagination.reversed ? [...res].reverse().concat(items.value) : items.value.concat(res);
+			if (props.externalItemArray) {
+				props.externalItemArray.value = items.value;
+			}
 			more.value = false;
 		}
-		if (props.externalItemArray) {
-			props.externalItemArray.value = items.value;
-		}
 		offset.value += res.length;
 		moreFetching.value = false;
 	}, err => {

From beb5f95ce4ee61955e3ab12b290add23c1df324f Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 00:06:40 +0100
Subject: [PATCH 07/21] wip

---
 packages/client/src/pages/messaging/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index c9d68ccaeb..f84d54fe81 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -14,7 +14,7 @@
 				<swiper-slide>
 					<div class="_content yweeujhr dms">
 						<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
-						<MkPagination v-slot="{}" :externalItemArray="messages" :pagination="dmsPagination">
+						<MkPagination v-slot="{items}" :externalItemArray="messages" :pagination="dmsPagination">
 							<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block" :message="message"/>
 						</MkPagination>
 					</div>
@@ -25,7 +25,7 @@
 							<MkButton primary class="start" :link="true" to="/my/groups"><i class="ph-user-circle-gear-bold ph-lg"></i> {{ i18n.ts.manageGroups }}</MkButton>
 							<MkButton primary class="start" @click="startGroup"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
 						</div>
-						<MkPagination v-slot="{}" :externalItemArray="groupMessages" :pagination="groupsPagination">
+						<MkPagination v-slot="{items}" :externalItemArray="groupMessages" :pagination="groupsPagination">
 							<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block" :message="message"/>
 						</MkPagination>
 					</div>

From 0edc80b10a7cc3158ac0430046b4a521ffc3770a Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 00:08:26 +0100
Subject: [PATCH 08/21] chore: reformat messaging/index.vue

---
 packages/client/src/pages/messaging/index.vue | 100 +++++++++---------
 1 file changed, 52 insertions(+), 48 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index f84d54fe81..ca4e3e3af5 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -1,39 +1,43 @@
 <template>
-<MkStickyContainer>
-	<template #header><MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template>
-	<div>
-		<MkSpacer :content-max="800">
-			<swiper
-				:modules="[Virtual]"
-				:space-between="20"
-				:virtual="true"
-				:allow-touch-move="!(deviceKind === 'desktop' && !defaultStore.state.swipeOnDesktop)"
-				@swiper="setSwiperRef"
-				@slide-change="onSlideChange"
-			>
-				<swiper-slide>
-					<div class="_content yweeujhr dms">
-						<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
-						<MkPagination v-slot="{items}" :externalItemArray="messages" :pagination="dmsPagination">
-							<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block" :message="message"/>
-						</MkPagination>
-					</div>
-				</swiper-slide>
-				<swiper-slide>
-					<div class="_content yweeujhr groups">
-						<div class="groupsbuttons">
-							<MkButton primary class="start" :link="true" to="/my/groups"><i class="ph-user-circle-gear-bold ph-lg"></i> {{ i18n.ts.manageGroups }}</MkButton>
-							<MkButton primary class="start" @click="startGroup"><i class="ph-plus-bold ph-lg"></i> {{ i18n.ts.startMessaging }}</MkButton>
+	<MkStickyContainer>
+		<template #header>
+			<MkPageHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs" />
+		</template>
+		<div>
+			<MkSpacer :content-max="800">
+				<swiper :modules="[Virtual]" :space-between="20" :virtual="true"
+					:allow-touch-move="!(deviceKind === 'desktop' && !defaultStore.state.swipeOnDesktop)" @swiper="setSwiperRef"
+					@slide-change="onSlideChange">
+					<swiper-slide>
+						<div class="_content yweeujhr dms">
+							<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{
+								i18n.ts.startMessaging
+							}}</MkButton>
+							<MkPagination v-slot="{ items }" :externalItemArray="messages" :pagination="dmsPagination">
+								<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block"
+									:message="message" />
+							</MkPagination>
 						</div>
-						<MkPagination v-slot="{items}" :externalItemArray="groupMessages" :pagination="groupsPagination">
-							<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block" :message="message"/>
-						</MkPagination>
-					</div>
-				</swiper-slide>
-			</swiper>
-		</MkSpacer>
-	</div>
-</MkStickyContainer>
+					</swiper-slide>
+					<swiper-slide>
+						<div class="_content yweeujhr groups">
+							<div class="groupsbuttons">
+								<MkButton primary class="start" :link="true" to="/my/groups"><i
+										class="ph-user-circle-gear-bold ph-lg"></i> {{ i18n.ts.manageGroups }}</MkButton>
+								<MkButton primary class="start" @click="startGroup"><i class="ph-plus-bold ph-lg"></i> {{
+									i18n.ts.startMessaging
+								}}</MkButton>
+							</div>
+							<MkPagination v-slot="{ items }" :externalItemArray="groupMessages" :pagination="groupsPagination">
+								<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block"
+									:message="message" />
+							</MkPagination>
+						</div>
+					</swiper-slide>
+				</swiper>
+			</MkSpacer>
+		</div>
+	</MkStickyContainer>
 </template>
 
 <script lang="ts" setup>
@@ -106,7 +110,7 @@ function onMessage(message): void {
 	if (message.recipientId) {
 		messages = messages.filter(m => !(
 			(m.recipientId === message.recipientId && m.userId === message.userId) ||
-				(m.recipientId === message.userId && m.userId === message.recipientId)));
+			(m.recipientId === message.userId && m.userId === message.recipientId)));
 
 		messages.unshift(message);
 	} else if (message.groupId) {
@@ -206,17 +210,17 @@ onUnmounted(() => {
 });
 </script>
 
-	<style lang="scss" scoped>
-	.yweeujhr {
-		> .start {
-			margin: 0 auto var(--margin) auto;
-		}
-
-		> .groupsbuttons {
-			max-width: 100%;
-			display: flex;
-			justify-content: center;
-			margin-bottom: 1rem;
-		}
+<style lang="scss" scoped>
+.yweeujhr {
+	>.start {
+		margin: 0 auto var(--margin) auto;
 	}
-	</style>
+
+	>.groupsbuttons {
+		max-width: 100%;
+		display: flex;
+		justify-content: center;
+		margin-bottom: 1rem;
+	}
+}
+</style>

From 91cc7af40adcc1cd0cdbd5888a926fb617c04b88 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 00:29:04 +0100
Subject: [PATCH 09/21] wip

---
 packages/client/src/pages/messaging/index.vue | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index ca4e3e3af5..8faca318e1 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -41,7 +41,7 @@
 </template>
 
 <script lang="ts" setup>
-import { markRaw, onMounted, onUnmounted, watch } from 'vue';
+import { markRaw, onMounted, onUnmounted, watch, computed } from 'vue';
 import * as Acct from 'calckey-js/built/acct';
 import { Virtual } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/vue';
@@ -93,17 +93,19 @@ definePageMetadata({
 
 const dmsPagination = {
 	endpoint: 'messaging/history' as const,
-	limit: 99,
-	params: {
+	limit: 20,
+	params: computed(() => ({
 		group: false,
-	},
+	})),
+	offsetMode: true,
 };
 const groupsPagination = {
 	endpoint: 'messaging/history' as const,
-	limit: 30,
-	params: {
+	limit: 10,
+	params: computed(() => ({
 		group: true,
-	},
+	})),
+	offsetMode: true,
 };
 
 function onMessage(message): void {

From d6b902fd3d96ac82bc8ed518f90e2fd0bb47e39b Mon Sep 17 00:00:00 2001
From: yawhn <kordaris@gmail.com>
Date: Thu, 19 Jan 2023 17:48:55 +0200
Subject: [PATCH 10/21] https://codeberg.org/calckey/calckey/issues/9350

Ads: Fix for "Unable to preload CSS/JS" issue
---
 packages/client/src/pages/admin/{ads.vue => advertisments.vue} | 0
 packages/client/src/router.ts                                  | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename packages/client/src/pages/admin/{ads.vue => advertisments.vue} (100%)

diff --git a/packages/client/src/pages/admin/ads.vue b/packages/client/src/pages/admin/advertisments.vue
similarity index 100%
rename from packages/client/src/pages/admin/ads.vue
rename to packages/client/src/pages/admin/advertisments.vue
diff --git a/packages/client/src/router.ts b/packages/client/src/router.ts
index 0cab26bf9d..ef7457eb7a 100644
--- a/packages/client/src/router.ts
+++ b/packages/client/src/router.ts
@@ -460,7 +460,7 @@ export const routes = [
 			{
 				path: "/ads",
 				name: "ads",
-				component: page(() => import("./pages/admin/ads.vue")),
+				component: page(() => import("./pages/admin/advertisments.vue")),
 			},
 			{
 				path: "/database",

From 641feb04e319de9bc98e8f2451edf7ebed0c4ef2 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:07:01 +0100
Subject: [PATCH 11/21] does it fix speed?

---
 packages/client/src/pages/messaging/index.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 8faca318e1..ed9a33069e 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -13,8 +13,8 @@
 							<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{
 								i18n.ts.startMessaging
 							}}</MkButton>
-							<MkPagination v-slot="{ items }" :externalItemArray="messages" :pagination="dmsPagination">
-								<MkChatPreview v-for="message in messages" :key="message.id" class="yweeujhr message _block"
+							<MkPagination v-slot="{ items }" :pagination="dmsPagination">
+								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
 						</div>
@@ -28,8 +28,8 @@
 									i18n.ts.startMessaging
 								}}</MkButton>
 							</div>
-							<MkPagination v-slot="{ items }" :externalItemArray="groupMessages" :pagination="groupsPagination">
-								<MkChatPreview v-for="message in groupMessages" :key="message.id" class="yweeujhr message _block"
+							<MkPagination v-slot="{ items }" :pagination="groupsPagination">
+								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
 						</div>

From 269bc3fdff28bccf27ec219b50e06a1b53a15f83 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:35:16 +0100
Subject: [PATCH 12/21] reloading chat to hotfix caching issue

---
 packages/client/src/pages/messaging/index.vue | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index ed9a33069e..252dce76e9 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -13,7 +13,7 @@
 							<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{
 								i18n.ts.startMessaging
 							}}</MkButton>
-							<MkPagination v-slot="{ items }" :pagination="dmsPagination">
+							<MkPagination v-slot="{ items }" ref="paginationComponentUser" :pagination="dmsPagination">
 								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
@@ -28,7 +28,7 @@
 									i18n.ts.startMessaging
 								}}</MkButton>
 							</div>
-							<MkPagination v-slot="{ items }" :pagination="groupsPagination">
+							<MkPagination v-slot="{ items }" ref="paginationComponentGroup" :pagination="groupsPagination">
 								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
@@ -41,7 +41,7 @@
 </template>
 
 <script lang="ts" setup>
-import { markRaw, onMounted, onUnmounted, watch, computed } from 'vue';
+import { markRaw, onMounted, onUnmounted, watch, computed, onActivated } from 'vue';
 import * as Acct from 'calckey-js/built/acct';
 import { Virtual } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/vue';
@@ -65,6 +65,9 @@ let messages = $ref([]);
 let groupMessages = $ref([]);
 let connection = $ref(null);
 
+let paginationComponentUser = $ref<InstanceType<typeof MkPagination>>();
+let paginationComponentGroup = $ref<InstanceType<typeof MkPagination>>();
+
 const tabs = ['dms', 'groups'];
 let tab = $ref(tabs[0]);
 watch($$(tab), () => (syncSlide(tabs.indexOf(tab))));
@@ -210,6 +213,11 @@ onMounted(() => {
 onUnmounted(() => {
 	if (connection) connection.dispose();
 });
+
+onActivated(() => {
+	paginationComponentUser.reload();
+	paginationComponentGroup.reload();
+});
 </script>
 
 <style lang="scss" scoped>

From 976f06f4e38dab3ad0f86a7e963d529b396b0cd5 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:37:44 +0100
Subject: [PATCH 13/21] fix: Chats did nt update in realtime

---
 packages/client/src/pages/messaging/index.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 252dce76e9..5b0758d407 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -64,7 +64,6 @@ const router = useRouter();
 let messages = $ref([]);
 let groupMessages = $ref([]);
 let connection = $ref(null);
-
 let paginationComponentUser = $ref<InstanceType<typeof MkPagination>>();
 let paginationComponentGroup = $ref<InstanceType<typeof MkPagination>>();
 

From 69f6955cf52103806e7aca90c5950b91d2c6479f Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:45:26 +0100
Subject: [PATCH 14/21] ah a lil fix before anybody pulls

---
 packages/client/src/pages/messaging/index.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 5b0758d407..3bca23e233 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -213,10 +213,11 @@ onUnmounted(() => {
 	if (connection) connection.dispose();
 });
 
+/*
 onActivated(() => {
 	paginationComponentUser.reload();
 	paginationComponentGroup.reload();
-});
+});*/
 </script>
 
 <style lang="scss" scoped>

From d961c3d61dce9a27c1c205a8c376609ee43701f5 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:50:15 +0100
Subject: [PATCH 15/21] mew?

---
 packages/client/src/pages/messaging/index.vue | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 3bca23e233..6e020f4e7a 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -213,11 +213,16 @@ onUnmounted(() => {
 	if (connection) connection.dispose();
 });
 
-/*
+// temporary hot fix of the temporary hot fix
+let alreadyInit = $ref(false);
+
 onActivated(() => {
-	paginationComponentUser.reload();
-	paginationComponentGroup.reload();
-});*/
+	if (!alreadyInit.value) alreadyInit.value = true;
+	else {
+		paginationComponentUser.reload();
+		paginationComponentGroup.reload();
+	}
+});
 </script>
 
 <style lang="scss" scoped>

From 03234acb8faf16a2c9e794f86bfc4a2e20670d43 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 17:58:53 +0100
Subject: [PATCH 16/21] meow

---
 packages/client/src/pages/messaging/index.vue | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 6e020f4e7a..43f3c118a0 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -41,7 +41,7 @@
 </template>
 
 <script lang="ts" setup>
-import { markRaw, onMounted, onUnmounted, watch, computed, onActivated } from 'vue';
+import { markRaw, onMounted, onUnmounted, watch, computed, onActivated, onDeactivated } from 'vue';
 import * as Acct from 'calckey-js/built/acct';
 import { Virtual } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/vue';
@@ -217,12 +217,15 @@ onUnmounted(() => {
 let alreadyInit = $ref(false);
 
 onActivated(() => {
-	if (!alreadyInit.value) alreadyInit.value = true;
-	else {
+	if (alreadyInit.value) {
 		paginationComponentUser.reload();
 		paginationComponentGroup.reload();
 	}
 });
+
+onDeactivated(() => {
+	alreadyInit.value = true;
+});
 </script>
 
 <style lang="scss" scoped>

From 66448b5e5201b8dec38dc0716ea34195a224a341 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 18:16:09 +0100
Subject: [PATCH 17/21] wip

---
 packages/client/src/pages/messaging/index.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index 43f3c118a0..a614085f64 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -62,7 +62,6 @@ import 'swiper/scss/virtual';
 const router = useRouter();
 
 let messages = $ref([]);
-let groupMessages = $ref([]);
 let connection = $ref(null);
 let paginationComponentUser = $ref<InstanceType<typeof MkPagination>>();
 let paginationComponentGroup = $ref<InstanceType<typeof MkPagination>>();
@@ -118,9 +117,10 @@ function onMessage(message): void {
 
 		messages.unshift(message);
 	} else if (message.groupId) {
-		groupMessages = groupMessages.filter(m => m.groupId !== message.groupId);
-		groupMessages.unshift(message);
+		messages = messages.filter(m => m.groupId !== message.groupId);
+		messages.unshift(message);
 	}
+	forceRerender();
 }
 
 function onRead(ids): void {

From 3dda8656f2f7d6edd2c16f747ce35643489f03bc Mon Sep 17 00:00:00 2001
From: yawhn <kordaris@gmail.com>
Date: Thu, 19 Jan 2023 19:21:03 +0200
Subject: [PATCH 18/21] Fix: typo regaring advertisements page

---
 .../src/pages/admin/{advertisments.vue => advertisements.vue}   | 0
 packages/client/src/router.ts                                   | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename packages/client/src/pages/admin/{advertisments.vue => advertisements.vue} (100%)

diff --git a/packages/client/src/pages/admin/advertisments.vue b/packages/client/src/pages/admin/advertisements.vue
similarity index 100%
rename from packages/client/src/pages/admin/advertisments.vue
rename to packages/client/src/pages/admin/advertisements.vue
diff --git a/packages/client/src/router.ts b/packages/client/src/router.ts
index ef7457eb7a..b287f330c8 100644
--- a/packages/client/src/router.ts
+++ b/packages/client/src/router.ts
@@ -460,7 +460,7 @@ export const routes = [
 			{
 				path: "/ads",
 				name: "ads",
-				component: page(() => import("./pages/admin/advertisments.vue")),
+				component: page(() => import("./pages/admin/advertisements.vue")),
 			},
 			{
 				path: "/database",

From 5a2990a2fa7418f3d6797de6aaaaed5f976ffa63 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 18:28:07 +0100
Subject: [PATCH 19/21] wip

---
 .../client/src/components/MkPagination.vue    |  5 +++++
 packages/client/src/pages/messaging/index.vue | 20 +++----------------
 2 files changed, 8 insertions(+), 17 deletions(-)

diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index c262ee931c..d98fc7252e 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -90,6 +90,7 @@ const backed = ref(false); // 遡り中か否か
 const isBackTop = ref(false);
 const empty = computed(() => items.value.length === 0);
 const error = ref(false);
+const alreadyInitedOnce = ref(false);
 
 const init = async (): Promise<void> => {
 	queue.value = [];
@@ -344,10 +345,14 @@ init();
 
 onActivated(() => {
 	isBackTop.value = false;
+	if(alreadyInitedOnce.value) {
+		reload();
+	}
 });
 
 onDeactivated(() => {
 	isBackTop.value = window.scrollY === 0;
+	alreadyInitedOnce.value = true;
 });
 
 defineExpose({
diff --git a/packages/client/src/pages/messaging/index.vue b/packages/client/src/pages/messaging/index.vue
index a614085f64..3866db1c77 100644
--- a/packages/client/src/pages/messaging/index.vue
+++ b/packages/client/src/pages/messaging/index.vue
@@ -13,7 +13,7 @@
 							<MkButton primary class="start" @click="startUser"><i class="ph-plus-bold ph-lg"></i> {{
 								i18n.ts.startMessaging
 							}}</MkButton>
-							<MkPagination v-slot="{ items }" ref="paginationComponentUser" :pagination="dmsPagination">
+							<MkPagination v-slot="{ items }" :pagination="dmsPagination">
 								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
@@ -28,7 +28,7 @@
 									i18n.ts.startMessaging
 								}}</MkButton>
 							</div>
-							<MkPagination v-slot="{ items }" ref="paginationComponentGroup" :pagination="groupsPagination">
+							<MkPagination v-slot="{ items }" :pagination="groupsPagination">
 								<MkChatPreview v-for="message in items" :key="message.id" class="yweeujhr message _block"
 									:message="message" />
 							</MkPagination>
@@ -41,7 +41,7 @@
 </template>
 
 <script lang="ts" setup>
-import { markRaw, onMounted, onUnmounted, watch, computed, onActivated, onDeactivated } from 'vue';
+import { markRaw, onMounted, onUnmounted, watch, computed } from 'vue';
 import * as Acct from 'calckey-js/built/acct';
 import { Virtual } from 'swiper';
 import { Swiper, SwiperSlide } from 'swiper/vue';
@@ -212,20 +212,6 @@ onMounted(() => {
 onUnmounted(() => {
 	if (connection) connection.dispose();
 });
-
-// temporary hot fix of the temporary hot fix
-let alreadyInit = $ref(false);
-
-onActivated(() => {
-	if (alreadyInit.value) {
-		paginationComponentUser.reload();
-		paginationComponentGroup.reload();
-	}
-});
-
-onDeactivated(() => {
-	alreadyInit.value = true;
-});
 </script>
 
 <style lang="scss" scoped>

From f3f45bac5c06334a8ce4c8dfc9774ae2f6459d20 Mon Sep 17 00:00:00 2001
From: cutestnekoaqua <waterdev@galaxycrow.de>
Date: Thu, 19 Jan 2023 19:16:53 +0100
Subject: [PATCH 20/21] fix: disable reloads on timeline

---
 packages/client/src/components/MkNotes.vue      | 2 +-
 packages/client/src/components/MkPagination.vue | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/MkNotes.vue b/packages/client/src/components/MkNotes.vue
index a67b59d73d..66f3d92d47 100644
--- a/packages/client/src/components/MkNotes.vue
+++ b/packages/client/src/components/MkNotes.vue
@@ -1,5 +1,5 @@
 <template>
-<MkPagination ref="pagingComponent" :pagination="pagination">
+<MkPagination ref="pagingComponent" :pagination="pagination" disableReload="true">
 	<template #empty>
 		<div class="_fullinfo">
 			<img src="/static-assets/badges/info.png" class="_ghost" alt="Info"/>
diff --git a/packages/client/src/components/MkPagination.vue b/packages/client/src/components/MkPagination.vue
index d98fc7252e..211db041a3 100644
--- a/packages/client/src/components/MkPagination.vue
+++ b/packages/client/src/components/MkPagination.vue
@@ -69,6 +69,7 @@ const props = withDefaults(defineProps<{
 	disableAutoLoad?: boolean;
 	displayLimit?: number;
 	externalItemArray?: Ref<Array<any>>;
+	disableReload?: boolean;
 }>(), {
 	displayLimit: 30,
 });
@@ -345,7 +346,7 @@ init();
 
 onActivated(() => {
 	isBackTop.value = false;
-	if(alreadyInitedOnce.value) {
+	if(alreadyInitedOnce.value && (!props.disableReload || !props.disableReload.value)) {
 		reload();
 	}
 });

From 03741c4aa4e27338153baa222e53c8c45334a1dd Mon Sep 17 00:00:00 2001
From: yawhn <kordaris@gmail.com>
Date: Thu, 19 Jan 2023 22:20:51 +0200
Subject: [PATCH 21/21] Fix: Advertisements is also blocked. Using promotions
 instead.

---
 .../src/pages/admin/{advertisements.vue => promotions.vue}      | 0
 packages/client/src/router.ts                                   | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename packages/client/src/pages/admin/{advertisements.vue => promotions.vue} (100%)

diff --git a/packages/client/src/pages/admin/advertisements.vue b/packages/client/src/pages/admin/promotions.vue
similarity index 100%
rename from packages/client/src/pages/admin/advertisements.vue
rename to packages/client/src/pages/admin/promotions.vue
diff --git a/packages/client/src/router.ts b/packages/client/src/router.ts
index b287f330c8..bf87efec0f 100644
--- a/packages/client/src/router.ts
+++ b/packages/client/src/router.ts
@@ -460,7 +460,7 @@ export const routes = [
 			{
 				path: "/ads",
 				name: "ads",
-				component: page(() => import("./pages/admin/advertisements.vue")),
+				component: page(() => import("./pages/admin/promotions.vue")),
 			},
 			{
 				path: "/database",