Framework: Fix errors on transition from themes to signup

[seear]

Used to be #4467 so a lot of the review comments are there.

Addresses #3549

Because the signup pages use the logged-in Layout component, and logged-out theme showcase uses the lighter-weight logged-out layout, transitioning from logged-out showcase to the signup does not work properly as the signup components are rendered into the wrong layout component:

This PR adds the capability to render a complete logged-in layout (signup uses the logged-in layout), and changes all the signup routes to use the isomorphic router and render a complete tree, meaning that on transition from logged-out showcase to signup, a correct layout is rendered.

To Test

1. Check that the following routes are all working as before:
   /start*
/log-in*
/phone*
/jetpack
   (Jetpack testing instructions detailed in Jetpack Connect: logged out users #4155)

2. Showcase --> signup flow

• Go to http://calypso.localhost:3000/design, logged-out
• Click on the ... button for a theme and click Choose this design
• The signup page should appear, and work, without errors in the console
• the back button should return to /design, without errors

3. Maybe necessary to check that signup still works properly in the desktop app?

[seear]

@mcsf, @ehg: I've tested the /design -> /start signup flow, and /start on it's own. Anything else I should be looking out for from an NUX perspective?

[ockham]

Giving this some more thought, this is probably unneeded. This will cause unmountComponentAtNode to run for #secondary. So if this piece of code wasn't calling unmountComponentAtNode before, we don't need to introduce it now -- continuing to assume it's not necessary. (Same for the other new occurrences of context.secondary in this diff.)

[ockham]

1. Check that the following routes are all working as before:
   [...]
   /log-in*

When logging in with my email address, I'm stuck at 'Logging you in...' and seeing the following error:

Uncaught TypeError: this.renderLocaleSuggestions is not a function
app:///./client/signup/log-in-form/index.jsx:180
resolve @ app:///./~/wpcom-proxy-request/index.js:442

[ockham]

1. Check that the following routes are all working as before:
   [...]
   /phone*

When entering my verification code, I get an error:

Uncaught TypeError: this.formatNumber is not a functionReactErrorUtils.invokeGuardedCallback @
app:///./client/signup/phone-signup-form/index.jsx:47
app:///./~/react/lib/ReactErrorUtils.js:71

(I'm then also told that the code is invalid, but that might be because I waited too long to enter it. However, I'm not presented with any way to re-request a verification code.)

[ockham]

The /log-in* error is also present on master.

[ockham]

So is the /phone one. 😅

[seear]

Why remove the setSection dispatch?

hasSidebar is obsolete, no? We use secondary in client/sections.js now:

wp-calypso/client/sections.js

Line 122 in 51b57a8

secondary: false,

[ehg]

I've tested the /design -> /start signup flow, and /start on it's own. Anything else I should be looking out for from an NUX perspective?

I can't think of anything else. Looping @michaeldcain in :)

[seear]

The /log-in* error is also present on master.
So is the /phone one

Yeah, I don't think we're introducing any regressions here.

[ockham]

Am 19.04.2016 12:14 schrieb Steve Seear notifications@github.com:

Why remove the setSection dispatch?

hasSidebar is obsolete, no?
But this was also setting a section name...

[seear]

But this was also setting a section name...

not used anywhere

[ockham]

Okay, I'm buying it :-D

👍