# 8.SET Custom
## GraphQL API Query
Get matching product clusters for product with identifier `8S-DEMO-Polohemd-1`.\
We request 4 clusters with 2 products each, i.e. a total of 8 products.
{% code expandable="true" %}
```graphql
query {
product(id: "8S-DEMO-Polohemd-1") {
customSets {
edges {
node {
id
title
description
images {
edges {
node {
url
}
}
}
products {
id
similarProducts(first: 2) {
edges {
node {
id
}
}
}
}
}
}
}
}
}
```
{% endcode %}
## GraphQL API response
The API returns the first 4 clusters with the first 2 products as requested.
{% code expandable="true" %}
```json
{
"data": {
"product": {
"customSets": {
"edges": [
{
"node": {
"id": "e3bcaf66-5037-4d7b-be4a-8c571a6fb299",
"title": "8SELECT Fashion for everyday",
"description": "This is a demo set. It is here to preview the 8.SET Custom widget.",
"images": {
"edges": [
{
"node": {
"url": "https://thumbnails.8scdn.io/9056af8c-e9b8-50db-bdf1-f794dc2e10d7.jpg"
}
}
]
},
"products": [
{
"id": "8S-DEMO-Jacket-1",
"similarProducts": {
"edges": [
{
"node": {
"id": "8S-DEMO-Jacket-2"
}
}
]
}
},
{
"id": "8S-DEMO-Polohemd-1",
"similarProducts": {
"edges": [
{
"node": {
"id": "8S-DEMO-Polohemd-10"
}
},
{
"node": {
"id": "8S-DEMO-Polohemd-9"
}
}
]
}
},
{
"id": "8S-DEMO-Gürtel-1",
"similarProducts": {
"edges": [
{
"node": {
"id": "8S-DEMO-Gürtel-3"
}
},
{
"node": {
"id": "8S-DEMO-Gürtel-4"
}
}
]
}
},
{
"id": "8S-DEMO-Hose-1",
"similarProducts": {
"edges": [
{
"node": {
"id": "8S-DEMO-Hose-2"
}
},
{
"node": {
"id": "8S-DEMO-Hose-3"
}
}
]
}
},
{
"id": "8S-DEMO-Schuhe-1",
"similarProducts": {
"edges": [
{
"node": {
"id": "8S-DEMO-Schuhe-2"
}
},
{
"node": {
"id": "8S-DEMO-Schuhe-3"
}
}
]
}
}
]
}
}
]
}
}
}
}
```
{% endcode %}
## View event
User scrolls to the displayed cross-selling items and items are about [50% inside the viewport](/api-tracking/events/view/how-to-evaluate-if-view-event-can-be-sent.md).
A view event with type `customSet` must contain a `customSet` property containing the identifier of the custom set. Here it is `e3bcaf66-5037-4d7b-be4a-8c571a6fb299`.
{% hint style="warning" %}
This differs from 8.SIMILAR and 8.SET - the `id` of the custom set from the API response is now required here.
{% endhint %}
Also a `user` context need to be attached.
```json
{
"type": "view",
"view": {
"type": "customSet",
"customSet": {
"id": "e3bcaf66-5037-4d7b-be4a-8c571a6fb299",
}
},
"context": [
{
"type": "user",
"user": {
"id": "c57a43f7-eefc-462b-b5a8-0ef421e90f67"
}
}
]
}
```
## Interact event
### click
User clicks on one of the shown cross-selling products. Let's say `8S-DEMO-Gürtel-1` and no specific size is selected.
An interact event with type `product` must contain a `product` property containing the `sku` of the respective product and can contain an `action`.
Also a `content` and `user` context need to be attached.\
The `content` context basically resembles the data from the view event.
```json
{
"type": "interact",
"interact": {
"action": "click",
"type": "product",
"product": {
"sku": "8S-DEMO-Gürtel-1"
}
},
"context": [
{
"content": {
"customSet": {
"id": "e3bcaf66-5037-4d7b-be4a-8c571a6fb299"
},
"type": "customSet"
},
"type": "content"
},
{
"type": "user",
"user": {
"id": "c57a43f7-eefc-462b-b5a8-0ef421e90f67"
}
}
]
}
```
### add to cart
User adds one of the shown cross-selling products to the cart. Let's say `8S-DEMO-Gürtel-3` in size 120 - e.g. the variant SKU is `8S-DEMO-Gürtel-3-120`.
An interact event with type `product` must contain a `product` property containing the `sku` of the respective product and **must contain** an `action`.
Also a `content` and `user` context need to be attached.\
The `content` context basically resembles the data from the view event.
```json
{
"type": "interact",
"interact": {
"action": "addToCart",
"type": "product",
"product": {
"sku": "8S-DEMO-Gürtel-3-120"
}
},
"context": [
{
"content": {
"customSet": {
"id": "e3bcaf66-5037-4d7b-be4a-8c571a6fb299"
},
"type": "customSet"
},
"type": "content"
},
{
"type": "user",
"user": {
"id": "c57a43f7-eefc-462b-b5a8-0ef421e90f67"
}
}
]
}
```
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.8select.io/api-tracking/examples/8.set-custom.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.