From 1e11edf9f524eeb2b5cdaa8b22ff976cddd1d544 Mon Sep 17 00:00:00 2001 From: Justin Shreve Date: Wed, 7 Aug 2019 11:29:09 -0400 Subject: [PATCH] Code cleanup --- client/blocks/login/login-form.jsx | 1 - client/blocks/signup-form/index.jsx | 1 - .../woocommerce-connect-cart-header/index.js | 15 ++++++++---- .../style.scss | 23 +++++++++---------- client/layout/index.jsx | 1 - client/layout/logged-out.jsx | 1 - client/lib/oauth2-clients.js | 2 +- client/lib/paths/login/test/index.js | 6 +++++ client/login/wp-login/login-links.jsx | 1 - client/signup/style.scss | 2 +- server/pages/index.js | 1 - 11 files changed, 29 insertions(+), 25 deletions(-) diff --git a/client/blocks/login/login-form.jsx b/client/blocks/login/login-form.jsx index 83c3ae233e171..5e1e99fdaa834 100644 --- a/client/blocks/login/login-form.jsx +++ b/client/blocks/login/login-form.jsx @@ -435,7 +435,6 @@ export class LoginForm extends Component { if ( config.isEnabled( 'woocommerce/onboarding-oauth' ) && - oauth2Client && isWooOAuth2Client( oauth2Client ) && wccomFrom ) { diff --git a/client/blocks/signup-form/index.jsx b/client/blocks/signup-form/index.jsx index 1f206a42a8964..c1b02c02aeec1 100644 --- a/client/blocks/signup-form/index.jsx +++ b/client/blocks/signup-form/index.jsx @@ -871,7 +871,6 @@ class SignupForm extends Component { ( config.isEnabled( 'jetpack/connect/woocommerce' ) && this.props.isJetpackWooCommerceFlow ) || ( config.isEnabled( 'woocommerce/onboarding-oauth' ) && - this.props.oauth2Client && isWooOAuth2Client( this.props.oauth2Client ) && this.props.wccomFrom ) ) { diff --git a/client/extensions/woocommerce/components/woocommerce-connect-cart-header/index.js b/client/extensions/woocommerce/components/woocommerce-connect-cart-header/index.js index ecf3a856594e3..7aa7bd866b6c8 100644 --- a/client/extensions/woocommerce/components/woocommerce-connect-cart-header/index.js +++ b/client/extensions/woocommerce/components/woocommerce-connect-cart-header/index.js @@ -4,10 +4,11 @@ * External dependencies */ import React from 'react'; +import { localize } from 'i18n-calypso'; import './style.scss'; -const WooCommercConnectCartHeader = () => { +const WooCommercConnectCartHeader = ( { translate } ) => { return (
@@ -45,7 +46,9 @@ const WooCommercConnectCartHeader = () => {
- Cart + + { translate( 'Cart' ) } +
@@ -54,7 +57,9 @@ const WooCommercConnectCartHeader = () => { 2
- Payment + + { translate( 'Payment' ) } +
@@ -64,7 +69,7 @@ const WooCommercConnectCartHeader = () => {
- Installation + { translate( 'Installation' ) }
@@ -74,4 +79,4 @@ const WooCommercConnectCartHeader = () => { ); }; -export default WooCommercConnectCartHeader; +export default localize( WooCommercConnectCartHeader ); diff --git a/client/extensions/woocommerce/components/woocommerce-connect-cart-header/style.scss b/client/extensions/woocommerce/components/woocommerce-connect-cart-header/style.scss index 60e9135f453cb..59c48e5999108 100644 --- a/client/extensions/woocommerce/components/woocommerce-connect-cart-header/style.scss +++ b/client/extensions/woocommerce/components/woocommerce-connect-cart-header/style.scss @@ -1,11 +1,10 @@ -/* @todo color variables */ .woocommerce-connect-cart-header { height: 56px; - border-bottom: 1px solid #e1e2e2; + border-bottom: 1px solid var( --color-gray-50 ); display: flex; align-items: center; justify-content: center; - background: #fff; + background: var( --color-white ); position: absolute; left: 0; top: 0; @@ -67,15 +66,15 @@ height: 24px; min-width: 24px; margin-right: 12px; - background: #e1e2e2; - color: #50575d; + background: var( --color-gray-50 ); + color: var( --color-gray-600 ); border-radius: 50%; } .woocommerce-connect-cart-header__stepper-step.is-active .woocommerce-connect-cart-header__stepper-step-icon, .woocommerce-connect-cart-header__stepper-step.is-complete .woocommerce-connect-cart-header__stepper-step-icon { - background: #673d99; - color: #fff; + background: var( --color-hot-purple-600 ); + color: var( --color-white ); } .woocommerce-connect-cart-header__stepper-step.is-complete .woocommerce-connect-cart-header__stepper-step-number { @@ -91,7 +90,7 @@ } .woocommerce-connect-cart-header__stepper-step .woocommerce-connect-cart-header__stepper-step-label { - color: #1a1a1a; + color: var( --color-gray-900 ); line-height: 24px; font-size: 16px; @@ -102,15 +101,15 @@ } .woocommerce-connect-cart-header__stepper-step .woocommerce-connect-cart-header__stepper-step-label { - color: #2b2d2f; + color: var( --color-gray-800 ); } .woocommerce-connect-cart-header__stepper-step.is-complete .woocommerce-connect-cart-header__stepper-step-label { - color: #1a1a1a; + color: var( --color-gray-900 ); } .woocommerce-connect-cart-header__stepper-step-divider { align-self: flex-start; flex-grow: 1; - border-bottom: 1px solid #e1e2e2; + border-bottom: 1px solid var( --color-gray-50 ); margin-top: 20px; -} \ No newline at end of file +} diff --git a/client/layout/index.jsx b/client/layout/index.jsx index 775f9cb1fa493..62b73e6530993 100644 --- a/client/layout/index.jsx +++ b/client/layout/index.jsx @@ -128,7 +128,6 @@ class Layout extends Component { { 'is-wccom-oauth-flow': config.isEnabled( 'woocommerce/onboarding-oauth' ) && - this.props.oauth2Client && isWooOAuth2Client( this.props.oauth2Client ) && this.props.wccomFrom, } diff --git a/client/layout/logged-out.jsx b/client/layout/logged-out.jsx index 9ed1894642ab9..ab85ec8cb3ed1 100644 --- a/client/layout/logged-out.jsx +++ b/client/layout/logged-out.jsx @@ -64,7 +64,6 @@ const LayoutLoggedOut = ( { config.isEnabled( 'jetpack/connect/woocommerce' ) && isJetpackWooCommerceFlow, 'is-wccom-oauth-flow': config.isEnabled( 'woocommerce/onboarding-oauth' ) && - useOAuth2Layout && isWooOAuth2Client( oauth2Client ) && wccomFrom, }; diff --git a/client/lib/oauth2-clients.js b/client/lib/oauth2-clients.js index 0dd090a20a9bc..4e036b55d2d2a 100644 --- a/client/lib/oauth2-clients.js +++ b/client/lib/oauth2-clients.js @@ -11,5 +11,5 @@ export const isCrowdsignalOAuth2Client = oauth2Client => { }; export const isWooOAuth2Client = oauth2Client => { - return includes( [ 50019, 50915, 50916 ], oauth2Client.id ); + return oauth2Client && includes( [ 50019, 50915, 50916 ], oauth2Client.id ); }; diff --git a/client/lib/paths/login/test/index.js b/client/lib/paths/login/test/index.js index b85023222273f..d1382bd66e038 100644 --- a/client/lib/paths/login/test/index.js +++ b/client/lib/paths/login/test/index.js @@ -81,5 +81,11 @@ describe( 'index', () => { expect( url ).to.equal( '/log-in/jetpack?from=woocommerce-setup-wizard' ); } ); + + test( 'should return the login url with WooCommerce.com handler', () => { + const url = login( { isNative: true, oauth2ClientId: 12345, wccomFrom: 'testing' } ); + + expect( url ).to.equal( '/log-in?client_id=12345&wccom-from=testing' ); + } ); } ); } ); diff --git a/client/login/wp-login/login-links.jsx b/client/login/wp-login/login-links.jsx index 0fc4da7263122..09d83e9d4c106 100644 --- a/client/login/wp-login/login-links.jsx +++ b/client/login/wp-login/login-links.jsx @@ -173,7 +173,6 @@ export class LoginLinks extends React.Component { // @todo Implement a muriel version of the email login links for the WooCommerce onboarding flows if ( config.isEnabled( 'woocommerce/onboarding-oauth' ) && - this.props.oauth2Client && isWooOAuth2Client( this.props.oauth2Client ) && this.props.wccomFrom ) { diff --git a/client/signup/style.scss b/client/signup/style.scss index fcc01b4f91493..28a3dfd064d83 100644 --- a/client/signup/style.scss +++ b/client/signup/style.scss @@ -234,7 +234,7 @@ body.is-section-signup .layout.gravatar .formatted-header { display: block; height: 56px; border-bottom: 1px solid var( --color-woocommerce-header-border ); - background: #fff; + background: var( --color-white ); svg { margin-top: 15px; diff --git a/server/pages/index.js b/server/pages/index.js index 2bc85bc4e3139..75b9050dd944e 100644 --- a/server/pages/index.js +++ b/server/pages/index.js @@ -307,7 +307,6 @@ function getDefaultContext( request ) { config.isEnabled( 'woocommerce/onboarding-oauth' ) && ( 'login' === request.context.sectionName || 'signup' === request.context.sectionName ) && request.query[ 'wccom-from' ] && - oauthClientId && isWooOAuth2Client( { id: parseInt( oauthClientId ) } ); const context = Object.assign( {}, request.context, {