From a7ce08da9532678e682ac5b440a3fb92da89e29f Mon Sep 17 00:00:00 2001 From: Allan Guwatudde Date: Thu, 13 Apr 2023 21:55:00 +0300 Subject: [PATCH] [MM-51236] - Update newsletter opt-in copy (#22849) * [MM-51236] - Update newsletter opt-in copy * feedback impl * fix tests * fix text color * fix color --------- Co-authored-by: Mattermost Build --- .../signup/__snapshots__/signup.test.tsx.snap | 4 ++-- .../channels/src/components/signup/signup.scss | 4 ++-- .../src/components/signup/signup.test.tsx | 4 ++-- .../channels/src/components/signup/signup.tsx | 17 ++++++++++++++--- .../components/widgets/inputs/check/check.scss | 8 ++++++-- webapp/channels/src/i18n/en.json | 4 ++-- webapp/channels/src/utils/constants.tsx | 2 ++ 7 files changed, 30 insertions(+), 13 deletions(-) diff --git a/webapp/channels/src/components/signup/__snapshots__/signup.test.tsx.snap b/webapp/channels/src/components/signup/__snapshots__/signup.test.tsx.snap index 7ab9e4ee2c..077718b0fa 100644 --- a/webapp/channels/src/components/signup/__snapshots__/signup.test.tsx.snap +++ b/webapp/channels/src/components/signup/__snapshots__/signup.test.tsx.snap @@ -99,7 +99,7 @@ exports[`components/signup/Signup should match snapshot for all signup options e - Interested in receiving Mattermost security updates via newsletter? + Interested in receiving Mattermost security, product, promotions, and company updates updates via newsletter? - Interested in receiving Mattermost security updates via newsletter? + Interested in receiving Mattermost security, product, promotions, and company updates updates via newsletter? { const checkInput = screen.getByTestId('signup-body-card-form-check-newsletter'); expect(checkInput).toHaveAttribute('type', 'checkbox'); - expect(signupContainer).toHaveTextContent(/I would like to receive Mattermost security updates via newsletter. Data Terms and Conditions apply/); + expect(signupContainer).toHaveTextContent('I would like to receive Mattermost security updates via newsletter. By subscribing, I consent to receive emails from Mattermost with product updates, promotions, and company news. I have read the Privacy Policy and understand that I can unsubscribe at any time'); }); it('should NOT show newsletter check box opt-in for self-hosted AND airgapped workspaces', async () => { @@ -324,7 +324,7 @@ describe('components/signup/Signup', () => { , {}); expect(() => screen.getByTestId('signup-body-card-form-check-newsletter')).toThrow(); - expect(signupContainer).toHaveTextContent('Interested in receiving Mattermost security updates via newsletter?Sign up at https://mattermost.com/security-updates/.'); + expect(signupContainer).toHaveTextContent('Interested in receiving Mattermost security, product, promotions, and company updates updates via newsletter?Sign up at https://mattermost.com/security-updates/.'); }); it('should not show any newsletter related opt-in or text for cloud', async () => { diff --git a/webapp/channels/src/components/signup/signup.tsx b/webapp/channels/src/components/signup/signup.tsx index 3f3a13d460..454d5cd8ae 100644 --- a/webapp/channels/src/components/signup/signup.tsx +++ b/webapp/channels/src/components/signup/signup.tsx @@ -603,16 +603,27 @@ const Signup = ({onCustomizeHeader}: SignupProps) => { onChange={() => setSubscribeToSecurityNewsletter(!subscribeToSecurityNewsletter)} text={ formatMessage( - {id: 'newsletter_optin.checkmark.text', defaultMessage: 'I would like to receive Mattermost security updates via newsletter. Data Terms and Conditions apply'}, + {id: 'newsletter_optin.checkmark.text', defaultMessage: 'I would like to receive Mattermost security updates via newsletter. By subscribing, I consent to receive emails from Mattermost with product updates, promotions, and company news. I have read the Privacy Policy and understand that I can unsubscribe at any time'}, { a: (chunks: React.ReactNode | React.ReactNodeArray) => ( {chunks} ), + aa: (chunks: React.ReactNode | React.ReactNodeArray) => ( + + {chunks} + + ), + span: (chunks: React.ReactNode | React.ReactNodeArray) => ( + {chunks} + ), }, )} checked={subscribeToSecurityNewsletter} @@ -622,7 +633,7 @@ const Signup = ({onCustomizeHeader}: SignupProps) => { return (
- {formatMessage({id: 'newsletter_optin.title', defaultMessage: 'Interested in receiving Mattermost security updates via newsletter?'})} + {formatMessage({id: 'newsletter_optin.title', defaultMessage: 'Interested in receiving Mattermost security, product, promotions, and company updates updates via newsletter?'})} {formatMessage( diff --git a/webapp/channels/src/components/widgets/inputs/check/check.scss b/webapp/channels/src/components/widgets/inputs/check/check.scss index e6e9809d39..09545e6d68 100644 --- a/webapp/channels/src/components/widgets/inputs/check/check.scss +++ b/webapp/channels/src/components/widgets/inputs/check/check.scss @@ -9,11 +9,15 @@ .text { margin-left: 8px; - color: var(--center-channel-color-rgb); - font-family: 'Open Sans'; + color: rgba(var(--center-channel-color-rgb), 0.56); font-size: 12px; font-style: normal; font-weight: 400; line-height: 16px; + + .header { + display: block; + color: var(--center-channel-color); + } } } diff --git a/webapp/channels/src/i18n/en.json b/webapp/channels/src/i18n/en.json index 249111c8b5..269e9af208 100644 --- a/webapp/channels/src/i18n/en.json +++ b/webapp/channels/src/i18n/en.json @@ -4265,9 +4265,9 @@ "navbar.viewPinnedPosts": "View Pinned Posts", "newChannelWithBoard.tutorialTip.description": "The board you just created can be quickly accessed by clicking on the Boards icon in the App bar. You can view the boards that are linked to this channel in the right-hand sidebar and open one in full view.", "newChannelWithBoard.tutorialTip.title": "Access linked boards from the App Bar", - "newsletter_optin.checkmark.text": "I would like to receive Mattermost security updates via newsletter. Data Terms and Conditions apply", + "newsletter_optin.checkmark.text": "I would like to receive Mattermost security updates via newsletter. By subscribing, I consent to receive emails from Mattermost with product updates, promotions, and company news. I have read the Privacy Policy and understand that I can unsubscribe at any time", "newsletter_optin.desc": "Sign up at {link}.", - "newsletter_optin.title": "Interested in receiving Mattermost security updates via newsletter?", + "newsletter_optin.title": "Interested in receiving Mattermost security, product, promotions, and company updates updates via newsletter?", "next_steps_view.welcomeToMattermost": "Welcome to Mattermost", "no_results.channel_files_filtered.subtitle": "This channel doesn't contains any file with the selected file format.", "no_results.channel_files_filtered.title": "No files found", diff --git a/webapp/channels/src/utils/constants.tsx b/webapp/channels/src/utils/constants.tsx index cffc537c84..091eb5aff6 100644 --- a/webapp/channels/src/utils/constants.tsx +++ b/webapp/channels/src/utils/constants.tsx @@ -1080,6 +1080,8 @@ export const HostedCustomerLinks = { SELF_HOSTED_BILLING: 'https://docs.mattermost.com/manage/self-hosted-billing.html', TERMS_AND_CONDITIONS: 'https://mattermost.com/enterprise-edition-terms/', SECURITY_UPDATES: 'https://mattermost.com/security-updates/', + NEWSLETTER_UNSUBSCRIBE_LINK: 'https://forms.mattermost.com/UnsubscribePage.html', + PRIVACY: 'https://mattermost.com/privacy-policy/', }; export const DocLinks = {