Merge branch 'company-page-copy' into 'master'

Different copy on company page based on trial vs. registration flow

See merge request gitlab-org/gitlab!83778

ee/app/assets/javascripts/registrations/components/company_form.vue

@@ -56,6 +56,11 @@ export default {
         ...companySizes,
       ];
     },
+    descriptionText() {
+      return this.trial
+        ? this.$options.i18n.description.trial
+        : this.$options.i18n.description.registration;
+    },
   },
   i18n: {
     companyNameLabel: LEADS_COMPANY_NAME_LABEL,
@@ -67,7 +72,13 @@ export default {
     optional: __('(optional)'),
     websiteLabel: __('Website'),
     trialLabel: __('GitLab Ultimate trial'),
-    trialDescription: __('Try all GitLab features for free for 30 days. No credit card required.'),
+    trialToggleDescription: __(
+      'Try all GitLab features for free for 30 days. No credit card required.',
+    ),
+    description: {
+      trial: __('To activate your trial, we need additional details from you.'),
+      registration: __('To complete registration, we need additional details from you.'),
+    },
   },
 };
 </script>
@@ -75,6 +86,7 @@ export default {
 <template>
   <gl-form :action="createLeadPath" method="post">
     <input :value="$options.csrf.token" type="hidden" name="authenticity_token" />
+    <gl-form-text class="gl-font-base gl-text-gray-400 gl-pb-3">{{ descriptionText }}</gl-form-text>
     <div class="gl-display-flex gl-flex-direction-column gl-sm-flex-direction-row gl-mt-5">
       <gl-form-group
         :label="$options.i18n.companyNameLabel"
@@ -146,7 +158,7 @@ export default {
       :optional-text="$options.i18n.optional"
       optional
     >
-      <gl-form-text class="gl-pb-3">{{ $options.i18n.trialDescription }}</gl-form-text>
+      <gl-form-text class="gl-pb-3">{{ $options.i18n.trialToggleDescription }}</gl-form-text>
       <registration-trial-toggle :active="trial" data-testid="trial" />
     </gl-form-group>
     <gl-button type="submit" variant="confirm" class="gl-w-20">

ee/spec/frontend/registrations/company/new/components/company_form_spec.js

-import { GlButton, GlForm } from '@gitlab/ui';
+import { GlButton, GlForm, GlFormText } from '@gitlab/ui';
 import { createLocalVue } from '@vue/test-utils';
+import { nextTick } from 'vue';
 import RegistrationForm from 'ee/registrations/components/company_form.vue';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import { TRIAL_FORM_SUBMIT_TEXT } from 'ee/trials/constants';
@@ -22,6 +23,7 @@ describe('RegistrationForm', () => {
     });
   };
 
+  const findDescription = () => wrapper.findComponent(GlFormText);
   const findButton = () => wrapper.findComponent(GlButton);
   const findForm = () => wrapper.findComponent(GlForm);
   const findFormInput = (testId) => wrapper.findByTestId(testId);
@@ -35,6 +37,17 @@ describe('RegistrationForm', () => {
   });
 
   describe('rendering', () => {
+    it.each`
+      trialBool | descriptionText
+      ${true}   | ${'To activate your trial, we need additional details from you.'}
+      ${false}  | ${'To complete registration, we need additional details from you.'}
+    `('displays the correct page description text', async ({ trialBool, descriptionText }) => {
+      wrapper.setProps({ trial: trialBool });
+      await nextTick();
+
+      expect(findDescription().text()).toContain(descriptionText);
+    });
+
     it('has the "Continue" text on the submit button', () => {
       expect(findButton().text()).toBe(TRIAL_FORM_SUBMIT_TEXT);
     });

locale/gitlab.pot

@@ -39298,6 +39298,9 @@ msgstr ""
 msgid "To access this domain create a new DNS record"
 msgstr ""
 
+msgid "To activate your trial, we need additional details from you."
+msgstr ""
+
 msgid "To add a custom suffix, set up a Service Desk email address. %{linkStart}Learn more.%{linkEnd}"
 msgstr ""
 
@@ -39307,6 +39310,9 @@ msgstr ""
 msgid "To ask someone to look at a merge request, select %{strongStart}Request attention%{strongEnd}. Select again to remove the request."
 msgstr ""
 
+msgid "To complete registration, we need additional details from you."
+msgstr ""
+
 msgid "To confirm, type %{phrase_code}"
 msgstr ""