Update min selectable number for subscription buy process

Deduct guest members from min selectable number if ultimate plan is
selected

Changelog: fixed
EE: true

ee/app/assets/javascripts/subscriptions/new/constants.js

 export const TAX_RATE = 0;
 
 export const NEW_GROUP = 'new_group';
+export const ULTIMATE = 'ultimate';

ee/app/assets/javascripts/subscriptions/new/store/actions.js

@@ -8,8 +8,9 @@ import { sprintf, s__ } from '~/locale';
 import defaultClient from '../graphql';
 import * as types from './mutation_types';
 
-export const updateSelectedPlan = ({ commit }, selectedPlan) => {
+export const updateSelectedPlan = ({ commit, getters }, selectedPlan) => {
   commit(types.UPDATE_SELECTED_PLAN, selectedPlan);
+  commit(types.UPDATE_NUMBER_OF_USERS, getters.selectedGroupUsers);
 };
 
 export const updateSelectedGroup = ({ commit, getters }, selectedGroup) => {

ee/app/assets/javascripts/subscriptions/new/store/getters.js

 import { s__ } from '~/locale';
-import { NEW_GROUP } from '../constants';
+import { NEW_GROUP, ULTIMATE } from '../constants';
 
 export const selectedPlanText = (state, getters) => getters.selectedPlanDetails.text;
 
@@ -9,6 +9,10 @@ export const selectedPlanPrice = (state, getters) =>
 export const selectedPlanDetails = (state) =>
   state.availablePlans.find((plan) => plan.value === state.selectedPlan);
 
+export const isUltimatePlan = (state, getters) => {
+  return getters.selectedPlanDetails?.code === ULTIMATE;
+};
+
 export const confirmOrderParams = (state, getters) => ({
   setup_for_company: state.isSetupForCompany,
   selected_group: getters.selectedGroupId,
@@ -65,6 +69,9 @@ export const isSelectedGroupPresent = (state, getters) => {
 export const selectedGroupUsers = (state, getters) => {
   if (!getters.isGroupSelected) {
     return 1;
+  } else if (getters.isSelectedGroupPresent && getters.isUltimatePlan) {
+    const selectedGroup = state.groupData.find((group) => group.value === state.selectedGroup);
+    return selectedGroup.numberOfUsers - selectedGroup.numberOfGuests;
   } else if (getters.isSelectedGroupPresent) {
     return state.groupData.find((group) => group.value === state.selectedGroup).numberOfUsers;
   }

ee/app/assets/javascripts/subscriptions/new/store/state.js

@@ -7,6 +7,7 @@ const parsePlanData = (planData) =>
     value: plan.id,
     text: capitalizeFirstCharacter(plan.name),
     pricePerUserPerYear: plan.price_per_year,
+    code: plan.code,
   }));
 
 const parseGroupData = (groupData) =>
@@ -14,6 +15,7 @@ const parseGroupData = (groupData) =>
     value: group.id,
     text: group.name,
     numberOfUsers: group.users,
+    numberOfGuests: group.guests,
   }));
 
 const determineSelectedPlan = (planId, plans) => {

ee/spec/frontend/subscriptions/new/store/actions_spec.js

@@ -34,12 +34,15 @@ describe('Subscriptions Actions', () => {
   });
 
   describe('updateSelectedPlan', () => {
-    it('updates the selected plan', async () => {
+    it('updates the selected plan and updates the number of users', async () => {
       await testAction(
         actions.updateSelectedPlan,
         'planId',
-        {},
-        [{ type: 'UPDATE_SELECTED_PLAN', payload: 'planId' }],
+        { selectedGroupUsers: 4 },
+        [
+          { type: 'UPDATE_SELECTED_PLAN', payload: 'planId' },
+          { type: 'UPDATE_NUMBER_OF_USERS', payload: 4 },
+        ],
         [],
       );
     });

ee/spec/frontend/subscriptions/new/store/getters_spec.js

@@ -41,6 +41,20 @@ describe('Subscriptions Getters', () => {
     });
   });
 
+  describe('isUltimatePlan', () => {
+    it('returns true if plan code is ultimate', () => {
+      expect(getters.isUltimatePlan(state, { selectedPlanDetails: { code: 'ultimate' } })).toBe(
+        true,
+      );
+    });
+
+    it('returns false if plan code is not ultimate', () => {
+      expect(getters.isUltimatePlan(state, { selectedPlanDetails: { code: 'not-ultimate' } })).toBe(
+        false,
+      );
+    });
+  });
+
   describe('endDate', () => {
     it('returns a date 1 year after the startDate', () => {
       expect(getters.endDate({ startDate: new Date('2020-01-07') })).toBe(
@@ -156,14 +170,23 @@ describe('Subscriptions Getters', () => {
       ).toBe(null);
     });
 
-    it('returns the number of users of the selected group when a group is selected', () => {
+    it('returns the number of users of the selected group when a group is selected and plan is not ultimate', () => {
       expect(
         getters.selectedGroupUsers(
-          { groupData: [{ numberOfUsers: 3, value: 123 }], selectedGroup: 123 },
-          { isGroupSelected: true, isSelectedGroupPresent: true },
+          { groupData: [{ numberOfUsers: 3, numberOfGuests: 1, value: 123 }], selectedGroup: 123 },
+          { isGroupSelected: true, isSelectedGroupPresent: true, isUltimatePlan: false },
         ),
       ).toBe(3);
     });
+
+    it('returns difference between the number of users and guests of the selected group if the selected plan is ultimate', () => {
+      expect(
+        getters.selectedGroupUsers(
+          { groupData: [{ numberOfUsers: 3, numberOfGuests: 1, value: 123 }], selectedGroup: 123 },
+          { isGroupSelected: true, isSelectedGroupPresent: true, isUltimatePlan: true },
+        ),
+      ).toBe(2);
+    });
   });
 
   describe('isSelectedGroupPresent', () => {

ee/spec/frontend/subscriptions/new/store/state_spec.js

@@ -10,8 +10,8 @@ describe('projectsSelector default state', () => {
   ];
 
   const groupData = [
-    { id: 132, name: 'My first group', users: 3 },
-    { id: 483, name: 'My second group', users: 12 },
+    { id: 132, name: 'My first group', users: 3, guests: 1 },
+    { id: 483, name: 'My second group', users: 12, guests: 0 },
   ];
 
   const initialData = {
@@ -34,8 +34,8 @@ describe('projectsSelector default state', () => {
   describe('availablePlans', () => {
     it('sets the availablePlans to the provided parsed availablePlans', () => {
       expect(state.availablePlans).toEqual([
-        { value: 'firstPlanId', text: 'Bronze Plan', pricePerUserPerYear: 48 },
-        { value: 'secondPlanId', text: 'Premium Plan', pricePerUserPerYear: 228 },
+        { value: 'firstPlanId', text: 'Bronze Plan', pricePerUserPerYear: 48, code: 'bronze' },
+        { value: 'secondPlanId', text: 'Premium Plan', pricePerUserPerYear: 228, code: 'premium' },
       ]);
     });
 
@@ -101,8 +101,8 @@ describe('projectsSelector default state', () => {
   describe('groupData', () => {
     it('sets the groupData to the provided parsed groupData', () => {
       expect(state.groupData).toEqual([
-        { value: 132, text: 'My first group', numberOfUsers: 3 },
-        { value: 483, text: 'My second group', numberOfUsers: 12 },
+        { value: 132, text: 'My first group', numberOfUsers: 3, numberOfGuests: 1 },
+        { value: 483, text: 'My second group', numberOfUsers: 12, numberOfGuests: 0 },
       ]);
     });