GH-1895, GH-1896, and GH-1899: Premium promo ux update and telemetry

app/hub/Views/HomeView/HomeViewContainer.jsx

@@ -76,7 +76,7 @@ class HomeViewContainer extends Component {
 				window.open(`https://checkout.${DOMAIN}.com/plus?utm_source=gbe&utm_campaign=intro_hub`, '_blank');
 				break;
 			case 'premium':
-				window.open('https://ghostery.com/thanks-for-downloading-midnight', '_blank');
+				window.open('https://ghostery.com/thanks-for-downloading-midnight?utm_source=gbe&utm_campaign=intro_hub', '_blank');
 				break;
 			case 'basic':
 			default:
@@ -139,6 +139,7 @@ class HomeViewContainer extends Component {
 			<div className="full-height">
 				<PremiumPromoModal
 					show={showPromoModal}
+					isPlus={isPlus}
 					location="hub"
 					handleKeepBasicClick={this._handleKeepBasicClick}
 					handleGetPlusClick={this._handleGetPlusClick}

app/panel/components/Panel.jsx

@@ -238,7 +238,7 @@ class Panel extends React.Component {
 	_handlePromoTryMidnightClick = () => {
 		this.props.actions.togglePromoModal();
 
-		const url = 'https://ghostery.com/thanks-for-downloading-midnight';
+		const url = 'https://ghostery.com/thanks-for-downloading-midnight?utm_source=gbe&utm_campaign=in_app';
 		sendMessage('openNewTab', {
 			url,
 			become_active: true,
@@ -315,6 +315,17 @@ class Panel extends React.Component {
 		return loggedIn && (user && user.scopes && user.scopes.includes('subscriptions:premium'));
 	}
 
+	/**
+	 * @returns {bool}
+	 * @private
+	 * Is the user a Plus subscriber?
+	 */
+	_plusSubscriber = () => {
+		const { loggedIn, user } = this.props;
+
+		return loggedIn && (user && user.subscriptionsPlus);
+	}
+
 	/**
 	 * @returns {JSX}
 	 * @private
@@ -325,9 +336,12 @@ class Panel extends React.Component {
 
 		sendMessage('promoModals.sawPremiumPromo', {});
 
+		const isPlus = this._plusSubscriber();
+
 		return (
 			<PremiumPromoModal
 				show
+				isPlus={isPlus}
 				location="panel"
 				handleGoAwayClick={this._handlePromoGoAwayClick}
 				handleGetPlusClick={this._handlePromoGetPlusClick}

app/shared-components/PremiumPromoModal/PremiumPromoModal.jsx

@@ -26,6 +26,7 @@ const PremiumPromoModal = (props) => {
 	const {
 		show,
 		location,
+		isPlus,
 		handleTryMidnightClick,
 		handleGetPlusClick,
 		handleKeepBasicClick,
@@ -97,9 +98,11 @@ const PremiumPromoModal = (props) => {
 						</div>
 					</div>
 					<div className="PremiumPromoModal__text-link-container">
-						<div onClick={handleGetPlusClick} className="PremiumPromoModal__text-link">
-							{t('support_ghostery_for_2_instead')}
-						</div>
+						{!isPlus && (
+							<div onClick={handleGetPlusClick} className="PremiumPromoModal__text-link">
+								{t('support_ghostery_for_2_instead')}
+							</div>
+						)}
 						{isInHub && (
 							<div onClick={handleKeepBasicClick} className="PremiumPromoModal__text-link">
 								{t('no_thanks_continue_with_basic')}
@@ -122,6 +125,7 @@ const PremiumPromoModal = (props) => {
 PremiumPromoModal.propTypes = {
 	show: PropTypes.bool.isRequired,
 	location: PropTypes.string.isRequired,
+	isPlus: PropTypes.bool.isRequired,
 	handleTryMidnightClick: PropTypes.func.isRequired,
 	handleGetPlusClick: PropTypes.func.isRequired,
 	handleKeepBasicClick: PropTypes.func,

app/shared-components/PremiumPromoModal/PremiumPromoModal.scss

@@ -151,7 +151,7 @@ $condensed-font-family: Roboto Condensed, "Open Sans", "Helvetica Neue", Helveti
 
 .PremiumPromoModal__text-link-container {
 	display: flex;
-	justify-content: space-between;
+	justify-content: space-evenly;
 }
 
 .PremiumPromoModal__text-link {

manifest.json

@@ -6,6 +6,8 @@
 			"strict_min_version": "52.0"
 		}
 	},
+  	"debug": true,
+  	"log": true,
 	"author": "Ghostery",
 	"name": "__MSG_name__",
 	"short_name": "Ghostery",