React 18 Suspense issue for nested reactPlayer.hooks.webComponent

[spentacular]

When leveraging the reactPlayer.hooks.webComponent to potentially render an alternative component, React can fall into a suspended state forever because the thrown promise is removed from the tree without ever resolving here.

This comes into play when using an External Action Plugin to render an alternative component when a specific EXTERNAL is navigated to. This will happen anytime the reactPlayer.hooks.webComponent renders something other than the Component argument as it's children, since that will cause the final WebPlayerComponent to be removed from the tree without the promise ever resolving, keeping it in a suspended state.

Ideally we can better expose the subscription in the react player so that anyone can publish to it and also leverage that same subscription for also choosing to render an alternative path. publish for this top level would function more closely to a redux action like:

reactPlayer.viewUpdateSubscription.publish({
  type: 'alternative-component',
  payload: { /* custom payload */ }
});

This way, others wouldn't have to keep their own local subscription to force a re-render of the reactPlayer.hooks.webComponent, they could just leverage the top level subscription then to render the alternative path:

reactPlayer.hooks.webComponent.tap(this.name, (Comp) => {
  return () => {
    if (reactPlayer.viewUpdateSubscription.get().type === 'alternative-component') {
      return <AlternativeComponent />
    }

    return <Comp />
  };
});