User feedback show terms in the footer

Feature Description

Potential to add ‘terms and conditions’ section at the bottom of the user feedback notice as per discussion in Asana.

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

• If the current user has not opted in to Site Kit’s regular Analytics tracking, the user feedback survey (specifically only the first question) should also include a footer informing about the data being sent to Google.
  • The copy should be: _ By continuing, you agree to allow Google to use your answers and account info to improve services, per our Privacy & Terms._ (this is intentionally slightly different from the text in the screenshot below, as we don’t send any system information)
  • The word “Privacy” should link to https://myaccount.google.com/privacypolicy?hl={currentLocale}
  • The word “Terms” should link to https://policies.google.com/terms?hl={currentLocale}
  • The locale value used for these (and in principle any URLs using the hl query parameter) should only include the first two segments of the actual locale (see #2105).
  • It should have a separator above with equal spacing above and below, and generally it should follow the design from the following screenshot (which shows a demo survey in one of Google’s own services):

Implementation Brief

• Using assets/js/googlesitekit/datastore/site/info.js,
  • Update the getGoogleSupportURL selector to have the host of the URL dynamic (default value: support.google.com) so that the host can be specified and not hardcoded to support.google.com.
• Using assets/js/components/surveys/CurrentSurvey.js,
  • Query the user data store via the isTrackingEnabled selector to check if tracking is enabled.
  • Check if isTrackingEnabled is still resolving, via the hasFinishedResolution selector of the user data store and return null if this is the case, meaning that the survey should not be displayed if it’s still resolving.
  • Get the “Privacy” and “Terms” URL by querying the site data store via the getGoogleSupportURL selector passing the appropriate parameters.
  • If user tracking is explicitly set to false, and the question ordinal is 1, then display the text as per the AC wrapped in a p tag, which is itself wrapped within a container with the googlesitekit-survey__footer class name. For e.g:

    <div className="googlesitekit-survey__footer">
        <p>...</p>
    </div>
    

• Using assets/sass/components/surveys/_googlesitekit-surveys.scss, style the p tag within the googlesitekit-survey__footer class name. The p should have the following styles:
  • font size, font family same as the text below the first and last icons.
  • border-top set to 1px solid $c-iron
  • padding-top of 12px
  • margin-top of -12px so that the space before and after the paragraph is consistent and not have a big whitepace and also the form looks good when the footer is not present.
• Update the CurrentSurvey stories to include a story where the user has not enabled tracking so that the footer is visible. To disable tracking, use the receiveGetTracking action of the user data store, passing enabled: false.

Test Coverage

• No new tests to be added.

Visual Regression Changes

• N/A

QA Brief

• Ensure the User Survey is being displayed (use the User Survey plugin to trigger a survey when the dashboard is loaded, see the User Feedback Bug Bash instructions for more info)
• Go to the settings and turn off tracking.
• Go back to the dashboard and verify that you see terms conditions like explained in the AC.

Changelog entry

• Show Terms of Service and Privacy Policy in User Feedback survey if the user hasn’t opted-in to tracking.

[felixarntz]

@eugene-manuilov @tofumatt Replied to the comment - apologies, this was a mis-assumption from my end. So this will need a few more changes to reflect the updated requirements.

[felixarntz]

@wpdarren Thanks for pointing these out. Some clarifications:

1. That link is almost correct as is, but it should use a the two-letter language code instead of full locale (see ACs).
2. That link is incorrect as it’s not what’s in the ACs, plus it also should use the two-letter language code (see ACs).
3. That was not explicitly specified, but external links should always open in a new window/tab unless otherwise specified - so this needs to be changed.
4. Indeed, the spacing below looks like too much.

cc @eugene-manuilov