From 1f74785d5afc6543930eadfbe0bd7d93ec91e7da Mon Sep 17 00:00:00 2001
From: Drew Blaisdell <drew.blaisdell@gmail.com>
Date: Thu, 14 Jan 2016 15:44:54 -0800
Subject: [PATCH] Plans: Add a/b test with 'upgrade' button in the sidebar

Fixes #2382.
---
 client/lib/abtest/active-tests.js   |  8 ++++++++
 client/my-sites/sidebar/sidebar.jsx | 14 +++++++++++---
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/client/lib/abtest/active-tests.js b/client/lib/abtest/active-tests.js
index 9bb3dea047ab01..184f5009277a16 100644
--- 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
index e91d3269f121b5..6cb55885cd5ff8 100644
--- 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>
 		);
 	},