Commit 4ed4f270 authored by Vitaly Slobodin's avatar Vitaly Slobodin

Merge branch '218397-follow-up-from-onboarding-experiment-new-project-step' into 'master'

Simplify progress bar steps logic

See merge request gitlab-org/gitlab!40390
parents f6c8c45d e38fe856
......@@ -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,
];
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 },
});
},
});
......
......@@ -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;
......
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 },
});
},
});
......
<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 />
......
......@@ -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,
......
......@@ -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
......
......@@ -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 }
......
......@@ -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.')
......
---
title: Simplify progress bar steps logic
merge_request: 40390
author:
type: changed
......@@ -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
......@@ -58,14 +58,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
......@@ -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
......@@ -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');
});
......
......@@ -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
......
......@@ -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' }
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment