diff --git a/client/blocks/login/continue-as-user.scss b/client/blocks/login/continue-as-user.scss
index b4a71d4d1c08..9ee21fb7a818 100644
--- a/client/blocks/login/continue-as-user.scss
+++ b/client/blocks/login/continue-as-user.scss
@@ -55,3 +55,12 @@
width: 100%;
}
}
+
+.is-white-login {
+ .continue-as-user {
+ height: auto;
+ }
+ .continue-as-user__not-you {
+ position: static;
+ }
+}
\ No newline at end of file
diff --git a/client/blocks/login/index.jsx b/client/blocks/login/index.jsx
index 1d9b56967627..41e8e06869e8 100644
--- a/client/blocks/login/index.jsx
+++ b/client/blocks/login/index.jsx
@@ -1,34 +1,24 @@
-import config from '@automattic/calypso-config';
import page from '@automattic/calypso-router';
import { localizeUrl } from '@automattic/i18n-utils';
import clsx from 'clsx';
import emailValidator from 'email-validator';
import { localize } from 'i18n-calypso';
-import { capitalize, get, isEmpty, startsWith } from 'lodash';
+import { get, isEmpty, startsWith } from 'lodash';
import PropTypes from 'prop-types';
import { Component, Fragment } from 'react';
import { connect } from 'react-redux';
-import A4APlusWpComLogo from 'calypso/a8c-for-agencies/components/a4a-plus-wpcom-logo';
-import VisitSite from 'calypso/blocks/visit-site';
import AsyncLoad from 'calypso/components/async-load';
-import GravatarLoginLogo from 'calypso/components/gravatar-login-logo';
-import JetpackPlusWpComLogo from 'calypso/components/jetpack-plus-wpcom-logo';
import Notice from 'calypso/components/notice';
-import WooCommerceConnectCartHeader from 'calypso/components/woocommerce-connect-cart-header';
-import WPCloudLogo from 'calypso/components/wp-cloud-logo';
import wooDnaConfig from 'calypso/jetpack-connect/woo-dna-config';
import isAkismetRedirect from 'calypso/lib/akismet/is-akismet-redirect';
-import { preventWidows } from 'calypso/lib/formatting';
import getGravatarOAuth2Flow from 'calypso/lib/get-gravatar-oauth2-flow';
-import { getPluginTitle, getSignupUrl } from 'calypso/lib/login';
+import { getSignupUrl } from 'calypso/lib/login';
import {
- isCrowdsignalOAuth2Client,
isJetpackCloudOAuth2Client,
isA4AOAuth2Client,
isBlazeProOAuth2Client,
isGravatarFlowOAuth2Client,
isGravatarOAuth2Client,
- isPartnerPortalOAuth2Client,
} from 'calypso/lib/oauth2-clients';
import { login } from 'calypso/lib/paths';
import { isWebAuthnSupported } from 'calypso/lib/webauthn';
@@ -66,6 +56,7 @@ import isWooJPCFlow from 'calypso/state/selectors/is-woo-jpc-flow';
import ContinueAsUser from './continue-as-user';
import ErrorNotice from './error-notice';
import LoginForm from './login-form';
+import { LoginHeader } from './login-header';
import './style.scss';
@@ -337,413 +328,20 @@ class Login extends Component {
return getSignupUrl( currentQuery, currentRoute, oauth2Client, locale, pathname );
};
- renderHeader() {
- const {
- action,
- currentQuery,
- fromSite,
- isFromAkismet,
- isFromMigrationPlugin,
- isFromAutomatticForAgenciesPlugin,
- isGravPoweredClient,
- isGravPoweredLoginPage,
- isJetpack,
- isManualRenewalImmediateLoginAttempt,
- isSignupExistingAccount,
- isSocialFirst,
- isWhiteLogin,
- isWCCOM,
- linkingSocialService,
- oauth2Client,
- socialConnect,
- translate,
- twoStepNonce,
- wccomFrom,
- isWooJPC,
- twoFactorAuthType,
- } = this.props;
-
- let headerText = translate( 'Log in to your account' );
- let preHeader = null;
- let headerElement = null;
- let postHeader = null;
- const signupLink = this.getSignupLinkComponent();
-
- if ( isSocialFirst ) {
- headerText = translate( 'Log in to WordPress.com' );
- }
-
- if ( 'authenticator' === twoFactorAuthType ) {
- headerText = translate( 'Continue with an authentication code' );
- }
-
- if ( 'push' === twoFactorAuthType ) {
- headerText = translate( 'Continue with the Jetpack app' );
- }
-
- if ( 'backup' === twoFactorAuthType ) {
- headerText = translate( 'Continue with a backup code' );
- }
-
- if ( isManualRenewalImmediateLoginAttempt ) {
- headerText = translate( 'Log in to update your payment details and renew your subscription' );
- }
-
- if ( twoStepNonce ) {
- headerText = translate( 'Two-Step Authentication' );
- } else if ( socialConnect ) {
- headerText = translate( 'Connect your %(service)s account', {
- args: {
- service: capitalize( linkingSocialService ),
- },
- } );
- } else if ( action === 'lostpassword' ) {
- headerText =
{ translate( 'Forgot your password?' ) }
;
- postHeader = (
-
- { translate(
- 'It happens to the best of us. Enter the email address associated with your WordPress.com account and we’ll send you a link to reset your password.'
- ) }
- { isWooJPC && (
-
-
- { translate( 'Don’t have an account? {{signupLink}}Sign up{{/signupLink}}', {
- components: {
- signupLink,
- },
- } ) }
-
- ) }
-
- { translate(
- 'It happens to the best of us. Enter the email address associated with your Blaze Pro account and we’ll send you a link to reset your password.'
- ) }
-
- );
- }
- } else if ( oauth2Client ) {
- headerText = translate( 'Howdy! Log in to %(clientTitle)s with your WordPress.com account.', {
- args: {
- clientTitle: oauth2Client.title,
- },
- comment:
- "'clientTitle' is the name of the app that uses WordPress.com authentication (e.g. 'Akismet' or 'VaultPress')",
- } );
-
- if ( isWCCOM ) {
- if ( wccomFrom === 'cart' ) {
- preHeader = ;
- headerText = translate( 'Log in with a WordPress.com account' );
- postHeader = (
-
- { translate(
- 'Log in to WooCommerce.com with your WordPress.com account to connect your store and manage your extensions'
- ) }
-
- { translate(
- "Your password reset confirmation is on its way to your email address – please check your junk folder if it's not in your inbox! Once you've reset your password, head back to this page to log in to your account."
- ) }
-
- );
- }
- }
-
- if ( isJetpackCloudOAuth2Client( oauth2Client ) ) {
- headerText = translate( 'Howdy! Log in to Jetpack.com with your WordPress.com account.' );
- preHeader = (
-
-
-
- );
- }
-
- if ( isA4AOAuth2Client( oauth2Client ) ) {
- headerText = translate(
- 'Howdy! Log in to Automattic for Agencies with your WordPress.com{{nbsp/}}account.',
+ renderLoginFormSignupNotice() {
+ return (
+
+ { this.props.translate(
+ 'This email address is already associated with an account. Please consider {{returnToSignup}}using another one{{/returnToSignup}} or log in.',
{
- components: { nbsp: <> },
- comment: 'The {{nbsp/}} is a non-breaking space',
+ components: {
+ returnToSignup: (
+
+ ),
+ },
}
- );
- preHeader = (
-
-
-
- );
- }
-
- if ( isPartnerPortalOAuth2Client( oauth2Client ) ) {
- if ( document.location.search?.includes( 'wpcloud' ) ) {
- headerText = translate( 'Log in to WP Cloud with WordPress.com' );
- preHeader = (
-
-
-
- );
- } else if ( document.location.search?.includes( 'jetpack' ) ) {
- headerText = translate(
- 'Howdy! Log into the Jetpack Partner Portal with your WordPress.com account.'
- );
- preHeader = (
-
-
-
- );
- } else {
- headerText = translate(
- 'Howdy! Log into the Automattic Partner Portal with your WordPress.com account.'
- );
- }
- }
-
- if ( isJetpackCloudOAuth2Client( oauth2Client ) || isA4AOAuth2Client( oauth2Client ) ) {
- // If users arrived here from the lost password flow, show them a specific message about it
- postHeader = currentQuery.lostpassword_flow && (
-
- { translate(
- 'Check your e-mail address linked to the account for the confirmation link, including the spam or junk folder.'
- ) }
-
- { isFromGravatar3rdPartyApp || isFromGravatarQuickEditor || isGravatarFlowWithEmail
- ? translate( 'Please log in with your email and password.' )
- : translate(
- 'If you prefer logging in with a password, or a social media account, choose below:'
- ) }
-
;
-
- subtitle = translate(
- "Your password reset confirmation is on its way to your email address – please check your junk folder if it's not in your inbox! Once you've reset your password, head back to this page to log in to your account."
- );
- break;
- case isTwoFactorAuthFlow:
- headerText =
{ translate( 'Authenticate your login' ) }
;
- break;
- default:
- headerText =
{ translate( 'Log in to your account' ) }
;
- // pluginName is already translated with an "in" prefix in getPluginTitle.
- subtitle = translate(
- 'To access all of the features and functionality %(pluginName)s, you’ll first need to connect your store to a WordPress.com account. Log in now, or {{signupLink}}create a new account{{/signupLink}}. For more information, please {{doc}}review our documentation{{/doc}}.',
- {
- components: {
- signupLink,
- br: ,
- doc: (
-
- ),
- },
- args: { pluginName },
- }
- );
- }
- preHeader = null;
- postHeader =
{ subtitle }
;
- } else if ( isFromMigrationPlugin ) {
- headerText = translate( 'Log in to your account' );
- } else if ( isJetpack && ! isFromAutomatticForAgenciesPlugin ) {
- const isJetpackMagicLinkSignUpFlow = config.isEnabled( 'jetpack/magic-link-signup' );
- headerText = isJetpackMagicLinkSignUpFlow
- ? translate(
- 'Log in or create a WordPress.com account to supercharge your site with powerful growth, performance, and security tools.'
- )
- : translate( 'Log in or create a WordPress.com account to set up Jetpack' );
- preHeader =
{ translate( 'Log in or sign up' ) }
;
- headerElement =
{ headerText }
;
- } else if ( fromSite ) {
- // if redirected from Calypso URL with a site slug, offer a link to that site's frontend
- postHeader = ;
- } else if ( isSignupExistingAccount ) {
- headerText = preventWidows( translate( 'Log in to your existing account' ) );
- }
-
- if (
- isWhiteLogin &&
- ! isBlazeProOAuth2Client( oauth2Client ) &&
- ! isPartnerPortalOAuth2Client( oauth2Client )
- ) {
- preHeader = (
-
-
-
- );
- }
-
- if ( isFromAkismet ) {
- headerText = translate( 'Log in to Akismet with WordPress.com' );
- }
-
- if ( isFromAutomatticForAgenciesPlugin ) {
- headerText = translate( 'Log in to Automattic for Agencies' );
- preHeader = (
-
- );
- }
-
- return (
-
+
);
}
@@ -754,7 +352,7 @@ class Login extends Component {
}
const tos = translate(
- 'Just a little reminder that by continuing with any of the options below, you agree to our {{tosLink}}Terms of Service{{/tosLink}} and have read our {{privacyLink}}Privacy Policy{{/privacyLink}}.',
+ 'By continuing you agree to our {{tosLink}}Terms of Service{{/tosLink}} and have read our {{privacyLink}}Privacy Policy{{/privacyLink}}.',
{
components: {
tosLink: (
@@ -813,7 +411,6 @@ class Login extends Component {
action,
currentQuery,
isGravPoweredClient,
- isSignupExistingAccount,
isSocialFirst,
isFromAutomatticForAgenciesPlugin,
currentUser,
@@ -970,7 +567,6 @@ class Login extends Component {
handleUsernameChange={ handleUsernameChange }
signupUrl={ signupUrl }
hideSignupLink={ isGravPoweredClient || isBlazePro }
- isSignupExistingAccount={ isSignupExistingAccount }
sendMagicLoginLink={ this.sendMagicLoginLink }
isFromAkismet={ this.props.isFromAkismet }
isSendingEmail={ this.props.isSendingEmail }
@@ -998,6 +594,27 @@ class Login extends Component {
locale,
isWCCOM,
isFromAutomatticForAgenciesPlugin,
+ action,
+ currentQuery,
+ fromSite,
+ isFromMigrationPlugin,
+ isGravPoweredClient,
+ isGravPoweredLoginPage,
+ isManualRenewalImmediateLoginAttempt,
+ isSignupExistingAccount,
+ isSocialFirst,
+ isWhiteLogin,
+ isBlazePro,
+ linkingSocialService,
+ socialConnect,
+ translate,
+ twoStepNonce,
+ wccomFrom,
+ isWooJPC,
+ twoFactorAuthType,
+ twoFactorEnabled,
+ initialQuery,
+ partnerSlug,
} = this.props;
return (
@@ -1010,18 +627,52 @@ class Login extends Component {
'is-a4a': isA4AOAuth2Client( oauth2Client ),
} ) }
>
- { this.renderHeader() }
+ { ! isWhiteLogin && (
+
+ ) }
+
+ { isSignupExistingAccount && this.renderLoginFormSignupNotice() }
{ /* For Woo, we render the ErrrorNotice component in login-form.jsx */ }
{ ! isWCCOM && }
{ this.renderNotice() }
- { this.renderToS() }
+ { ! isWhiteLogin && this.renderToS() }
{ this.renderContent() }
{ this.renderFooter() }
+
+ { isWhiteLogin && this.renderToS() }
);
}
diff --git a/client/blocks/login/login-form.jsx b/client/blocks/login/login-form.jsx
index 6570203b8e40..333be7a4780c 100644
--- a/client/blocks/login/login-form.jsx
+++ b/client/blocks/login/login-form.jsx
@@ -100,7 +100,6 @@ export class LoginForm extends Component {
showSocialLoginFormOnly: PropTypes.bool,
currentQuery: PropTypes.object,
hideSignupLink: PropTypes.bool,
- isSignupExistingAccount: PropTypes.bool,
sendMagicLoginLink: PropTypes.func,
isSendingEmail: PropTypes.bool,
cancelSocialAccountConnectLinking: PropTypes.func,
@@ -352,23 +351,6 @@ export class LoginForm extends Component {
);
}
- renderLoginFromSignupNotice() {
- return (
-
- { this.props.translate(
- 'This email address is already associated with an account. Please consider {{returnToSignup}}using another one{{/returnToSignup}} or log in.',
- {
- components: {
- returnToSignup: (
-
- ),
- },
- }
- ) }
-
- );
- }
-
onWooCommerceSocialSuccess = ( ...args ) => {
this.recordWooCommerceLoginTracks( 'social' );
this.props.onSuccess( args );
@@ -778,7 +760,6 @@ export class LoginForm extends Component {
isWoo,
isBlazePro,
hideSignupLink,
- isSignupExistingAccount,
isSendingEmail,
isSocialFirst,
isJetpack,
@@ -876,8 +857,6 @@ export class LoginForm extends Component {
) }
- { isSignupExistingAccount && this.renderLoginFromSignupNotice() }
-
{ this.renderUsernameorEmailLabel() };
+ fromSite: string | null;
+ isFromAkismet: boolean;
+ isFromMigrationPlugin: boolean;
+ isFromAutomatticForAgenciesPlugin: boolean;
+ isGravPoweredClient: boolean;
+ isGravPoweredLoginPage: boolean;
+ isJetpack: boolean;
+ isManualRenewalImmediateLoginAttempt: boolean;
+ isSignupExistingAccount: boolean;
+ isSocialFirst: boolean;
+ isWhiteLogin: boolean;
+ isWCCOM: boolean;
+ isBlazePro: boolean;
+ linkingSocialService: string;
+ oauth2Client: {
+ title: string;
+ icon: string;
+ } | null;
+ socialConnect: boolean;
+ twoStepNonce: string | null;
+ wccomFrom: string;
+ isWooJPC: boolean;
+ twoFactorAuthType: string;
+ twoFactorEnabled: boolean;
+ initialQuery: { 'client-id': string; redirect_to: string } | null;
+ getSignupLinkComponent: () => JSX.Element;
+ showContinueAsUser: boolean;
+}
+
+export function getHeaderText(
+ isSocialFirst: boolean,
+ twoFactorAuthType: string | null,
+ isManualRenewalImmediateLoginAttempt: boolean,
+ socialConnect: boolean,
+ linkingSocialService: string,
+ action: string,
+ oauth2Client: { title: string; icon: string } | null,
+ isWooJPC: boolean,
+ isFromMigrationPlugin: boolean,
+ isJetpack: boolean,
+ isWCCOM: boolean,
+ isFromAkismet: boolean,
+ isFromAutomatticForAgenciesPlugin: boolean,
+ isGravPoweredClient: boolean,
+ wccomFrom: string,
+ twoFactorEnabled: boolean,
+ currentQuery: Record< string, string >,
+ translate: ( arg0: string, arg1?: object ) => TranslateResult,
+ showContinueAsUser: boolean = false,
+ twoStepNonce: string | null = null
+): TranslateResult {
+ let headerText = translate( 'Log in to your account' );
+
+ if ( isSocialFirst ) {
+ headerText = translate( 'Log in to WordPress.com' );
+ }
+
+ if ( twoFactorAuthType === 'authenticator' ) {
+ headerText = translate( 'Continue with an authentication code' );
+ }
+
+ if ( twoFactorAuthType === 'push' ) {
+ headerText = translate( 'Continue with the Jetpack app' );
+ } else if ( twoFactorAuthType === 'backup' ) {
+ headerText = translate( 'Continue with a backup code' );
+ }
+
+ if ( isManualRenewalImmediateLoginAttempt ) {
+ headerText = translate( 'Log in to update your payment details and renew your subscription' );
+ }
+
+ if ( twoStepNonce ) {
+ headerText = translate( 'Two-Step Authentication' );
+ }
+
+ if ( socialConnect ) {
+ headerText = translate( 'Connect your %(service)s account', {
+ args: {
+ service: capitalize( linkingSocialService ),
+ },
+ } );
+ }
+
+ if ( action === 'lostpassword' ) {
+ headerText = translate( 'Forgot your password?' );
+ }
+
+ if ( oauth2Client ) {
+ if ( isWCCOM ) {
+ if ( wccomFrom === 'cart' ) {
+ headerText = translate( 'Log in with a WordPress.com account' );
+ } else if ( twoFactorEnabled ) {
+ headerText = translate( 'Authenticate your login' );
+ } else if ( currentQuery.lostpassword_flow ) {
+ headerText = translate( 'Log in to your account' );
+ } else if ( showContinueAsUser ) {
+ headerText = (
+ <>
+ { wccomFrom === 'nux'
+ ? translate( 'Get started in minutes' )
+ : translate( 'Log in to your account' ) }
+
+ );
+ }
+ headerText = translate( 'Log in to your account' );
+ }
+
+ if ( isJetpackCloudOAuth2Client( oauth2Client ) ) {
+ headerText = translate( 'Howdy! Log in to Jetpack.com with your WordPress.com account.' );
+ }
+
+ if ( isA4AOAuth2Client( oauth2Client ) ) {
+ headerText = translate(
+ 'Howdy! Log in to Automattic for Agencies with your WordPress.com{{nbsp/}}account.',
+ {
+ components: { nbsp: <> },
+ comment: 'The {{nbsp/}} is a non-breaking space',
+ }
+ );
+ }
+
+ if ( isPartnerPortalOAuth2Client( oauth2Client ) ) {
+ if ( document.location.search?.includes( 'wpcloud' ) ) {
+ headerText = translate( 'Log in to WP Cloud with WordPress.com' );
+ } else if ( document.location.search?.includes( 'jetpack' ) ) {
+ headerText = translate(
+ 'Howdy! Log into the Jetpack Partner Portal with your WordPress.com account.'
+ );
+ } else {
+ headerText = translate(
+ 'Howdy! Log into the Automattic Partner Portal with your WordPress.com account.'
+ );
+ }
+ }
+
+ if ( isCrowdsignalOAuth2Client( oauth2Client ) ) {
+ headerText = translate( 'Sign in to %(clientTitle)s', {
+ args: {
+ clientTitle: oauth2Client.title,
+ },
+ } );
+ }
+
+ if ( isGravPoweredClient ) {
+ headerText = translate( 'Login to %(clientTitle)s', {
+ args: { clientTitle: oauth2Client.title },
+ } );
+ }
+
+ if ( isBlazeProOAuth2Client( oauth2Client ) ) {
+ headerText = translate( 'Log in to your Blaze Pro account' );
+ }
+ }
+
+ if ( isWooJPC ) {
+ const isLostPasswordFlow = currentQuery.lostpassword_flow === 'true';
+ switch ( true ) {
+ case isLostPasswordFlow:
+ headerText = translate( "You've got mail" );
+ case twoFactorEnabled:
+ headerText = translate( 'Authenticate your login' );
+ default:
+ headerText = translate( 'Log in to your account' );
+ }
+ }
+
+ if ( isFromMigrationPlugin ) {
+ headerText = translate( 'Log in to your account' );
+ }
+
+ if ( isJetpack && ! isFromAutomatticForAgenciesPlugin ) {
+ const isJetpackMagicLinkSignUpFlow = config.isEnabled( 'jetpack/magic-link-signup' );
+ headerText = isJetpackMagicLinkSignUpFlow
+ ? translate(
+ 'Log in or create a WordPress.com account to supercharge your site with powerful growth, performance, and security tools.'
+ )
+ : translate( 'Log in or create a WordPress.com account to set up Jetpack' );
+ }
+
+ if ( isFromAkismet ) {
+ headerText = translate( 'Log in to Akismet with WordPress.com' );
+ }
+
+ if ( isFromAutomatticForAgenciesPlugin ) {
+ headerText = translate( 'Log in to Automattic for Agencies' );
+ }
+
+ return headerText;
+}
+
+export function LoginHeader( {
+ action,
+ currentQuery,
+ fromSite,
+ isFromAkismet,
+ isFromMigrationPlugin,
+ isFromAutomatticForAgenciesPlugin,
+ isGravPoweredClient,
+ isGravPoweredLoginPage,
+ isJetpack,
+ isManualRenewalImmediateLoginAttempt,
+ isSocialFirst,
+ isWhiteLogin,
+ isWCCOM,
+ isBlazePro,
+ linkingSocialService,
+ oauth2Client,
+ socialConnect,
+ twoStepNonce,
+ wccomFrom,
+ isWooJPC,
+ twoFactorAuthType,
+ twoFactorEnabled,
+ initialQuery,
+ getSignupLinkComponent,
+ showContinueAsUser,
+}: LoginHeaderProps ) {
+ const translate = useTranslate();
+
+ const headerText = getHeaderText(
+ isSocialFirst,
+ twoFactorAuthType,
+ isManualRenewalImmediateLoginAttempt,
+ socialConnect,
+ linkingSocialService,
+ action,
+ oauth2Client,
+ isWooJPC,
+ isFromMigrationPlugin,
+ isJetpack,
+ isWCCOM,
+ isFromAkismet,
+ isFromAutomatticForAgenciesPlugin,
+ isGravPoweredClient,
+ wccomFrom,
+ twoFactorEnabled,
+ currentQuery,
+ translate,
+ showContinueAsUser,
+ twoStepNonce
+ );
+
+ let preHeader = null;
+ let header = null;
+ let postHeader = null;
+ const signupLink = getSignupLinkComponent();
+
+ if ( action === 'lostpassword' ) {
+ header =
{ headerText }
;
+ postHeader = (
+
+ { translate(
+ 'It happens to the best of us. Enter the email address associated with your WordPress.com account and we’ll send you a link to reset your password.'
+ ) }
+ { isWooJPC && (
+
+
+ { translate( 'Don’t have an account? {{signupLink}}Sign up{{/signupLink}}', {
+ components: {
+ signupLink,
+ },
+ } ) }
+
+ ) }
+
+ );
+ if ( isBlazePro ) {
+ postHeader = (
+
+ { translate(
+ 'It happens to the best of us. Enter the email address associated with your Blaze Pro account and we’ll send you a link to reset your password.'
+ ) }
+
+ { translate(
+ "Your password reset confirmation is on its way to your email address – please check your junk folder if it's not in your inbox! Once you've reset your password, head back to this page to log in to your account."
+ ) }
+
+ );
+ }
+ }
+
+ if ( isJetpackCloudOAuth2Client( oauth2Client ) || isA4AOAuth2Client( oauth2Client ) ) {
+ // If users arrived here from the lost password flow, show them a specific message about it
+ postHeader = currentQuery.lostpassword_flow && (
+
+ { translate(
+ 'Check your e-mail address linked to the account for the confirmation link, including the spam or junk folder.'
+ ) }
+
+ { isFromGravatar3rdPartyApp || isFromGravatarQuickEditor || isGravatarFlowWithEmail
+ ? translate( 'Please log in with your email and password.' )
+ : translate(
+ 'If you prefer logging in with a password, or a social media account, choose below:'
+ ) }
+
;
+
+ subtitle = translate(
+ "Your password reset confirmation is on its way to your email address – please check your junk folder if it's not in your inbox! Once you've reset your password, head back to this page to log in to your account."
+ );
+ break;
+ case isTwoFactorAuthFlow:
+ header =
{ headerText }
;
+ break;
+ default:
+ header =
{ headerText }
;
+ subtitle = translate(
+ 'To access all of the features and functionality %(pluginName)s, you’ll first need to connect your store to a WordPress.com account. Log in now, or {{signupLink}}create a new account{{/signupLink}}. For more information, please {{doc}}review our documentation{{/doc}}.',
+ {
+ components: {
+ signupLink,
+ br: ,
+ doc: (
+
+ ),
+ },
+ args: { pluginName },
+ }
+ );
+ }
+ preHeader = null;
+ postHeader =
;
+ } else if ( fromSite ) {
+ // if redirected from Calypso URL with a site slug, offer a link to that site's frontend
+ postHeader = ;
+ }
+ if ( isFromAutomatticForAgenciesPlugin ) {
+ preHeader = (
+
+ );
+ }
+
+ return (
+