diff --git a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx index 2e6ff2c74..fe3977e45 100644 --- a/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx +++ b/src/orders/components/OrderFulfillPage/OrderFulfillPage.tsx @@ -27,6 +27,7 @@ import { update } from "@saleor/utils/lists"; import ControlledCheckbox from "@saleor/components/ControlledCheckbox"; import { renderCollection } from "@saleor/misc"; import Skeleton from "@saleor/components/Skeleton"; +import AppHeader from "@saleor/components/AppHeader"; const useStyles = makeStyles( theme => ({ @@ -136,6 +137,22 @@ const OrderFulfillPage: React.FC = ({ return ( + + {order?.number + ? intl.formatMessage( + { + defaultMessage: "Order #{orderNumber}", + description: "page header with order number" + }, + { + orderNumber: order.number + } + ) + : intl.formatMessage({ + defaultMessage: "Order", + description: "page header" + })} + = ({ orderId }) => { const navigate = useNavigator(); + const intl = useIntl(); const { data, loading } = useOrderFulfillData({ displayLoader: true, variables: { @@ -26,14 +29,34 @@ const OrderFulfill: React.FC = ({ orderId }) => { }); return ( - navigate(orderUrl(orderId))} - onSubmit={() => undefined} - order={data?.order} - saveButtonBar="default" - warehouses={warehouseData?.warehouses.edges.map(edge => edge.node)} - /> + <> + + navigate(orderUrl(orderId))} + onSubmit={() => undefined} + order={data?.order} + saveButtonBar="default" + warehouses={warehouseData?.warehouses.edges.map(edge => edge.node)} + /> + ); };