Merge pull request #1942 from CodeNow/SAN-5495-update-ctas

Adding team CTA
CodeNow · Dec 14, 2016 · 6bb1e86 · 6bb1e86
2 parents 3d083d8 + be9adba
commit 6bb1e86
Show file tree

Hide file tree

Showing 5 changed files with 109 additions and 6 deletions.
diff --git a/client/directives/accountsSelect/directiveAccountsSelect.js b/client/directives/accountsSelect/directiveAccountsSelect.js
@@ -13,6 +13,7 @@ function accountsSelect (
   $state,
   $timeout,
   configEnvironment,
+  demoFlowService,
   errs,
   eventTracking,
   keypather,
@@ -35,6 +36,7 @@ function accountsSelect (
       $scope.popoverAccountMenu = {
         actions: {
           clickedChangeTeam: eventTracking.clickedChangeTeam,
+          shouldShowTeamCTA: demoFlowService.shouldShowTeamCTA.bind(demoFlowService),
           getHeight: function (view) {
             // if no containers '143px'
             if ($rootScope.featureFlags.isolationSetUp && view === 1) {
@@ -106,7 +108,7 @@ function accountsSelect (
             return trialRemaining;
           }
         }
-        if ($rootScope.featureFlags.teamCTA) {
+        if (demoFlowService.shouldShowTeamCTA()) {
           return '•';
         }
         return '';
@@ -117,7 +119,7 @@ function accountsSelect (
           return {};
         }
         var showBadge = currentOrg.poppa.isInTrial() && !currentOrg.poppa.attrs.hasPaymentMethod && currentOrg.poppa.trialDaysRemaining() <= 3;
-        if ($rootScope.featureFlags.teamCTA) {
+        if (demoFlowService.shouldShowTeamCTA()) {
           showBadge = true;
         }
         return {

diff --git a/client/directives/accountsSelect/popoverAccountMenu/viewPopoverAccountMenu.jade b/client/directives/accountsSelect/popoverAccountMenu/viewPopoverAccountMenu.jade
@@ -1,8 +1,8 @@
 .popover.menu.popover-account-menu.right(
   ng-class = "{\
     'in': active,\
-    'lg': $root.featureFlags.teamCTA\
-  }"
+    'lg': actions.shouldShowTeamCTA()\
+   }"
   style = "left: 68px; transform-origin: 0 0; top: 18px"
 )
   .arrow.js-animate(
@@ -106,7 +106,7 @@
                 ng-click = "actions.logout();"
               ) Sign Out
         .grid-block.vertical.align-center.justify-center.popover-content.team-cta(
-          ng-if = "$root.featureFlags.teamCTA"
+          ng-if = "actions.shouldShowTeamCTA()"
         )
           img.img.margin-bottom-sm(
             height = "105"

diff --git a/client/services/demoFlowService.js b/client/services/demoFlowService.js
@@ -10,6 +10,7 @@ function demoFlowService(
   $q,
   currentOrg,
   defaultContainerUrl,
+  featureFlags,
   keypather,
   patchOrgMetadata
 ) {
@@ -88,6 +89,10 @@ function demoFlowService(
     }
   });
 
+  function shouldShowTeamCTA () {
+    return featureFlags.flags.teamCTA && currentOrg.isPersonalAccount() && !isInDemoFlow();
+  }
+
   return {
     checkStatusOnInstance: checkStatusOnInstance,
     endDemoFlow: endDemoFlow,
@@ -99,6 +104,7 @@ function demoFlowService(
     isUsingDemoRepo: isUsingDemoRepo,
     resetFlags: resetFlags,
     setIsUsingDemoRepo: setIsUsingDemoRepo,
-    setItem: setItem
+    setItem: setItem,
+    shouldShowTeamCTA: shouldShowTeamCTA
   };
 }
diff --git a/test/unit/directives/directiveAccountsSelect.unit.js b/test/unit/directives/directiveAccountsSelect.unit.js
@@ -9,6 +9,7 @@ describe('directiveAccountsSelect'.bold.underline.blue, function() {
   var ctx;
   var keypather;
   var mockCurrentOrg;
+  var demoFlowService;
 
   beforeEach(function () {
     mockCurrentOrg = {
@@ -23,6 +24,9 @@ describe('directiveAccountsSelect'.bold.underline.blue, function() {
         }
       }
     };
+    demoFlowService = {
+      shouldShowTeamCTA: sinon.stub().returns(false)
+    };
     ctx = {};
     ctx.fakeuser = {
       attrs: angular.copy(apiMocks.user),
@@ -83,6 +87,9 @@ describe('directiveAccountsSelect'.bold.underline.blue, function() {
         instanceName: 'instanceName'
       });
       $provide.value('currentOrg', mockCurrentOrg);
+      $provide.service('demoFlowService', function () {
+        return demoFlowService;
+      });
     });
     angular.mock.inject(function(
       $compile,
@@ -177,6 +184,12 @@ describe('directiveAccountsSelect'.bold.underline.blue, function() {
           mockCurrentOrg.poppa.attrs.hasPaymentMethod = true;
           expect($elScope.getBadgeCount()).to.equal('');
         });
+
+        it('should return nothing if payment method is set', function () {
+          mockCurrentOrg.poppa.attrs.hasPaymentMethod = true;
+          demoFlowService.shouldShowTeamCTA.returns(true);
+          expect($elScope.getBadgeCount()).to.equal('•');
+        });
       });
 
       describe('when active', function () {
@@ -213,6 +226,15 @@ describe('directiveAccountsSelect'.bold.underline.blue, function() {
           'badge-red': false
         });
       });
+
+      it('should return true if it should show the team CTA', function () {
+        demoFlowService.shouldShowTeamCTA.returns(true);
+        expect($elScope.getClasses()).to.deep.equal({
+          badge: true,
+          'badge-red': true
+        });
+      });
+
     });
   });
 });
diff --git a/test/unit/services/demoFlowService.unit.js b/test/unit/services/demoFlowService.unit.js
@@ -0,0 +1,73 @@
+'use strict';
+
+var featureFlags;
+var mockOrg;
+var $rootScope;
+
+describe('demoFlowService'.bold.underline.blue, function () {
+  var demoFlowService;
+  function initState () {
+    angular.mock.module('app');
+    angular.mock.module(function($provide) {
+      $provide.value('currentOrg', mockOrg);
+      $provide.factory('featureFlags', function () {
+        return {
+          flags: featureFlags
+        };
+      });
+    });
+    angular.mock.inject(function (
+      _demoFlowService_,
+      _$rootScope_
+      ) {
+      $rootScope = _$rootScope_;
+      demoFlowService = _demoFlowService_;
+    });
+    $rootScope.featureFlags = featureFlags;
+  }
+  beforeEach(function() {
+    mockOrg = {
+      isPersonalAccount: sinon.stub().returns(true),
+      poppa: {
+        attrs: {
+          metadata: {
+            hasAha: false,
+            hasCompletedDemo: true
+          }
+        }
+      }
+    };
+    featureFlags = {
+      teamCTA: true
+    };
+  });
+  describe('#shouldShowTeamCTA', function () {
+    it('should return false if flag is off', function() {
+      featureFlags.teamCTA = false;
+      initState();
+      var result = demoFlowService.shouldShowTeamCTA();
+      expect(result).to.equal(false);
+    });
+
+    it('should return false if the current org is not a personal account', function() {
+      mockOrg.isPersonalAccount.returns(false);
+      initState();
+      var result = demoFlowService.shouldShowTeamCTA();
+      expect(result).to.equal(false);
+    });
+
+    it('should return false if the current org has not completed the demo', function() {
+      mockOrg.poppa.attrs.metadata.hasAha = true;
+      mockOrg.poppa.attrs.metadata.hasCompletedDemo = false;
+      initState();
+      var result = demoFlowService.shouldShowTeamCTA();
+      expect(result).to.equal(false);
+    });
+
+    it('should return true if the current org is a peronal account and has completed the demo flow', function() {
+      initState();
+      var result = demoFlowService.shouldShowTeamCTA();
+      expect(result).to.equal(true);
+    });
+  });
+});