The admin ui order detail action screen can not redirect to our app

Extensions
1

The admin ui order detail action screen on Mobile App doesn’t navigate to the app page while it works on POS App, please see this video.
Video: https://youtube.com/shorts/0qC5avH5Z_g?feature=share
Source code:

import { useCallback } from "preact/hooks";
import { render } from "preact";

const baseSrc = `app:invoices/preview/order`;

function ActionExtension() {
  const typePath = useCallback((type: string) => {
    const idString = shopify.data.selected?.[0]?.id;
    if (!idString) {
      return null;
    }
    const id = idString.replace("gid://shopify/Order/", "");
    const basePath = `${baseSrc}?id=${id}`;
    if (type === "2") {
      return `${basePath}&type=packing-slip`;
    }
    if (type === "3") {
      return `${basePath}&type=refund`;
    }
    return `${basePath}&type=invoice`;
  }, []);

  const print = shopify.i18n.translate("Print");
  const type1 = shopify.i18n.translate("type1");
  const type2 = shopify.i18n.translate("type2");
  const type3 = shopify.i18n.translate("type3");

  // Use direct API calls to fetch data from Shopify.
  return (
    <s-admin-action heading={shopify.i18n.translate("name")}>
      <s-stack direction="block" gap="base" alignItems="center">
        <s-text type="generic">{shopify.i18n.translate("documents")}</s-text>
        <s-stack direction="inline" gap="small-100" alignContent="center">
          <s-button href={typePath("1")} target="_blank" variant="primary">
            {print} {type1}
          </s-button>
          <s-button href={typePath("2")} target="_blank">
            {print} {type2}
          </s-button>
          <s-button href={typePath("3")} target="_blank">
            {print} {type3}
          </s-button>
        </s-stack>
      </s-stack>
    </s-admin-action>
  );
}

export default async () => {
  render(<ActionExtension />, document.body);
};