-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Login block: Accept the user email as a prop #41799
Conversation
Here is how your PR affects size of JS and CSS bundles shipped to the user's browser: App Entrypoints (~11 bytes added 📈 [gzipped])
Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used. Async-loaded Components (~3 bytes added 📈 [gzipped])
React components that are loaded lazily, when a certain part of UI is displayed for the first time. 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. Generated by performance advisor bot at iscalypsofastyet.com. |
@@ -69,6 +69,7 @@ class Login extends Component { | |||
twoFactorEnabled: PropTypes.bool, | |||
twoFactorNotificationSent: PropTypes.string, | |||
isSecurityKeySupported: PropTypes.bool, | |||
userEmail: PropTypes.string, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Where is userEmail
coming from?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Normally it's coming from the page's querystring (see here). So you'll land in the login flow with an URL like /login?...&email_address=foo@bar.com
, and the Email
field will be prefilled with foo@bar.com
.
What I've made in this PR is to have the possibility to override that value. So the LoginBlock
could be rendered like:
<LoginBlock userEmail="asdf@aaa.com" />
And the prefilled Email field will be asdf@aaa.com
, regardless of the URL the user landed on. Because the whole login/signup/authorize Woo flow is implemented in a single page (without the URL ever changing), this was a needed addition.
8389cd2
to
00921f4
Compare
Changes proposed in this Pull Request
In 3bec7b8, added an optional
userEmail
prop to theLoginBlock
. If present, the form will be prefilled with that email instead of relying on the current route querystring.In 9f540c3, moved the styles for the social divider (this) to the login block styles, since that block can be used outside of
wp-login
.How to test
This is just a refactor, there shouldn't be any regression. At this moment,
LoginBlock
is never called with auserEmail
prop. The "social divider" is only used in the WooCommerce login flow, so to test that the styles still look good, go tohttp://calypso.localhost:3000/log-in?from=woocommerce-onboarding
.Note: This is a required refactor for the new "Woo DNA" flow, implemented in #41798