> ## Documentation Index
> Fetch the complete documentation index at: https://docs-loja.usecorvex.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Paginação

> Connection<T> e pageInfo na Storefront Data API.

Listas **nunca** retornam array simples na API pública. Use `Connection<T>`:

```ts theme={"theme":{"light":"github-light","dark":"github-dark"}}
interface Connection<T> {
  nodes: T[];
  pageInfo: {
    hasNextPage: boolean;
    hasPreviousPage: boolean;
    startCursor: string | null;
    endCursor: string | null;
  };
}
```

## Exemplo

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
let page = 1;
let connection = await storefront.products.list({ first: 20, page });

while (connection.pageInfo.hasNextPage) {
  page += 1;
  connection = await storefront.products.list({ first: 20, page });
}
```

`page` é 1-based. `after` existe, mas o SDK trata o valor como deslocamento (`floor(numero / limit) + 1`). `pageInfo.endCursor` é o índice do último item da página atual (`page * limit - 1`). Passar esse cursor em `after` cai na mesma página. Avance com `page`.

## Mapeamento backend

O backend usa `page` + `limit` + objeto `pagination`:

```json theme={"theme":{"light":"github-light","dark":"github-dark"}}
{
  "pagination": {
    "page": 1,
    "limit": 20,
    "total": 150,
    "totalPages": 8
  }
}
```

O SDK converte para `pageInfo.hasNextPage` etc.

## Hook legado

`useCorvexData('products', { limit: 8 })` devolve `{ data, loading, error }`. `data` é `Connection` (`data.nodes`), não um array solto.

Para paginação completa, use:

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
const storefront = useStorefront();
const connection = await storefront.products.list({ first: 20, after: cursor });
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.