Merge branch 'dz/363439-remove-unnecessary-condition-on-billing' into 'master'

Remove canRenew condition from billing page

See merge request !101356



Merged-by: Diana Zubova <dzubova@gitlab.com>
Approved-by: Edgars Bralitis <ebralitis@gitlab.com>
Approved-by: Ammar Alakkad <aalakkad@gitlab.com>
Approved-by: Natalia Tepluhina <ntepluhina@gitlab.com>

ee/app/assets/javascripts/billings/constants.js

 export const TABLE_TYPE_DEFAULT = 'default';
 export const TABLE_TYPE_FREE = 'free';
 export const TABLE_TYPE_TRIAL = 'trial';
-
-export const DAYS_FOR_RENEWAL = 15;

ee/app/assets/javascripts/billings/subscriptions/components/subscription_table.vue

@@ -3,16 +3,10 @@ import { GlButton, GlCard, GlLoadingIcon } from '@gitlab/ui';
 import { escape } from 'lodash';
 import { mapActions, mapState, mapGetters } from 'vuex';
 import { removeTrialSuffix } from 'ee/billings/billings_util';
-import {
-  TABLE_TYPE_DEFAULT,
-  TABLE_TYPE_FREE,
-  TABLE_TYPE_TRIAL,
-  DAYS_FOR_RENEWAL,
-} from 'ee/billings/constants';
+import { TABLE_TYPE_DEFAULT, TABLE_TYPE_FREE, TABLE_TYPE_TRIAL } from 'ee/billings/constants';
 import ExtendReactivateTrialButton from 'ee/trials/extend_reactivate_trial/components/extend_reactivate_trial_button.vue';
 import createFlash from '~/flash';
 import axios from '~/lib/utils/axios_utils';
-import { getDayDifference } from '~/lib/utils/datetime/date_calculation_utility';
 import { s__ } from '~/locale';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { getSubscriptionData } from '../subscription_actions.customer.query.graphql';
@@ -78,14 +72,7 @@ export default {
     },
   },
   computed: {
-    ...mapState([
-      'isLoadingSubscription',
-      'hasErrorSubscription',
-      'plan',
-      'billing',
-      'tables',
-      'endpoint',
-    ]),
+    ...mapState(['isLoadingSubscription', 'hasErrorSubscription', 'plan', 'tables', 'endpoint']),
     ...mapGetters(['isFreePlan']),
     isSubscription() {
       return !this.isFreePlan;
@@ -105,15 +92,6 @@ export default {
     canRefreshSeats() {
       return this.glFeatures.refreshBillingsSeats;
     },
-    canRenew() {
-      const subscriptionEndDate = new Date(this.billing.subscriptionEndDate);
-      const todayDate = new Date();
-      return (
-        this.isSubscription &&
-        !this.plan.trial &&
-        DAYS_FOR_RENEWAL >= getDayDifference(todayDate, subscriptionEndDate)
-      );
-    },
     addSeatsButton() {
       return this.isSubscription && this.subscription?.canAddSeats
         ? createButtonProps(
@@ -124,7 +102,7 @@ export default {
         : null;
     },
     renewButton() {
-      return this.canRenew && this.subscription?.inRenewalPeriod
+      return this.subscription?.inRenewalPeriod
         ? createButtonProps(s__('SubscriptionTable|Renew'), this.planRenewHref, 'renew-button')
         : null;
     },

ee/spec/features/groups/billing_spec.rb

@@ -93,22 +93,6 @@ def subscription_table
             expect(page).to have_link("See usage", href: group_usage_quotas_path(group, anchor: 'seats-quota-tab'))
           end
         end
-
-        context 'when gitlab subscription has end date more than 15 days' do
-          before do
-            subscription.update!(end_date: Date.tomorrow + 15.days)
-          end
-
-          it 'does not display renew button' do
-            renew_url = "#{EE::SUBSCRIPTIONS_URL}/gitlab/namespaces/#{group.id}/renew"
-
-            visit group_billings_path(group)
-
-            within subscription_table do
-              expect(page).not_to have_link("Renew", href: renew_url)
-            end
-          end
-        end
       end
 
       context 'with disabled seats and review buttons' do

ee/spec/frontend/billings/subscriptions/components/subscription_table_spec.js

@@ -40,14 +40,19 @@ describe('SubscriptionTable component', () => {
   const findRefreshSeatsButton = () => wrapper.findByTestId('refresh-seats-button');
   const findSubscriptionHeader = () => wrapper.findByTestId('subscription-header');
 
-  const createComponentWithStore = async ({ props = {}, provide = {}, state = {} } = {}) => {
+  const createComponentWithStore = async ({
+    props = {},
+    provide = {},
+    state = {},
+    apolloMock = { subscription: { canAddSeats: true, inRenewalPeriod: true } },
+  } = {}) => {
     store = new Vuex.Store(initialStore());
     jest.spyOn(store, 'dispatch').mockImplementation();
     mockApollo = createMockApollo([
       [
         getSubscriptionData,
         jest.fn().mockResolvedValue({
-          data: { subscription: { canAddSeats: true, inRenewalPeriod: true } },
+          data: apolloMock,
         }),
       ],
     ]);
@@ -195,26 +200,23 @@ describe('SubscriptionTable component', () => {
 
   describe('Renew button', () => {
     describe.each`
-      planCode    | trial    | expected | testDescription
-      ${'silver'} | ${false} | ${true}  | ${'renders the button'}
-      ${'silver'} | ${true}  | ${false} | ${'does not render the button'}
-      ${null}     | ${false} | ${false} | ${'does not render the button'}
-      ${'free'}   | ${false} | ${false} | ${'does not render the button'}
+      planCode    | inRenewalPeriod | expected | testDescription
+      ${'silver'} | ${true}         | ${true}  | ${'renders the button'}
+      ${'silver'} | ${false}        | ${false} | ${'does not render the button'}
+      ${null}     | ${true}         | ${false} | ${'does not render the button'}
+      ${'free'}   | ${true}         | ${false} | ${'does not render the button'}
     `(
-      'given a plan with state: planCode = $planCode, trial = $trial',
-      ({ planCode, trial, expected, testDescription }) => {
+      'given a plan with state: planCode = $planCode, inRenewalPeriod = $inRenewalPeriod',
+      ({ planCode, inRenewalPeriod, expected, testDescription }) => {
         beforeEach(async () => {
           createComponentWithStore({
             state: {
               isLoadingSubscription: false,
               plan: {
                 code: planCode,
-                trial,
-              },
-              billing: {
-                subscriptionEndDate: new Date(),
               },
             },
+            apolloMock: { subscription: { canAddSeats: true, inRenewalPeriod } },
           });
 
           await waitForPromises();
@@ -225,41 +227,18 @@ describe('SubscriptionTable component', () => {
         });
       },
     );
-
-    describe('when subscriptionEndDate is more than 15 days', () => {
-      beforeEach(() => {
-        const today = new Date();
-        const subscriptionEndDate = today.setDate(today.getDate() + 16);
-
-        createComponentWithStore({
-          state: {
-            isLoadingSubscription: false,
-            plan: {
-              code: mockDataSubscription.planCode,
-              trial: false,
-            },
-            billing: {
-              subscriptionEndDate,
-            },
-          },
-        });
-      });
-
-      it('does not display the renew button', () => {
-        expect(findRenewButton().exists()).toBe(false);
-      });
-    });
   });
 
   describe('Add seats button', () => {
     describe.each`
-      planCode    | expected | testDescription
-      ${'silver'} | ${true}  | ${'renders the button'}
-      ${null}     | ${false} | ${'does not render the button'}
-      ${'free'}   | ${false} | ${'does not render the button'}
+      planCode    | canAddSeats | expected | testDescription
+      ${'silver'} | ${true}     | ${true}  | ${'renders the button'}
+      ${'silver'} | ${false}    | ${false} | ${'does not render the button'}
+      ${null}     | ${true}     | ${false} | ${'does not render the button'}
+      ${'free'}   | ${true}     | ${false} | ${'does not render the button'}
     `(
       'given a plan with state: planCode = $planCode',
-      ({ planCode, expected, testDescription }) => {
+      ({ planCode, canAddSeats, expected, testDescription }) => {
         beforeEach(async () => {
           createComponentWithStore({
             state: {
@@ -269,6 +248,7 @@ describe('SubscriptionTable component', () => {
                 upgradable: true,
               },
             },
+            apolloMock: { subscription: { canAddSeats, inRenewalPeriod: true } },
           });
 
           await waitForPromises();