set unstable to latest customer-account internal state

[robin-drexler]

Background

This PR moves back our internal apis to unstable in preparation for release.

It mainly ports over new components (like Card) and APIs that we have added, but also includes some type renamings caused by clashes in OrderStatus and StandardApi.

The PR also ensures that hooks that only work on the ODP properly throw errors if used elsewhere.

🎩

Here's what I did on the spinstance to make this 🎩 able.

inside ui-extensions

yarn build

To build the packages and make them consumable locally.

Then inside the customer account and extension repos

rm -rf node_modules/@shopify/{ui-extensions,ui-extensions-react} && cp -r ../ui-extensions/packages/{ui-extensions,ui-extensions-react} node_modules/@shopify/

So both are now using the locally built version of ui-extension packages.

I ran type-check inside in both repos, which succeeded.
It'll run again properly in CI after we merge this PR and update the version properly in package.json

You can see the still working extension here.

• Go to https://customer-accounts-ui-extension-dev.unstable-one.robin-drexler.us.spin.dev/extensions/dev-console
• Click on customer-account.order.action.render
• Login with dev@shopify.com https://identity.unstable-one.robin-drexler.us.spin.dev/services/mail
• Go to https://development-store-1.account.shopify.unstable-one.robin-drexler.us.spin.dev/orders/3
• You should see an extension running in the summary

Checklist

• I have 🎩'd these changes
• I have updated relevant documentation

[robin-drexler]

Those seemed to be missing. Other non-prop exports of components , like MapBounds are exported here as well.

[robin-drexler]

A bunch of our hooks only work on the ODP. We're throwing this error when they are used outside of the ODP.

This is done so that we can keep the typings that we have. Alternatively, we'd have to mark all of them as optional which would be a breaking change for existing OSP/ODP extensions.

[robin-drexler]

Added new APIs

[lsit]

Components and related types look good

[brianshen1990]

hm... we limited it to only RenderOrderStatusExtensionTarget to strongly suggest that it should only be used on order status page, why do we change it back to RenderExtensionTarget as it will not put any type check error for targets outside order status page ? https://github.com/Shopify/ui-extensions/blob/internal/packages/ui-extensions-react/src/surfaces/customer-account/hooks/attributes.ts#L24

[robin-drexler]

good catch!

[robin-drexler]

adjusted it. Unfortunately, I had to update a bunch of tests to set extension.target in the api as it would've otherwise failed. It's actually better, but it makes the PR seem bigger

[brianshen1990]

if we switch https://github.com/Shopify/ui-extensions/pull/1448/files#diff-ccb0ccef13a6c51f7ca59868cf8bc5ef122d304f166692a758ea3e83abe796a3R24 error's constructor from
constructor(field: string, target: ExtensionTarget) {
to
constructor(field: string, target: RenderExtensionTarget) { will we be able to get rid of the extra const here?

[robin-drexler]

No, it has unfortunately nothing to do with the Error.

Take this example here:

export function useAppMetafields<
  Target extends RenderOrderStatusExtensionTarget = RenderOrderStatusExtensionTarget,
>(filters: AppMetafieldFilters = {}): AppMetafieldEntry[] {
  const api = useApi<Target>();
  const extensionTarget = api.extension.target;

  if (!('appMetafields' in api)) {
    // api will be `never` inside this if block. Even before we even use the `Error`
   // it's because it's typing-wise impossible to get into this state
   // you can't have no appMetafields and still have a valid `api` object. (technically)
  // but not everybode uses TS, so we still want to throw if someone uses this hook for an extension point that does not make sense
  
    throw new ExtensionHasNoFieldError('appMetafields', extensionTarget);
  }
}

[brianshen1990]

tophatted and looks good, let's release a new unstable version to have a test~