From 300fd8b729956eec2ff9cc624119fb5effd8e10d Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Mon, 6 Jul 2020 17:35:03 +0200
Subject: [PATCH] Fix MyEvents pagination

And reverse order for past events so that it's coherent

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 js/src/views/Event/MyEvents.vue | 41 +++++++++++++++++++++++++--------
 1 file changed, 32 insertions(+), 9 deletions(-)

diff --git a/js/src/views/Event/MyEvents.vue b/js/src/views/Event/MyEvents.vue
index 3291f8b88..517d82162 100644
--- a/js/src/views/Event/MyEvents.vue
+++ b/js/src/views/Event/MyEvents.vue
@@ -169,13 +169,24 @@ export default class MyEvents extends Vue {
 
   drafts: IEvent[] = [];
 
-  static monthlyParticipations(participations: IParticipant[]): Map<string, Participant[]> {
+  static monthlyParticipations(
+    participations: IParticipant[],
+    revertSort: boolean = false
+  ): Map<string, Participant[]> {
     const res = participations.filter(
       ({ event, role }) => event.beginsOn != null && role !== ParticipantRole.REJECTED
     );
-    res.sort(
-      (a: IParticipant, b: IParticipant) => a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
-    );
+    if (revertSort) {
+      res.sort(
+        (a: IParticipant, b: IParticipant) =>
+          b.event.beginsOn.getTime() - a.event.beginsOn.getTime()
+      );
+    } else {
+      res.sort(
+        (a: IParticipant, b: IParticipant) =>
+          a.event.beginsOn.getTime() - b.event.beginsOn.getTime()
+      );
+    }
     return res.reduce((acc: Map<string, IParticipant[]>, participation: IParticipant) => {
       const month = new Date(participation.event.beginsOn).toLocaleDateString(undefined, {
         year: "numeric",
@@ -193,7 +204,7 @@ export default class MyEvents extends Vue {
   }
 
   get monthlyPastParticipations(): Map<string, Participant[]> {
-    return MyEvents.monthlyParticipations(this.pastParticipations);
+    return MyEvents.monthlyParticipations(this.pastParticipations, true);
   }
 
   loadMoreFutureParticipations() {
@@ -206,13 +217,19 @@ export default class MyEvents extends Vue {
       },
       // Transform the previous result with new data
       updateQuery: (previousResult, { fetchMoreResult }) => {
+        const oldParticipations = previousResult.loggedUser.participations;
         const newParticipations = fetchMoreResult.loggedUser.participations;
-        this.hasMoreFutureParticipations = newParticipations.length === this.limit;
+        this.hasMoreFutureParticipations =
+          newParticipations.total === oldParticipations.length + newParticipations.length;
 
         return {
           loggedUser: {
             __typename: previousResult.loggedUser.__typename,
-            participations: [...previousResult.loggedUser.participations, ...newParticipations],
+            participations: {
+              __typename: newParticipations.__typename,
+              total: newParticipations.total,
+              elements: [...oldParticipations.elements, ...newParticipations.elements],
+            },
           },
         };
       },
@@ -229,13 +246,19 @@ export default class MyEvents extends Vue {
       },
       // Transform the previous result with new data
       updateQuery: (previousResult, { fetchMoreResult }) => {
+        const oldParticipations = previousResult.loggedUser.participations;
         const newParticipations = fetchMoreResult.loggedUser.participations;
-        this.hasMorePastParticipations = newParticipations.length === this.limit;
+        this.hasMorePastParticipations =
+          newParticipations.total === oldParticipations.length + newParticipations.length;
 
         return {
           loggedUser: {
             __typename: previousResult.loggedUser.__typename,
-            participations: [...previousResult.loggedUser.participations, ...newParticipations],
+            participations: {
+              __typename: newParticipations.__typename,
+              total: newParticipations.total,
+              elements: [...oldParticipations.elements, ...newParticipations.elements],
+            },
           },
         };
       },