From 8618b2084d8e414ee107c7962011da1041a4f6af Mon Sep 17 00:00:00 2001
From: Natty <natty.sh.git@gmail.com>
Date: Fri, 5 Apr 2024 23:22:22 +0200
Subject: [PATCH] Notification and pagination bugfixes

---
 .../client/src/components/MagNotifications.vue   |  1 +
 .../client/src/components/MagPagination.vue      |  9 +++++----
 .../client/src/components/MkPagination.vue       | 16 +++++++++++-----
 3 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/fe_calckey/frontend/client/src/components/MagNotifications.vue b/fe_calckey/frontend/client/src/components/MagNotifications.vue
index b9cc935..a3d608c 100644
--- a/fe_calckey/frontend/client/src/components/MagNotifications.vue
+++ b/fe_calckey/frontend/client/src/components/MagNotifications.vue
@@ -49,6 +49,7 @@
                 </template>
                 <XNotificationGroup
                     v-else-if="notificationGroup.type === 'group'"
+                    :key="'group' + notificationGroup.id"
                     :notificationGroup="notificationGroup"
                     :with-time="true"
                     :full="true"
diff --git a/fe_calckey/frontend/client/src/components/MagPagination.vue b/fe_calckey/frontend/client/src/components/MagPagination.vue
index 46ed518..bb13a3d 100644
--- a/fe_calckey/frontend/client/src/components/MagPagination.vue
+++ b/fe_calckey/frontend/client/src/components/MagPagination.vue
@@ -297,11 +297,12 @@ const prepend = (item: PageItem): void => {
         } else {
             if (!queue.value.length) {
                 onScrollTop(rootEl.value, () => {
-                    items.value = [
-                        ...queue.value.reverse(),
-                        ...items.value,
-                    ].slice(0, props.displayLimit);
+                    const queueRemoved = [...queue.value].reverse();
                     queue.value = [];
+                    items.value = [...queueRemoved, ...items.value].slice(
+                        0,
+                        props.displayLimit
+                    );
                 });
             }
 
diff --git a/fe_calckey/frontend/client/src/components/MkPagination.vue b/fe_calckey/frontend/client/src/components/MkPagination.vue
index 812ee9c..fb71f5d 100644
--- a/fe_calckey/frontend/client/src/components/MkPagination.vue
+++ b/fe_calckey/frontend/client/src/components/MkPagination.vue
@@ -300,13 +300,19 @@ const prepend = (item: Item): void => {
             // Prepend the item
             items.value = [item, ...items.value].slice(0, props.displayLimit);
         } else {
-            if (!queue.value.length && rootEl.value) {
+            if (!rootEl.value) {
+                items.value.unshift(item);
+                return;
+            }
+
+            if (!queue.value.length) {
                 onScrollTop(rootEl.value, () => {
-                    items.value = [
-                        ...queue.value.reverse(),
-                        ...items.value,
-                    ].slice(0, props.displayLimit);
+                    const queueRemoved = [...queue.value].reverse();
                     queue.value = [];
+                    items.value = [...queueRemoved, ...items.value].slice(
+                        0,
+                        props.displayLimit
+                    );
                 });
             }