Paginación y ordenación

Paginación y ordenación

Recorre y ordena listas grandes de resultados.

Paginación por cursor

Los campos de lista devuelven conexiones estilo Relay. Avanza con first + after, o retrocede con last + before, usando los cursores que devuelve pageInfo.

  • first / afterDevuelve los primeros N elementos después de un cursor (avance).
  • last / beforeDevuelve los últimos N elementos antes de un cursor (retroceso).
paginatedIssues.graphql
query ListIssues($orgId: ID!, $first: Int!, $after: Cursor) {
  organization(id: $orgId) {
    issues(
      first: $first
      after: $after
      orderBy: { field: CREATED_AT, direction: DESC }
    ) {
      totalCount
      edges {
        cursor
        node {
          id
          friendlyId
          title
        }
      }
      pageInfo {
        hasNextPage
        endCursor
      }
    }
  }
}

Forma de la conexión

Cada conexión expone una lista de edges, un objeto pageInfo y un totalCount.

  • edges[].nodeEl elemento en sí — pide los campos que necesites dentro de node.
  • edges[].cursorUn cursor opaco que apunta a este elemento, para paginar desde aquí.
  • pageInfo.hasNextPage / hasPreviousPageSi existen más elementos en esa dirección.
  • pageInfo.startCursor / endCursorPasa endCursor como el siguiente after para obtener la página siguiente.
  • totalCountNúmero total de elementos en todas las páginas.
RESPUESTA
{
  "totalCount": 128,
  "edges": [
    {
      "cursor": "Y3Vyc29yOjE5",
      "node": { "id": "rprdbtyvc51ys7g7xq9xwra8cm", "friendlyId": 20, "title": "..." }
    }
  ],
  "pageInfo": {
    "hasNextPage": true,
    "endCursor": "Y3Vyc29yOjE5"
  }
}

Ordenación

Pasa un objeto orderBy con un field y una direction. Los campos disponibles dependen de la conexión.

  • orderBy.fieldEl campo por el que ordenar. Por ejemplo, CREATED_AT.
  • orderBy.directionASC para ascendente o DESC para descendente.
orderBy.graphql
issues(orderBy: { field: CREATED_AT, direction: DESC })