Directship Order Flow

Overview

This document walks you through the entire journey of a "Directship" order in ToolStation Website from add to cart to order placement and the technical details.

Channel Information:

• API identifies it as channel = 3
• Directship products are delivered directly from the supplier to the customer's shipping address
• It's an alternate channel for delivery so these types of products can not be added for click and collect
• That's why there is no collection CTA on the frontend for such items
• Determined by flag direct_ship in product schema
• Usually delivered in 3 days estimated

Common Examples: 88232, 88942, 49150, 98627, 96542

PLP & PDP

• Collection option and features are not available for directship products
• Add to trolley works just as delivery with a separate channel information

// ~/components/organisms/TsProductActions.vue
async function handleAddToTrolleyAction() {
  if (
    trolleyStore.previewed_product_selected_channel === TrolleyChannel.Directship
  ) {
    await trolleyStore.addToTrolleyForDirectship(
      trolleyStore.previewed_product.code, // product_code
      trolleyStore.previewed_product_selected_quantity, // quantity
    );
  }
}

// ~/stores/trolley.store.ts
async function addToTrolleyForDirectship(
  code: string,
  quantity: number,
) {
  await dispatchItemToTrolley(
    code,   
    quantity,
    TrolleyChannel.Directship, // 3
    DeliveryMethodCodes.Directship,
  );
}

Trolley

• Estimated time for delivery are shown as 3 days (can be updated from Builder as it's a translation string)
• Channel switch feature is not available for directship products
• Shipping cost is applied from ECOM if amount is below 40 euros

Checkout

The checkout page also resembles the delivery except few visual indicators highlighted below. The architecture is also identical where the user must have shipping and billing addresses to complete the order

Order Confirmation (Directship)