test.ts

import {
  extension as checkoutExtension,
  BlockStack,
  Heading,
} from "@shopify/ui-extensions/checkout";
import {
  extension as customerAccountExtension
} from '@shopify/ui-extensions/customer-account';
interface LineItem {
  merchandise: {
    product: {
      id: string;
    };
  };
  quantity: number;
}
interface ApiInterface {
  shop: {
    name: string;
  };
  lines: {
    current: LineItem[];
  };
  order?: {
    current: unknown;
  };
}
async function loadIt(root: any, api: ApiInterface, lineItems: LineItem[]): Promise<void> {
  const container = root.createComponent(BlockStack, { spacing: "loose" });
  container.append(
    root.createComponent(
      Heading,
      { level: 1 },
      ["TEST"]
    ),
  );
  root.append(container);
}
// Extension for checkout
checkoutExtension("purchase.thank-you.block.render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.thank-you.header.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::ThankYou::Dynamic::Render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.cart-line-list.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::CartLines::RenderAfter", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.cart-line-item.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::CartLineDetails::RenderAfter", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.contact.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::Contact::RenderAfter", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.delivery-address.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.block.render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::Dynamic::Render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.payment-option-item.action-required.render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.payment-method-list.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.reductions.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("Checkout::Reductions::RenderAfter", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.header.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.footer.render-after", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
checkoutExtension("purchase.checkout.chat.render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});
customerAccountExtension("customer-account.order-status.block.render", async (root, api: ApiInterface) => {
  await loadIt(root, api, api.lines.current);
});