Extract progress bar step logic to shared function

Extract logic to determine which steps to show
for the progress bar component

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

@@ -14,10 +14,3 @@ export const ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS = [
   STEPS.yourGroup,
   STEPS.yourProject,
 ];
-
-export const ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS = [
-  STEPS.yourProfile,
-  STEPS.checkout,
-  STEPS.yourGroup,
-  STEPS.yourProject,
-];

ee/app/assets/javascripts/registrations/projects/new/index.js

 import Vue from 'vue';
-import { parseBoolean } from '~/lib/utils/common_utils';
-import {
-  STEPS,
-  ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS,
-  ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS,
-} from '../../constants';
+import { STEPS, ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS } from '../../constants';
 import ProgressBar from '../../components/progress_bar.vue';
 
 export default () => {
@@ -12,17 +7,11 @@ export default () => {
 
   if (!el) return null;
 
-  const isInSubscriptionFlow = parseBoolean(el.dataset.isInSubscriptionFlow);
-
-  const steps = isInSubscriptionFlow
-    ? ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS
-    : ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS;
-
   return new Vue({
     el,
     render(createElement) {
       return createElement(ProgressBar, {
-        props: { steps, currentStep: STEPS.yourProject },
+        props: { steps: ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS, currentStep: STEPS.yourProject },
       });
     },
   });

ee/app/assets/javascripts/registrations/welcome/index.js

@@ -4,7 +4,6 @@ import {
   STEPS,
   SUBSCRIPTON_FLOW_STEPS,
   ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS,
-  ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS,
 } from '../constants';
 import ProgressBar from '../components/progress_bar.vue';
 
@@ -20,9 +19,7 @@ export default () => {
 
   let steps;
 
-  if (isInSubscriptionFlow && isOnboardingIssuesExperimentEnabled) {
-    steps = ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS;
-  } else if (isInSubscriptionFlow) {
+  if (isInSubscriptionFlow) {
     steps = SUBSCRIPTON_FLOW_STEPS;
   } else if (isOnboardingIssuesExperimentEnabled) {
     steps = ONBOARDING_ISSUES_EXPERIMENT_FLOW_STEPS;

ee/app/assets/javascripts/subscriptions/groups/edit/index.js

 import Vue from 'vue';
-import {
-  STEPS,
-  SUBSCRIPTON_FLOW_STEPS,
-  ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS,
-} from 'ee/registrations/constants';
+import { STEPS, SUBSCRIPTON_FLOW_STEPS } from 'ee/registrations/constants';
 import ProgressBar from 'ee/registrations/components/progress_bar.vue';
-import { parseBoolean } from '~/lib/utils/common_utils';
 
 export default () => {
   const el = document.getElementById('progress-bar');
 
   if (!el) return null;
 
-  const isOnboardingIssuesExperimentEnabled = parseBoolean(
-    el.dataset.isOnboardingIssuesExperimentEnabled,
-  );
-
-  const steps = isOnboardingIssuesExperimentEnabled
-    ? ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS
-    : SUBSCRIPTON_FLOW_STEPS;
-
   return new Vue({
     el,
     render(createElement) {
       return createElement(ProgressBar, {
-        props: { steps, currentStep: STEPS.yourGroup },
+        props: { steps: SUBSCRIPTON_FLOW_STEPS, currentStep: STEPS.yourGroup },
       });
     },
   });

ee/app/assets/javascripts/subscriptions/new/components/checkout.vue

 <script>
-import {
-  STEPS,
-  SUBSCRIPTON_FLOW_STEPS,
-  ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS,
-} from 'ee/registrations/constants';
+import { STEPS, SUBSCRIPTON_FLOW_STEPS } from 'ee/registrations/constants';
 import { mapState } from 'vuex';
 import ProgressBar from 'ee/registrations/components/progress_bar.vue';
 import { s__ } from '~/locale';
@@ -15,13 +11,9 @@ import ConfirmOrder from './checkout/confirm_order.vue';
 export default {
   components: { ProgressBar, SubscriptionDetails, BillingAddress, PaymentMethod, ConfirmOrder },
   currentStep: STEPS.checkout,
+  steps: SUBSCRIPTON_FLOW_STEPS,
   computed: {
-    ...mapState(['isOnboardingIssuesExperimentEnabled', 'isNewUser']),
-    steps() {
-      return this.isOnboardingIssuesExperimentEnabled
-        ? ONBOARDING_ISSUES_EXPERIMENT_AND_SUBSCRIPTION_FLOW_STEPS
-        : SUBSCRIPTON_FLOW_STEPS;
-    },
+    ...mapState(['isNewUser']),
   },
   i18n: {
     checkout: s__('Checkout|Checkout'),
@@ -31,7 +23,7 @@ export default {
 <template>
   <div class="checkout d-flex flex-column justify-content-between w-100">
     <div class="full-width">
-      <progress-bar v-if="isNewUser" :steps="steps" :current-step="$options.currentStep" />
+      <progress-bar v-if="isNewUser" :steps="$options.steps" :current-step="$options.currentStep" />
       <div class="flash-container"></div>
       <h2 class="mt-4 mb-3 mb-lg-5">{{ $options.i18n.checkout }}</h2>
       <subscription-details />

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

@@ -44,7 +44,6 @@ export default ({
   setupForCompany,
   fullName,
   newUser,
-  onboardingIssuesExperimentEnabled,
   groupData = '[]',
 }) => {
   const availablePlans = parsePlanData(planData);
@@ -58,7 +57,6 @@ export default ({
     availablePlans,
     selectedPlan: determineSelectedPlan(planId, availablePlans),
     isNewUser,
-    isOnboardingIssuesExperimentEnabled: parseBoolean(onboardingIssuesExperimentEnabled),
     fullName,
     groupData: groups,
     selectedGroup: groupId,

ee/app/helpers/subscriptions_helper.rb

@@ -11,7 +11,6 @@ module SubscriptionsHelper
       plan_id: params[:plan_id],
       namespace_id: params[:namespace_id],
       new_user: new_user?.to_s,
-      onboarding_issues_experiment_enabled: experiment_enabled?(:onboarding_issues).to_s,
       group_data: group_data.to_json
     }
   end

ee/app/views/registrations/projects/new.html.haml

@@ -4,7 +4,7 @@
 .row.flex-grow-1.bg-gray-light
   .d-flex.flex-column.align-items-center.w-100.p-3
     .new-project.d-flex.flex-column.align-items-center.pt-5
-      #progress-bar{ data: { is_in_subscription_flow: in_subscription_flow?.to_s } }
+      #progress-bar
       %h2.center= _('Create/import your first project')
       %p
         .center= html_escape(_('This project will live in your group %{strong_open}%{namespace}%{strong_close}. A project is where you house your files (repository), plan your work (issues), publish your documentation (wiki), and so much more.')) % { namespace: html_escape(@project.namespace.name), strong_open: '<strong>'.html_safe, strong_close: '</strong>'.html_safe }

ee/app/views/subscriptions/groups/edit.html.haml

@@ -11,7 +11,7 @@
         %p= _('You have successfully purchased a %{plan} plan subscription for %{seats}. You’ll receive a receipt via email.') % { plan: plan_title, seats: number_of_users }
     .edit-group.d-flex.flex-column.align-items-center.gl-pt-7
       - if params[:new_user]
-        #progress-bar{ data: { is_onboarding_issues_experiment_enabled: experiment_enabled?(:onboarding_issues).to_s } }
+        #progress-bar
       %h2.center= _('Create your group')
       %p
         %div= _('A group represents your organization in GitLab. Groups allow you to manage users and collaborate across multiple projects.')

ee/changelogs/unreleased/218397-follow-up-from-onboarding-experiment-new-project-step.yml

+---
+title: Simplify progress bar steps logic
+merge_request: 40390
+author:
+type: changed

ee/spec/features/registrations/new_project_spec.rb

@@ -5,12 +5,10 @@ require 'spec_helper'
 RSpec.describe 'New project screen', :js do
   let_it_be(:user) { create(:user) }
   let_it_be(:namespace) { create(:group) }
-  let(:in_subscription_flow) { false }
 
   before do
     gitlab_sign_in(user)
     namespace.add_owner(user)
-    allow_any_instance_of(EE::RegistrationsHelper).to receive(:in_subscription_flow?).and_return(in_subscription_flow)
     stub_experiment_for_user(onboarding_issues: true)
     visit new_users_sign_up_project_path(namespace_id: namespace.id)
   end
@@ -21,10 +19,4 @@ RSpec.describe 'New project screen', :js do
     expect(subject).to have_content('Create/import your first project')
     expect(subject).to have_content('Your profile Your GitLab group Your first project')
   end
-
-  context 'when in the subscription flow' do
-    let(:in_subscription_flow) { true }
-
-    it { is_expected.to have_content('Your profile Checkout Your GitLab group Your first project') }
-  end
 end

ee/spec/features/registrations/welcome_spec.rb

@@ -48,14 +48,5 @@ RSpec.describe 'Welcome screen', :js do
         end
       end
     end
-
-    context 'when in the subscription flow and part of the onboarding issues experiment' do
-      let(:in_subscription_flow) { true }
-      let(:part_of_onboarding_issues_experiment) { true }
-
-      it 'shows the progress bar with the correct steps' do
-        expect(page).to have_content('Your profile Checkout Your GitLab group Your first project')
-      end
-    end
   end
 end

ee/spec/features/subscriptions/groups/edit_spec.rb

@@ -7,13 +7,11 @@ RSpec.describe 'Welcome screen', :js do
   let_it_be(:group) { create(:group) }
 
   let(:params) { {} }
-  let(:part_of_onboarding_issues_experiment) { false }
 
   describe 'on GitLab.com' do
     before do
       group.add_owner(user)
       gitlab_sign_in(user)
-      stub_experiment_for_user(onboarding_issues: part_of_onboarding_issues_experiment)
       stub_request(:get, 'https://customers.gitlab.com/gitlab_plans?plan=free')
         .to_return(status: 200, body: '{}', headers: {})
 
@@ -31,14 +29,6 @@ RSpec.describe 'Welcome screen', :js do
       it 'shows the progress bar with the correct steps' do
         expect(page).to have_content('Your profile Checkout Your GitLab group')
       end
-
-      context 'when part of the onboarding issues experiment' do
-        let(:part_of_onboarding_issues_experiment) { true }
-
-        it 'shows the progress bar with the correct steps' do
-          expect(page).to have_content('Your profile Checkout Your GitLab group Your first project')
-        end
-      end
     end
   end
 end

ee/spec/frontend/subscriptions/new/components/checkout_spec.js

@@ -51,21 +51,6 @@ describe('Checkout', () => {
       ]);
     });
 
-    describe('when part of the onboarding issues experiment', () => {
-      beforeEach(() => {
-        store.state.isOnboardingIssuesExperimentEnabled = true;
-      });
-
-      it('passes the steps', () => {
-        expect(findProgressBar().props('steps')).toEqual([
-          'Your profile',
-          'Checkout',
-          'Your GitLab group',
-          'Your first project',
-        ]);
-      });
-    });
-
     it('passes the current step', () => {
       expect(findProgressBar().props('currentStep')).toEqual('Checkout');
     });

ee/spec/helpers/subscriptions_helper_spec.rb

@@ -35,7 +35,6 @@ RSpec.describe SubscriptionsHelper do
     before do
       allow(helper).to receive(:params).and_return(plan_id: 'bronze_id', namespace_id: group.id.to_s)
       allow(helper).to receive(:current_user).and_return(user)
-      allow(helper).to receive(:experiment_enabled?).with(:onboarding_issues).and_return(false)
       group.add_owner(user)
     end
 

ee/spec/views/subscriptions/groups/edit.html.haml_spec.rb

@@ -11,7 +11,6 @@ RSpec.describe 'subscriptions/groups/edit' do
     allow(view).to receive(:group_path).and_return('')
     allow(view).to receive(:subscriptions_groups_path).and_return('')
     allow(view).to receive(:current_user).and_return(User.new)
-    allow(view).to receive(:experiment_enabled?).with(:onboarding_issues).and_return(false)
   end
 
   let(:quantity) { '1' }