Refactor account#getUserSubscriptionData to return an array of subscr…

…iptions, and the background handler to return the highest tier subscription

app/panel/components/HeaderMenu.jsx

@@ -243,7 +243,7 @@ class HeaderMenu extends React.Component {
 						</li>
 						<li className={optionClasses} onClick={this.clickSubscriber}>
 							<div>
-								{/* Upselling plus for all users who are not premium subscribers */}
+								{/* Show premium icon to premium users and plus icon to basic and plus users */}
 								{!subscriptionsPremium && (
 									<svg className={iconClasses} width="84" height="77" viewBox="0 0 84 77">
 										<g className="about-icon" fill="none">

src/background.js

@@ -823,20 +823,15 @@ function onMessageHandler(request, sender, callback) {
 	}
 	if (name === 'account.getUserSubscriptionData') {
 		account.getUserSubscriptionData()
-			.then((customer) => {
-				// TODO temporary fix to handle multiple subscriptions
-				let sub = customer.subscriptions;
-				if (!Array.isArray(sub)) {
-					sub = [sub];
-				}
+			.then((subscriptions) => {
+				// Return highest tier subscription from array
+				const premiumSubscription = subscriptions.find(subscription => subscription.productName.includes('Ghostery Premium'));
+				if (premiumSubscription) callback({ premiumSubscription });
 
-				let subscriptionData = sub.find(subscription => subscription.productName.includes('Ghostery Premium'));
-				if (subscriptionData) {
-					callback({ subscriptionData });
-				}
+				const plusSubscription = subscriptions.find(subscription => subscription.productName.includes('Ghostery Plus'));
+				if (plusSubscription) callback({ plusSubscription });
 
-				subscriptionData = sub.find(subscription => subscription.productName.includes('Ghostery Plus'));
-				callback({ subscriptionData });
+				callback({});
 			})
 			.catch((err) => {
 				log('Error getting user subscription data:', err);

src/classes/Account.js

@@ -158,6 +158,9 @@ class Account {
 			})
 	)
 
+	/**
+	 * @return {array}	All subscriptions the user has, empty if none
+	*/
 	getUserSubscriptionData = () => (
 		this._getUserID()
 			.then(userID => api.get('stripe/customers', userID, 'cards,subscriptions'))
@@ -170,17 +173,20 @@ class Account {
 					sub = [sub];
 				}
 
-				// Display premium info if user has both premium and plus subscriptions
+				const subscriptions = [];
+
 				const premiumSubscription = sub.find(subscription => subscription.productName.includes('Ghostery Premium'));
 				if (premiumSubscription) {
 					this._setSubscriptionData(premiumSubscription);
+					subscriptions.push(premiumSubscription);
 				}
 
 				const plusSubscription = sub.find(subscription => subscription.productName.includes('Ghostery Plus'));
 				if (plusSubscription) {
+					subscriptions.push(plusSubscription);
 					this._setSubscriptionData(plusSubscription);
 				}
-				return customer;
+				return subscriptions;
 			})
 	)