Return Options Step
The step in which the user selects return options for their selected products and replacement options if applicable.
Example Response (Basic)
{
"type": "return_options",
"nextType": "important_information",
"payload": {
"confirmButtonText": "Confirm",
"additionalStoreCredit": {
"amount": 15.00,
"currencyCode": "GBP"
},
"products": [
{
"id": "O111111",
"returnOptions": [
{
"text": "Replacement",
"type": "replacement",
"description": "Return your item and get a replacement within 3-5 business days."
},
{
"text": "Standard refund",
"type": "refund",
"description": "Timing depends on your original payment."
},
{
"text": "Store credit",
"type": "store_credit",
"description": "Get a gift card via email once your return has been approved."
}
],
},
{
"id": "O444444",
"returnOptions": [
{
"text": "Replacement",
"type": "replacement",
"description": "Return your item and get a replacement within 3-5 business days."
},
{
"text": "Standard refund",
"type": "refund",
"description": "Timing depends on your original payment."
},
{
"text": "Store credit",
"type": "store_credit",
"description": "Get a gift card via email once your return has been approved."
}
],
}
]
}
}
Properties
* indicates required field
Field | Description |
---|---|
type * | The current step_type . |
nextType * | The next step_type in the journey. |
payload * | Contains the details of the return options. |
payload.confirmButtonText * | The text displayed in the confirmation button. |
payload.additionalStoreCredit | Any additional store credit the user will receive. |
payload.additionalStoreCredit.amount | The amount of additional store credit the user will receive. |
payload.additionalStoreCredit.currencyCode | (GBP, USD, EUR) |
payload.products * | See below |
Products
Field | Description |
---|---|
payload.products[].id * | The unique identifier for the product. |
payload.products[].returnOptions * | See below |
payload.products[].replacementSelector * | See below |
Return Options
Field | Description |
---|---|
returnOptions * | A list of return options available for the product. |
returnOptions[].text * | The text description of the return option. |
returnOptions[].type * | The type of the return option (replacement |
returnOptions[].description * | The description of the return option. |
returnOptions[].unavailableReason | The reason why the return option is unavailable, the option cannot be selected if present. |
Replacement Selector
To enable the replacement selector, add one the the following example objects per relevant product.
The variants should include the current product variant which is pre selected in the popup.
To have pre selected sizing options, the product.size
object defined in the product_selection
step should include values for all replacement options e.g. size.cup
, size.band
, size.width
.
Simple Sizing
{
"replacementSelector": {
"isEnabled": true,
"variants": [
{
"id": "0111111",
"image": "https://someimage.png",
"colour": "Alloy | Chambray",
"sizes": [
{ "value": "7" },
{ "value": "8", "disabled": true }
]
}
]
}
}
Field | Description |
---|---|
replacementSelector | Contains the details of the replacement options |
replacementSelector.isEnabled * | Whether the replacement selector is enabled |
replacementSelector.variants * | List of available variants |
replacementSelector.variants[].colour * | The variant colour |
replacementSelector.variants[].id * | The variant id |
replacementSelector.variants[].isLowStock | Whether the variant has low stock |
replacementSelector.variants[].sizes * | Available sizes for this variant |
replacementSelector.variants[].sizes[].value * | Size value |
replacementSelector.variants[].sizes[].disabled | Whether the size is unavailable |
Tabbed Sizing
Displays sizes in tabs
{
"replacementSelector": {
"isEnabled": true,
"variants": [
{
"id": "0111111",
"image": "https://someimage.png",
"colour": "Alloy | Chambray",
"isLowStock": true,
"tabContent": {
"name": "width",
"label": "Width",
"items": [
{
"name": "regular",
"label": "Regular",
"sizes": [
{ "value": "7", "disabled": true },
{ "value": "8" }
]
},
{
"name": "wide",
"label": "Wide",
"sizes": [
{ "value": "7" },
{ "value": "8", "disabled": true },
]
}
]
}
}
]
}
}
Field | Description |
---|---|
replacementSelector | Contains the details of the replacement options |
replacementSelector.isEnabled * | Whether the replacement selector is enabled |
replacementSelector.variants[].colour * | The variant colour |
replacementSelector.variants[].id * | The variant id |
replacementSelector.variants[].isLowStock | Whether the variant has low stock |
replacementSelector.variants[].tabContent * | Tab configuration for sizes |
replacementSelector.variants[].tabContent.name * | Identifier for the tab |
replacementSelector.variants[].tabContent.label * | Display label for the tab |
replacementSelector.variants[].tabContent.items * | List of tab items |
replacementSelector.variants[].tabContent.items[].name * | Tab item name |
replacementSelector.variants[].tabContent.items[].label * | Tab item label |
replacementSelector.variants[].tabContent.items[].sizes * | Sizes available in this tab |
Size Components
For when a size compromises of multiple components, e.g a bra which has a cup
and band
size.
{
"replacementSelector": {
"isEnabled": true,
"variants": [
{
"image": "https://someimage.png",
"colour": "Sand",
"hexCodes": [
"#DAB297"
],
"sizeComponents": [
{
"name": "band",
"label": "Band",
"options": [
{ "value": "28", "disabled": true },
{ "value": "30" }
]
},
{
"name": "cup",
"label": "Cup",
"options": [
{ "value": "A", "disabled": true },
{ "value": "B" }
]
}
]
}
]
}
}
Field | Description |
---|---|
replacementSelector | Contains replacement options for each variant of the product |
replacementSelector.isEnabled * | Whether the replacement selector is enabled |
replacementSelector.variants[].hexCodes | Color hex codes for swatch display |
replacementSelector.variants[] | A list of variants |
replacementSelector.variants[].colour * | The variant colour |
replacementSelector.variants[].id * | The variant id |
replacementSelector.variants[].isLowStock | Whether the variant has low stock |
replacementSelector.variants[].sizeComponents * | List of size component groups |
replacementSelector.variants[].sizeComponents[].name * | Component identifier |
replacementSelector.variants[].sizeComponents[].label * | Component display label |
replacementSelector.variants[].sizeComponents[].options * | Available options for component |
replacementSelector.variants[].sizeComponents[].options[].value * | Option value |
replacementSelector.variants[].sizeComponents[].options[].disabled | Whether option is unavailable |
selected_products example
[
{
"id": "O444444",
"name": "CrossFlex Activity Bra",
"image": "some-image-url.jpg",
"colour": "Black",
"quantity": 5,
"productType": "bra",
"size": {
"displayName": "10C",
"sizeSystem": "UK"
},
"price": {
"amount": 149.99,
"currencyCode": "GBP"
},
"returnOption": { // the selected return option
"text": "Replacement",
"type": "replacement"
},
"replacementDetails": { // the selected variant including replacement options
"id": "0222222",
"colour": "Dreamy Peach",
"size": {
"displayName": "12D",
"band": "12",
"cup": "D"
}
},
"returnReason": {
"id": "arrived-damaged",
"text": "Item arrived damaged"
},
"attachments": ["attachment1.jpg", "attachment2.jpg"],
}
]
Updated 3 days ago