How to add a product from category to cart
Let's add a product from a category to a cart.
We will have to fetch all categories as we don't know in what category the product lies, from there we can extract the product's article number and add it to the cart.
categories:
categories-querycategories-output
query GetCategoriesProductsArticleNumber {
categories {
id
name
products {
result {
name
articleNumber
}
}
}
}{
"data": {
"categories": [
{
"id": 182,
"name": "New arrivals",
"products": {
"result": [
{
"name": "Watch Bag Pack",
"articleNumber": "543-234-131-pack2"
},
{
"name": "Nice Chair",
"articleNumber": "892045234"
},
{
"name": "Dining Table",
"articleNumber": "9341387"
},
{
"name": "Coffe Table",
"articleNumber": "677739-12"
},
{
"name": "Dining package",
"articleNumber": "123-paket-preselect"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-25"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-24"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-23"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-22"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-21"
},
{
"name": "Watch Classic",
"articleNumber": "441922-Classic-20"
},
{
"name": "Living room furniture pack",
"articleNumber": "543-234-131-pack"
}
]
}
}
]
}
}In the categories-output we will get an overview of all categories and all the products in them for this shop. Let's add the Watch Classic (441922-Classic-25)-product from the list to cart in the addToCart-mutation.
addToCart:
The addToCart-mutation adds a product to the cart, where you can determine the quantity.
You can also add a comment about the product. If a cartId is presented it will reply with the affected cart, otherwise a new one will be created.
addToCart-inputaddToCart-mutationaddtoCart-output
{
"input": {
"articleNumber": "441922-Classic-25",
"quantity": 1,
"comments": [ {
"name": "Engrave",
"value": "StoreApi"
}]
}
}mutation addToCart($input: AddToCartInput!) {
addToCart(input: $input) {
cart {
id
items {
articleNumber
quantity
customerComments {
name
value
}
}
}
}
}{
"data": {
"addToCart": {
"cart": {
"id": "e0b33e81-0697-4ce0-9e3a-5363503166c3",
"items": [
{
"articleNumber": "441922-Classic-25",
"quantity": 1,
"customerComments": [
{
"name": "Engrave",
"value": "StoreApi"
}
]
}
]
}
}
}
}We got a cart graph back. We can extend this data simply by asking for more fields from the cart graph. So let's extend this query a bit by getting the same cart.
You could do the same thing in addToCart-mutation also.
cart:
cart-inputcart-querycart-output
{
"cartId": "cab4d593-e183-4725-8f22-c3eec40a8bc7"
}query CartQuery($cartId: String) {
cart(id: $cartId) {
...Cart
__typename
}
}
fragment Cart on Cart {
id
externalCheckoutUrl
totalQuantity
productTotal {
...Price
__typename
}
productPreviousTotal {
...Price
__typename
}
discountTotal {
...Price
__typename
}
aggregatedDiscounts {
name
value {
...Price
__typename
}
description
campaign {
name
__typename
}
__typename
}
items {
id
customerComments {
name
value
__typename
}
configurations {
name
option {
id
name
__typename
}
__typename
}
quantity
articleNumber
subHeading
variant {
values
articleNumber
images {
modifiedDate
alt
title
url
__typename
}
...ProductVariantPrice
__typename
}
discounts {
name
description
value {
...Price
__typename
}
__typename
}
discount {
...Price
__typename
}
total {
...Price
__typename
}
previousTotal {
...Price
__typename
}
previousUnitPrice {
...Price
__typename
}
product {
...CommentsFragment
id
name
articleNumber
...ProductPrice
primaryRoute {
id
path
breadcrumbs
__typename
}
customFields {
key
type
title
... on CustomStringField {
stringValue: value
__typename
}
__typename
}
images {
modifiedDate
alt
title
url
__typename
}
__typename
}
variantOptionNames
__typename
}
}
fragment Price on Price {
incVat
exVat
vat
__typename
}
fragment ProductPrice on Product {
price {
...Price
__typename
}
previousPrice {
...Price
__typename
}
__typename
}
fragment ProductVariantPrice on ProductVariant {
price {
...Price
__typename
}
previousPrice {
...Price
__typename
}
__typename
}
fragment CommentsFragment on Product {
customerComments {
name
required
__typename
}
__typename
}{
"data": {
"cart": {
"id": "cab4d593-e183-4725-8f22-c3eec40a8bc7",
"externalCheckoutUrl": "https://www.demostore.se/se/externalcheckout.aspx?cartid=cab4d593-e183-4725-8f22-c3eec40a8bc7¤cy=SEK&culture=en-GB&country=SE&ismobile=true",
"totalQuantity": 1,
"productTotal": {
"incVat": 18703,
"exVat": 14963,
"vat": 3741,
"__typename": "Price"
},
"productPreviousTotal": {
"incVat": 18703,
"exVat": 14963,
"vat": 3741,
"__typename": "Price"
},
"discountTotal": {
"incVat": 0,
"exVat": 0,
"vat": 0,
"__typename": "Price"
},
"aggregatedDiscounts": [],
"items": [
{
"id": "130535",
"customerComments": [
{
"name": "Engrave",
"value": "StoreAPI",
"__typename": "CartItemComment"
}
],
"configurations": [],
"quantity": 1,
"articleNumber": "441922-Classic-25",
"subHeading": "TimesUp",
"variant": null,
"discounts": [],
"discount": {
"incVat": 0,
"exVat": 0,
"vat": 0,
"__typename": "Price"
},
"total": {
"incVat": 18703,
"exVat": 14963,
"vat": 3741,
"__typename": "Price"
},
"previousTotal": {
"incVat": 18703,
"exVat": 14963,
"vat": 3741,
"__typename": "Price"
},
"previousUnitPrice": {
"incVat": 18703,
"exVat": 14963,
"vat": 3741,
"__typename": "Price"
},
"product": {
"customerComments": [],
"__typename": "Product",
"id": 560,
"name": "Watch Classic",
"articleNumber": "441922-Classic-25",
"price": {
"incVat": 18703,
"exVat": 14963,
"vat": 3740,
"__typename": "Price"
},
"previousPrice": {
"incVat": 20875,
"exVat": 16700,
"vat": 4175,
"__typename": "Price"
},
"primaryRoute": {
"id": "accessories/watches/441922-classic-19-560",
"path": "/accessories/watches/441922-classic-19-560",
"breadcrumbs": [
"Accessories",
"Watches",
"Watch Classic"
],
"__typename": "Route"
},
"customFields": [
{
"key": "depth",
"type": "STRING",
"title": "Depth",
"stringValue": "15mm",
"__typename": "CustomStringField"
},
{
"key": "width",
"type": "STRING",
"title": "Width",
"stringValue": "2,5cm",
"__typename": "CustomStringField"
},
{
"key": "washable-cover",
"type": "BOOL",
"title": "Washable cover",
"__typename": "CustomBoolField"
}
],
"images": [
{
"modifiedDate": "1605707501",
"alt": "441922",
"title": "Watch Classic",
"url": "https://www.demostore.se/pub_images/original/441922.jpg",
"__typename": "ProductImage"
}
]
},
"variantOptionNames": [],
"__typename": "CartItem"
}
],
"__typename": "Cart"
}
}
}