[PWA-458] Checkout - Sign In View

[tjwiebell]

Description

Before starting, check with UX to ensure desired functionality. In particular, the current (10/14) desire is to remove the "sign in" link from the cart page and to update the user flow on the checkout page by including a new CTA that opens a sign in page view that, once complete, redirects back to the checkout page (with new user data). On desktop the CTA appears above the summary on the right. On Mobile the CTA appears above the forms, as the summary is moved below the forms (after payment info step).

Related Issue

• [PWA-458] Checkout - Sign In View

Acceptance

Verification Stakeholders

Specification

Verification Steps

1. Add items to a guest cart
2. Navigate to /cart, verify sign in link no longer there
3. Navigate to /checkout, verify new style and position of sign in panel
4. Step through each scenario in this new view (sign-in, forgot password, create account). Sign-in and create account should return you to checkout view. Forgot password is a bit of a dead end but assumed they would continue the journey from an email link
5. Verify display and positioning on mobile (functionality wise these do not change between mobile and desktop).

Screenshots / Screen Captures (if appropriate)

Checklist

• I have added tests to cover my changes, if necessary.
• I have added translations for new strings, if necessary.
• I have updated the documentation accordingly, if necessary.

[PWAStudioBot]

	Messages
📖	Associated JIRA tickets: PWA-458.
📖	DangerCI Failures related to missing labels/description/linked issues/etc will persist until the next push or next nightly build run (assuming they are fixed).
📖	Access a deployed version of this PR here. Make sure to wait for the "pwa-pull-request-deploy" job to complete.

Generated by 🚫 dangerJS against b3941dd

[schensley]

@tjwiebell Thanks for all the work. UX Approved.

[supernova-at]

Nice way to handle this 😅 .

Looking at SignIn,

    if (isBusy) {
        return (
            <div className={classes.modal_active}>
                <LoadingIndicator>
                    <FormattedMessage
                        id={'signIn.loadingText'}
                        defaultMessage={'Signing In'}
                    />
                </LoadingIndicator>
            </div>
        );
    }

I'm guessing we just don't care if its busy getting the user's info or signing them in?
Why don't we?

[tjwiebell]

We still block on these operations, I just needed a slightly different UX while this was happened. Without the override I got this full page indicator, when I wanted something in context of my view.

No good:

Better:

[supernova-at]

Works great!

Nice re-use, love to see code being deleted, and great tests 👍

A couple questions for clarification and maybe some minor changes.

[dpatil-magento]

QA Approved.