Order Tracker

The Order Tracker component displays shipping and tracking information for customer orders within the chat interface.

An inline card is shown in the message list summarising the shipment number, status, expected arrival date, product thumbnails and a status bar. Tapping the card opens a bottom sheet containing the full tracking summary, detailed tracking history and the ordered items.

Example

{
  "type": "orderTracker",
  "payload": {
    "status": "Delivered",
    "carrier": "Royal Mail",
    "shippingMethod": "Standard",
    "trackingNumber": "AUP12345-45",
    "trackingLink": "https://example.com?x=AUP12345-45",
    "lastUpdatedDate": "2025-03-10T00:00:00",
    "expectedDeliveryDate": "2025-03-28T00:00:00",
    "shippingMethodDaysRange": "15-20",
    "shipmentNumber": 1,
    "totalShipments": 2,
    "products": [
      {
        "name": "Men's Air Max 90",
        "size": "UK 9",
        "image": "https://example.com/product1.jpg"
      },
      {
        "name": "Performance Socks",
        "size": "M",
        "image": "https://example.com/product2.jpg"
      }
    ],
    "proofOfDelivery": {
      "image": "https://example.com/pod.jpg"
    },
    "trackingHistoryItems": [
      {
        "date": "2025-03-11T00:00:00",
        "status": "In Transit",
        "description": "More details about this stage"
      }
    ]
  }
}

Properties

payload

• status: Current order status (e.g., "Delivered", "In Transit", "Out for Delivery").
• carrier: Name of the shipping carrier (e.g., "Royal Mail", "DHL").
• shippingMethod: The delivery service type (e.g., "Standard", "Express").
• lastUpdatedDate: ISO date string of when the tracking was last updated.
• shippingMethodDaysRange (optional): Expected delivery timeframe (e.g., "15-20").
• expectedDeliveryDate (optional): ISO date string of the expected delivery date.
• trackingNumber (optional): The unique tracking reference for the shipment.
• trackingLink (optional): When provided, the tracking number will link to the tracking info on the carriers website.
• proofOfDelivery (optional): Object containing delivery confirmation:
  • image: URL of the proof of delivery image.
• products: Array of products in the shipment. Each item supports:
  • name: Product name.
  • size (optional): Product size label.
  • image (optional): Product image URL.
• totalShipments (optional): Total number of separate shipments in the order.
• shipmentNumber (optional): Current shipment number being displayed.
• trackingHistoryItems (optional): Array of tracking events:
  • date: ISO date string of when the event occurred.
  • status: Status description of the tracking event.
  • description: (optional) Detailed description of the tracking event.