Shipping Options

Queries listed here are used to send requests to the Store Shipping Option API Routes.

A shipping option is used to define the available shipping methods during checkout or when creating a return.

Related Guide: Shipping Option architecture.

Queries

useShippingOptions

This hook retrieves a list of shipping options. The shipping options can be filtered using the query parameter.

Example

import React from "react"
import { useShippingOptions } from "medusa-react"

const ShippingOptions = () => {
  const { 
    shipping_options, 
    isLoading, 
  } = useShippingOptions()

  return (
    <div>
      {isLoading && <span>Loading...</span>}
      {shipping_options?.length && 
        shipping_options?.length > 0 && (
        <ul>
          {shipping_options?.map((shipping_option) => (
            <li key={shipping_option.id}>
              {shipping_option.id}
            </li>
          ))}
        </ul>
      )}
    </div>
  )
}

export default ShippingOptions

Hook Parameters

queryStoreGetShippingOptionsParams

The filters to apply on the shipping options.

Query Returned Data

shipping_optionsPricedShippingOption[]Required

An array of shipping options details.

useCartShippingOptions

This hook retrieves a list of shipping options available for a cart.

Example

import React from "react"
import { useCartShippingOptions } from "medusa-react"

type Props = {
  cartId: string
}

const ShippingOptions = ({ cartId }: Props) => {
  const { shipping_options, isLoading } =
    useCartShippingOptions(cartId)

  return (
    <div>
      {isLoading && <span>Loading...</span>}
      {shipping_options && !shipping_options.length && (
        <span>No shipping options</span>
      )}
      {shipping_options && (
        <ul>
          {shipping_options.map(
            (shipping_option) => (
              <li key={shipping_option.id}>
                {shipping_option.name}
              </li>
            )
          )}
        </ul>
      )}
    </div>
  )
}

export default ShippingOptions

Hook Parameters

cartIdstringRequired

The cart's ID.

Query Returned Data

shipping_optionsPricedShippingOption[]Required

An array of shipping options details.