diff --git a/src/components/InstallButton.js b/src/components/InstallButton.js index 4b195a157..c99779654 100644 --- a/src/components/InstallButton.js +++ b/src/components/InstallButton.js @@ -10,7 +10,7 @@ import { NR1_GUIDED_INSTALL_NERDLET, NR1_PACK_DETAILS_NERDLET, UTM_PARAMETERS, - NR1_SIGNUP_URL, + SIGNUP_LINK, } from '../data/constants'; import { quickstart } from '../types'; import Cookies from 'js-cookie'; @@ -52,7 +52,7 @@ const createInstallLink = ( ? getGuidedInstallStackedNr1Url(nerdletId) : getPackNr1Url(id, nerdletId); - const installUrl = new URL(hasUtmParameters ? NR1_SIGNUP_URL : platformUrl); + const installUrl = new URL(hasUtmParameters ? SIGNUP_LINK : platformUrl); if (parameters) { parameters.forEach((value, key) => { installUrl.searchParams.set(key, value); diff --git a/src/components/quickstarts/SupportSection.js b/src/components/quickstarts/SupportSection.js new file mode 100644 index 000000000..9891af201 --- /dev/null +++ b/src/components/quickstarts/SupportSection.js @@ -0,0 +1,87 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { css } from '@emotion/react'; +import { useTessen, Link } from '@newrelic/gatsby-theme-newrelic'; +import { + SUPPORT_LINK, + COMMUNITY_LINK, + QUICKSTART_SUPPORT_LEVELS, +} from '../../data/constants'; + +const SupportSection = ({ supportLevel }) => { + const tessen = useTessen(); + const whatsIncluded = What's included; + const supportLink = ( + + tessen.track('instantObservability', 'QuickstartDetailsSupportClick') + } + > + Visit our Support Center + + ); + + const communityLink = ( + + tessen.track('instantObservability', 'QuickstartDetailsCommunityClick') + } + > + the Explorers Hub + + ); + + const QUICKSTART_SUPPORT_CONTENT = { + [QUICKSTART_SUPPORT_LEVELS.NEWRELIC]: { + title: 'Built by New Relic', + content: [ + 'Need help? ', + supportLink, + ' or check out our community forum, ', + communityLink, + '.', + ], + }, + [QUICKSTART_SUPPORT_LEVELS.VERIFIED]: { + title: 'Verified by New Relic', + content: [ + "Need help? Find the author's support resources under ", + whatsIncluded, + '. Or check out our community forum, ', + communityLink, + '.', + ], + }, + [QUICKSTART_SUPPORT_LEVELS.COMMUNITY]: { + title: 'Built by the community', + content: [ + 'Need help? Visit our community forum, ', + communityLink, + ' to find an answer or post a question.', + ], + }, + }; + + return ( + <> +
{QUICKSTART_SUPPORT_CONTENT[`${supportLevel}`].content}
+ > + ); +}; + +SupportSection.propTypes = { + supportLevel: PropTypes.string.isRequired, +}; + +export default SupportSection; diff --git a/src/data/constants.js b/src/data/constants.js index b07bf74bc..ff252d55e 100644 --- a/src/data/constants.js +++ b/src/data/constants.js @@ -11,10 +11,6 @@ export const SPLIT_TRACKING_EVENTS = { export const SDK_BASE_URL = 'https://d1zobbh8kytrtv.cloudfront.net/platform/doc-app'; -export const NR1_LOGIN_URL = 'https://login.newrelic.com/login'; - -export const NR1_SIGNUP_URL = 'https://newrelic.com/signup'; - export const NR1_PACK_DETAILS_NERDLET = 'catalog-pack-details.catalog-pack-contents'; @@ -29,21 +25,8 @@ export const QUICKSTART_SUPPORT_LEVELS = { COMMUNITY: 'COMMUNITY', }; -export const QUICKSTART_SUPPORT_CONTENT = { - [QUICKSTART_SUPPORT_LEVELS.NEWRELIC]: { - title: 'Built by New Relic', - content: `Need help? [Visit our Support Center](https://support.newrelic.com) or check out our community forum, [the Explorers Hub](https://discuss.newrelic.com).`, - }, - [QUICKSTART_SUPPORT_LEVELS.VERIFIED]: { - title: 'Verified by New Relic', - content: `Need help? Find the author's support resources under **What's included**. Or check out our community forum, the [Explorers Hub](https://discuss.newrelic.com/). - `, - }, - [QUICKSTART_SUPPORT_LEVELS.COMMUNITY]: { - title: 'Built by the community', - content: `Need help? Visit our community forum, [the Explorers Hub](https://discuss.newrelic.com) to find an answer or post a question.`, - }, -}; +export const SUPPORT_LINK = 'https://support.newrelic.com'; +export const COMMUNITY_LINK = 'https://discuss.newrelic.com'; export const QUICKSTART_ALERT_TYPES = { BASELINE: 'BASELINE', diff --git a/src/templates/QuickstartDetails.js b/src/templates/QuickstartDetails.js index 29d685761..5c2d4fb3d 100644 --- a/src/templates/QuickstartDetails.js +++ b/src/templates/QuickstartDetails.js @@ -6,6 +6,7 @@ import PropTypes from 'prop-types'; import PageLayout from '../components/PageLayout'; import Tabs from '../components/Tabs'; import EmptyTab from '../components/quickstarts/EmptyTab'; +import SupportSection from '../components/quickstarts/SupportSection'; import QuickstartAlerts from '../components/quickstarts/QuickstartAlerts'; import QuickstartDashboards from '../components/quickstarts/QuickstartDashboards'; import { @@ -23,7 +24,6 @@ import Breadcrumbs from '../components/Breadcrumbs'; import { quickstart } from '../types'; import { QUICKSTARTS_REPO, - QUICKSTART_SUPPORT_CONTENT, SIGNUP_LINK, LOGIN_LINK, SHIELD_LEVELS, @@ -301,18 +301,7 @@ const QuickstartDetails = ({ data, location }) => {
-