Merge pull request #4153 from thematters/fix/pagination-order

fix(pagination): fix backward pagination order

Author: gary02

src/common/utils/connections.ts

@@ -235,7 +235,7 @@ export const connectionFromQuery = async <T extends { id: string }>({
           .from(baseTableName)
           .orderBy(
             orderBy.column as string,
-            orderBy.order === 'asc' ? 'desc' : 'asc'
+            orderBy.order === 'asc' ? 'desc' : 'asc' // for fetching records right after cursor by `limit`, will reverse back later
           )
           .where(
             orderBy.column as string,
@@ -245,10 +245,12 @@ export const connectionFromQuery = async <T extends { id: string }>({
           .limit(last)
       : []
 
-  const beforeEdges = beforeNodes.map((node) => ({
-    cursor: encodeCursor(node[cursorColumn] as string),
-    node,
-  }))
+  const beforeEdges = beforeNodes
+    .map((node) => ({
+      cursor: encodeCursor(node[cursorColumn] as string),
+      node,
+    }))
+    .reverse()
 
   // fetch after edges
   let afterWhereOperator = orderBy.order === 'asc' ? '>' : '<'

src/types/__test__/1/collection.test.ts

@@ -823,7 +823,6 @@ describe('get collection articles', () => {
         collectionInput: { id: collectionGlobalId },
         articleInput: {
           last: 1,
-          // 6
           before: data2?.node.articles.pageInfo.endCursor,
           reversed: false,
         },
@@ -854,41 +853,61 @@ describe('get collection articles', () => {
     expect(data4?.node.articles.pageInfo.hasNextPage).toBe(true)
     expect(data4?.node.articles.edges[0].node.id).toBe(articleGlobalIds[0])
 
-    // reversed by default
+    // backward pagination order is correct
     const { errors: errors5, data: data5 } = await server.executeOperation({
       query: GET_COLLECTION_ARTICLES,
       variables: {
         collectionInput: { id: collectionGlobalId },
-        articleInput: { first: 2 },
+        articleInput: {
+          last: 2,
+          before: data2?.node.articles.pageInfo.endCursor,
+          reversed: false,
+        },
       },
     })
     expect(errors5).toBeUndefined()
     expect(data5?.node.articles.totalCount).toBe(3)
     expect(data5?.node.articles.edges.length).toBe(2)
     expect(data5?.node.articles.pageInfo.hasPreviousPage).toBe(false)
     expect(data5?.node.articles.pageInfo.hasNextPage).toBe(true)
-    expect(data5?.node.articles.edges[0].node.id).toBe(articleGlobalIds[2])
+    expect(data5?.node.articles.edges[0].node.id).toBe(articleGlobalIds[0])
     expect(data5?.node.articles.edges[1].node.id).toBe(articleGlobalIds[1])
 
-    // includeAfter
+    // reversed by default
     const { errors: errors6, data: data6 } = await server.executeOperation({
+      query: GET_COLLECTION_ARTICLES,
+      variables: {
+        collectionInput: { id: collectionGlobalId },
+        articleInput: { first: 2 },
+      },
+    })
+    expect(errors6).toBeUndefined()
+    expect(data6?.node.articles.totalCount).toBe(3)
+    expect(data6?.node.articles.edges.length).toBe(2)
+    expect(data6?.node.articles.pageInfo.hasPreviousPage).toBe(false)
+    expect(data6?.node.articles.pageInfo.hasNextPage).toBe(true)
+    expect(data6?.node.articles.edges[0].node.id).toBe(articleGlobalIds[2])
+    expect(data6?.node.articles.edges[1].node.id).toBe(articleGlobalIds[1])
+
+    // includeAfter
+    const { errors: errors7, data: data7 } = await server.executeOperation({
       query: GET_COLLECTION_ARTICLES,
       variables: {
         collectionInput: { id: collectionGlobalId },
         articleInput: {
           first: 2,
-          after: data5?.node.articles.pageInfo.endCursor,
+          after: data6?.node.articles.pageInfo.endCursor,
           includeAfter: true,
         },
       },
     })
-    expect(errors6).toBeUndefined()
-    expect(data6?.node.articles.totalCount).toBe(3)
-    expect(data6?.node.articles.edges.length).toBe(2)
-    expect(data6?.node.articles.pageInfo.hasPreviousPage).toBe(true)
-    expect(data6?.node.articles.pageInfo.hasNextPage).toBe(false)
-    expect(data6?.node.articles.edges[0].node.id).toBe(articleGlobalIds[1])
-    expect(data6?.node.articles.edges[1].node.id).toBe(articleGlobalIds[0])
+    expect(errors7).toBeUndefined()
+    expect(data7?.node.articles.totalCount).toBe(3)
+    expect(data7?.node.articles.edges.length).toBe(2)
+    expect(data7?.node.articles.pageInfo.hasPreviousPage).toBe(true)
+    expect(data7?.node.articles.pageInfo.hasNextPage).toBe(false)
+    expect(data7?.node.articles.edges[0].node.id).toBe(articleGlobalIds[1])
+    expect(data7?.node.articles.edges[1].node.id).toBe(articleGlobalIds[0])
 
     // return total count if first is 0
     const { errors: errors0, data: data0 } = await server.executeOperation({