> ## 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.

# recommendations.list

> Produtos recomendados na página de produto (PDP).

# storefront.recommendations.list(options)

Exibe **"Você também pode gostar"** ou **"Combine com"** na PDP.

```http theme={"theme":{"light":"github-light","dark":"github-dark"}}
```

***

## Parâmetros

| Campo | Tipo | Default | Descrição |
| - | - | - | - |
| `product` | `ResourceRef` | **obrigatório** | Produto base (UUID ou slug) |
| `first` / `limit` | `number` | A API decide se o cliente omitir | O cliente repassa o valor. Não corta em 1–10. Se a resposta não traz `meta.limit`, o objeto local usa 4 |
| `intent` | `'related' \| 'complementary'` | `related` | Tipo de recomendação |
| `exclude` | `string[]` | — | UUIDs a excluir (ex.: carrinho) |
| `fields` | `'basic' \| 'full'` | `basic` | `full` inclui variantes |

### intent

| Valor | Uso | Algoritmo (backend) |
| - | - | - |
| `related` | "Você também pode gostar" | co\_purchase → category → description → featured |
| `complementary` | "Combine com" | cross-sell por categoria complementar |

***

## Retorno

```ts theme={"theme":{"light":"github-light","dark":"github-dark"}}
{
  intent: 'related' | 'complementary';
  productId: string;
  products: Connection<ProductSummary>;
  meta: {
    limit: number;
    count: number;      // se 0, não renderize a section
    strategies: string[];
  };
}
```

***

## Exemplo completo

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
import { defineSection, defineSectionData, SECTION_DATA_KEYS } from '@corvex/theme-sdk';

export const schema = defineSection({
  name: 'Você também pode gostar',
  enabledOn: ['product'],
  data: [SECTION_DATA_KEYS.recommendations, SECTION_DATA_KEYS.product],
  settings: [
    { type: 'range', id: 'limit', label: 'Quantidade', min: 2, max: 10, default: 4 },
    {
      type: 'select',
      id: 'intent',
      label: 'Tipo',
      default: 'related',
      options: [
        { value: 'related', label: 'Relacionados' },
        { value: 'complementary', label: 'Complementares' },
      ],
    },
  ],
});

export const data = defineSectionData(async ({ storefront, page, settings }) => ({
  recommendations: await storefront.recommendations.list({
    product: page.product,
    first: settings.limit ?? 4,
    intent: settings.intent ?? 'related',
  }),
}));

export default function ProductRecommendations({ data }) {
  if (!data.recommendations.meta.count) return null;

  return (
    <section>
      <h2>Você também pode gostar</h2>
      {data.recommendations.products.nodes.map((product) => (
        <ProductCard key={product.id} product={product} />
      ))}
    </section>
  );
}
```

***

## Carregamento assíncrono

Na página de produto, recomendações costumam carregar **depois** do conteúdo principal. Na Corvex:

1. Declare `data: ['recommendations']` no schema
2. A runtime executa o loader em paralelo com outros `defineSectionData`
3. Section só monta quando `meta.count > 0`

***

## Hook React

```jsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
const { data, loading } = useCorvexData({
  recommendations: {
    product: currentProductId,
    first: 4,
    intent: 'related',
  },
});
```

***

## Declaração schema.data

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
data: ['recommendations', 'product']
```

Veja [Mapa de dados](https://docs-loja.usecorvex.com.br/data/scope-data-map.md).


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