Order APIAPIs
APIs
The Order API provides an extension with data about the current order.
Supporting targets
- pos.purchase.post.action.menu-item.render
- pos.purchase.post.action.render
- pos.purchase.post.block.render
- pos.return.post.action.menu-item.render
- pos.return.post.action.render
- pos.return.post.block.render
- pos.exchange.post.action.menu-item.render
- pos.exchange.post.action.render
- pos.exchange.post.block.render
- pos.order-details.action.menu-item.render
- pos.order-details.action.render
- pos.order-details.block.render
Anchor to orderapiOrderApi
number
required
The unique identifier for the order
Anchor to name
name
string
required
The name of the order
Anchor to customerId
customerId
number
The unique identifier of the customer associated with the order
Was this section helpful?
Anchor to examplesExamples
Examples of using the Order API
Anchor to example-basic-usage-of-the-order-api-in-an-actionBasic usage of the Order API in an action
Anchor to example-display-order-details-in-a-blockDisplay order details in a block
Was this section helpful?
Basic usage of the Order API in an action
import React from 'react';
import {
reactExtension,
Screen,
Navigator,
ScrollView,
Text,
Section,
useApi,
} from '@shopify/ui-extensions-react/point-of-sale';
const PostPurchaseAction = () => {
const api = useApi<'pos.purchase.post.action.render'>();
const order = api.order;
return (
<Navigator>
<Screen name="PostPurchaseAction" title="Post Purchase Action">
<ScrollView>
<Section title="Order Information">
<Text>Order ID: {order.id}</Text>
<Text>Order Name: {order.name}</Text>
{order.customerId && <Text>Order Customer ID: {order.customerId}</Text>}
</Section>
</ScrollView>
</Screen>
</Navigator>
);
};
export default reactExtension('pos.purchase.post.action.render', () => (
<PostPurchaseAction />
));