Skip to content

HubSpot Master Forms

Warren Gifford requested to merge brett/hs-master-forms into main

Created by: bretthayes

This closes #5409 (closed) and consolidates most of our HubSpot forms under 4 master forms that map to specific formIds. Some forms that do not fall under the master forms still use the specific formId backwards compatible syntax in the API.

Please take a look at our Master List to understand the mapping as well as the tech requirements.

Changelog

  • Converted our HubSpot hook into a component for convenient rendering in markup for both MDX and non-MDX pages. This means the old EmbeddedHubSpot component is now deprecated in favour of one component to rule them all. The new API is much more simplistic for both cases. I will follow up with a PR to update the handbook section for embedded HubSpot forms after this PR is merged.
  • Added a useLandingSource hook to grab and store the initial landing source of a user in sessionStorage. This will be used to track landing sources in our HubSpot form submission data in case the sourcegraphSourceUrl cookie doesn't contain any useful data
  • Consolidated all our contact pages in a more convenient template mapped index since they all use very similar props, content, and forms. This deprecates a lot of duplicated code into one template so we can handle contact page redesigns quicker in the future.
  • Cleaned up some broken links on our abcs ebook page
  • Updated our master forms in HubSpot to be more responsive
  • Deprecated our FormLegal component since the form legal line is now included in each master form. I think this should be the standard going forward unless we feel otherwise.
  • Also closes #5488 (closed) with some improved optimizations
  • Added meta to terms sub pages/slug template
  • Added custom form submission messages to HubSpotForms
  • GatedResourceLayout updated to allow for a custom form submission message
  • HubSpotForm form submission messages fall back with a generic message if none is provided
  • window.open removed from guides pages for more preferred UX best practice (Safari and Firefox block popups by default)
  • added tailwind whitespace utility class placeholder
  • Restricted title prop to be a string only, for our GatedResourceLayout

Test

  1. Ensure prettier has standardized the proposed changes.
  2. Ensure every page that has a form renders the correct form. Please use the Master List for reference to check each new path and check the following:
    1. The masterFormName matches
    2. If ChiliPiper is enabled/disabled
    3. The form submission message is correct
  3. Ensure every contact page renders correctly
  4. Check that form data is submitted correctly:
    1. Start a new session at a random page (landing source) and navigate to a page with a form.
    2. Ensure the anonymous_user_id hidden form field is populated with the sourcegraphAnonymousUid cookie data
    3. Ensure the first_source_url hidden form field is populated with the landing source or the sourcegraphSourceUrl if you started your session from the product and navigated to the about site through a CTA
    4. Ensure that the form_submission_source is populated with the page you're submitting the form on. Submit a test submission and ensure all pieces of data are sent and captured in your form submission on HubSpot. You can find your contact in HubSpot by searching in Contacts for the email you used in your form submission.
  5. Check that no duplicate forms render when utm params or other query parameters are present in the URL
  6. Check all pages that use our GatedResourceLayout component and ensure form submission messages with links to the resources open properly when clicked

TODO

Merge request reports