Merge pull request #2453 from Automattic/add/plans-upgrade-button-test

Plans: Add a/b test with 'upgrade' button in the sidebar
Automattic · Jan 18, 2016 · d2beeb2 · d2beeb2
2 parents aae43c0 + 1f74785
commit d2beeb2
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 3 deletions.
diff --git a/client/lib/abtest/active-tests.js b/client/lib/abtest/active-tests.js
@@ -61,4 +61,12 @@ module.exports = {
 		},
 		defaultVariation: 'yearly'
 	},
+	plansUpgradeButton: {
+		datestamp: '20160118',
+		variations: {
+			original: 50,
+			button: 50
+		},
+		defaultVariation: 'original'
+	}
 };
diff --git a/client/my-sites/sidebar/sidebar.jsx b/client/my-sites/sidebar/sidebar.jsx
@@ -326,10 +326,18 @@ module.exports = React.createClass( {
 			linkClass += ' is-paid-plan';
 		}
 
-		let planName = site.plan.product_name_short;
+		let planName = site.plan.product_name_short,
+			labelClass = 'plan-name';
+
+		if ( abtest( 'plansUpgradeButton' ) === 'button' && productsValues.isFreePlan( site.plan ) ) {
+			labelClass = 'add-new';
+			planName = 'Upgrade'; // TODO: translate this string if the test is removed
+		}
 
 		if ( productsValues.isFreeTrial( site.plan ) ) {
-			planName = this.translate( 'Trial' );
+			planName = this.translate( 'Trial', {
+				context: 'Label in the sidebar indicating that the user is on the free trial for a plan.'
+			} );
 		}
 
 		return (
@@ -338,7 +346,7 @@ module.exports = React.createClass( {
 					<Gridicon icon="clipboard" size={ 24 } />
 					<span className="menu-link-text">{ this.translate( 'Plan', { context: 'noun' } ) }</span>
 				</a>
-				<a href={ planLink } className="plan-name" onClick={ this.trackUpgradeClick }>{ planName }</a>
+				<a href={ planLink } className={ labelClass } onClick={ this.trackUpgradeClick }>{ planName }</a>
 			</li>
 		);
 	},