Domain Site Redirect: Use shoppingCartManager to add products in SiteRedirectStep

[sirbrillig]

Changes proposed in this Pull Request

As part of removing CartStore (see #24019), this PR replaces the code in SiteRedirectStep that adds a redirect product to the cart with functions from @automattic/shopping-cart.

Testing instructions

• Visit the site-redirect form at a URL like http://calypso.localhost:3000/domains/add/site-redirect/example.com
• Write a domain name in the form field and press "Go".
• Verify that you are redirected to checkout and that a "Site redirect" product is in your cart.

[matticbot]

Test live: https://calypso.live/?branch=update/site-redirect-use-shopping-cart

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~68 bytes added 📈 [gzipped])

name                   parsed_size           gzip_size
entry-main                  +105 B  (+0.0%)      +28 B  (+0.0%)
entry-login                 +105 B  (+0.0%)      +30 B  (+0.0%)
entry-gutenboarding         +105 B  (+0.0%)      +26 B  (+0.0%)
entry-domains-landing       +105 B  (+0.0%)      +35 B  (+0.0%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~48 bytes removed 📉 [gzipped])

name      parsed_size           gzip_size
checkout       -145 B  (-0.0%)       +6 B  (+0.0%)
domains         -19 B  (-0.0%)      -54 B  (-0.0%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[klimeryk]

Tested and works - with the exception that there's a significant delay between clicking the "Add" button and anything happening. I know it's because of the async call to the shopping cart, etc., but to the user (or a CEO testing these flows... ;)), it could appear like you need to click a few times to get it to "work". Would it be possible to add a busy state to the button while we're waiting for the shopping cart to refresh/reload?

[sirbrillig]

Good thinking. I added a busy state and disabled the button (I always forget that the former does not imply the latter). Updated the description to include a gif.

[sirbrillig]

Failing tests seem to be unrelated.

[nbloomf]

Testing works as expected, and the busy/disabled button also works. Using the X to leave checkout goes back to the Site Redirect page.