OrderStatusApi

import {
  render,
  Banner,
  useOrder,
} from '@shopify/checkout-ui-extensions-react';

render(
  'Checkout::OrderStatus::CustomerInformation::RenderAfter',
  () => ,
);

function Extension() {
  const order = useOrder();

  if (order) {
    return (
      
        Please include your order ID ({order.id})
        in support requests
      
    );
  }

  return null;
}

import {
  Banner,
  extend,
} from '@shopify/checkout-ui-extensions';

extend(
  'Checkout::OrderStatus::CustomerInformation::RenderAfter',
  (root, {order}) => {
    let bannerShown = false;

    order.subscribe((order) => {
      if (order && !bannerShown) {
        root.appendChild(
          root.createComponent(
            Banner,
            undefined,
            `Please include your order ID (${order.id}) in support requests`,
          ),
        );

        bannerShown = true;
      }
    });
  },
);