Pagination

GraphQL uses a cursor approach to pagination and this information can be included in the response to requests along side the edges. The response includes a bool for hasNextPage if there is more data to return and and endCursor value which can be passed into the query for the next page.

{
  research(
    first: 2
  ) {
    edges {
      node {
        id
        title
      }
    }
    pageInfo {
      hasNextPage
      endCursor
    }
  }
}

Returns:

{
  "data": {
    "research": {
      "edges": [
        {
          "node": {
            "id": "68b993fb85d14160d40303fd",
            "title": "Follow up call"
          }
        },
        {
          "node": {
            "id": "68b993fb85d14160d4030407",
            "title": "Info Request - Klein-Kiehn"
          }
        }
      ],
      "pageInfo": {
        "hasNextPage": true,
        "endCursor": "WyI2OGI5OTNmYjg1ZDE0MTYwZDQwMzA0MDciXQ"
      }
    }
  }
}

The endCursor value can then be used as an input for the after argument when requesting subsequent pages:

{
  research(
    first: 2
    after: "WyI2OGI5OTNmYjg1ZDE0MTYwZDQwMzA0MDciXQ"
  ) {
    edges {
      node {
        id
        title
      }
    }
    pageInfo {
      hasNextPage
      endCursor
    }
  }
}

This approach can be used to iterate through an entire set of results; application code can work as follows:

1. Execute an initial query with first set to the number of items per page, and after set to null.
2. Retrieve the value of hasNextPage from the pageInfo object on the connection. If it's false, there are no more results. If it's true:
3. Repeat the query from step 1, but this time pass the endCursor value as the after argument. Return to step 2 and repeat until there are no results left.