Send new analytics fields for path_language, path_version, path_produ…

…ct, path_article (github#21562) * Send new analytics fields for path_language, path_version, path_product, path_article * Update DefaultLayout.tsx * Update events.js
aroc2021 · Sep 17, 2021 · cdbbc63 · cdbbc63
1 parent 7a3db9f
commit cdbbc63
Show file tree

Hide file tree

Showing 6 changed files with 58 additions and 20 deletions.
diff --git a/components/DefaultLayout.tsx b/components/DefaultLayout.tsx
@@ -11,7 +11,18 @@ import { useTranslation } from './hooks/useTranslation'
 
 type Props = { children?: React.ReactNode }
 export const DefaultLayout = (props: Props) => {
-  const { page, error, isHomepageVersion, currentPathWithoutLanguage, fullUrl, status } = useMainContext()
+  const {
+    page,
+    error,
+    isHomepageVersion,
+    currentLanguage,
+    currentPathWithoutLanguage,
+    currentVersion,
+    currentProduct,
+    relativePath,
+    fullUrl,
+    status,
+  } = useMainContext()
   const { t } = useTranslation('errors')
   return (
     <div className="d-lg-flex">
@@ -25,12 +36,7 @@ export const DefaultLayout = (props: Props) => {
 
         {/* For Google and Bots */}
         {page.introPlainText && <meta name="description" content={page.introPlainText} />}
-
-        {/* For local site search indexing */}
-        {page.topics.length > 0 && <meta name="keywords" content={page.topics.join(',')} />}
-
         {page.hidden && <meta name="robots" content="noindex" />}
-
         {page.languageVariants.map((languageVariant) => {
           return (
             <link
@@ -42,11 +48,24 @@ export const DefaultLayout = (props: Props) => {
           )
         })}
 
+        {/* For local site search indexing */}
+        {page.topics.length > 0 && <meta name="keywords" content={page.topics.join(',')} />}
+
         {/* For analytics events */}
-        {status && <meta name="status" content={status.toString()} />}
+        {currentLanguage && <meta name="path-language" content={currentLanguage} />}
+        {currentVersion && <meta name="path-version" content={currentVersion} />}
+        {currentProduct && <meta name="path-product" content={currentProduct.id} />}
+        {relativePath && (
+          <meta
+            name="path-article"
+            content={relativePath.replace('/index.md', '').replace('.md', '')}
+          />
+        )}
         {page.type && <meta name="page-type" content={page.type} />}
         {page.documentType && <meta name="page-document-type" content={page.documentType} />}
+        {status && <meta name="status" content={status.toString()} />}
 
+        {/* OpenGraph data */}
         {page.fullTitle && (
           <>
             <meta property="og:site_name" content="GitHub Docs" />
@@ -60,6 +79,7 @@ export const DefaultLayout = (props: Props) => {
           </>
         )}
       </Head>
+
       <SidebarNav />
 
       <main className="flex-1 min-width-0">

diff --git a/components/context/MainContext.tsx b/components/context/MainContext.tsx
@@ -80,6 +80,7 @@ export type MainContextT = {
   currentLanguage: string
   userLanguage: string
   allVersions: Record<string, VersionItem>
+  currentVersion?: string
   currentProductTree?: ProductTreeNode | null
   featureFlags: FeatureFlags
   page: {
@@ -164,6 +165,7 @@ export const getMainContext = (req: any, res: any): MainContextT => {
     currentLanguage: req.context.currentLanguage,
     userLanguage: req.context.userLanguage || '',
     allVersions: req.context.allVersions,
+    currentVersion: req.context.currentVersion,
     currentProductTree: req.context.currentProductTree
       ? getCurrentProductTree(req.context.currentProductTree)
       : null,

diff --git a/components/lib/events.ts b/components/lib/events.ts
@@ -71,11 +71,6 @@ function getMetaContent(name: string) {
 }
 
 export function sendEvent({ type, version = '1.0.0', ...props }: SendEventProps) {
-  let site_language = location.pathname.split('/')[1]
-  if (location.pathname.startsWith('/playground')) {
-    site_language = 'en'
-  }
-
   const body = {
     _csrf: getCsrf(),
 
@@ -95,7 +90,10 @@ export function sendEvent({ type, version = '1.0.0', ...props }: SendEventProps)
       referrer: document.referrer,
       search: location.search,
       href: location.href,
-      site_language,
+      path_language: getMetaContent('path-language'),
+      path_version: getMetaContent('path-version'),
+      path_product: getMetaContent('path-product'),
+      path_article: getMetaContent('path-article'),
       page_document_type: getMetaContent('page-document-type'),
       page_type: getMetaContent('page-type'),
       status: Number(getMetaContent('status') || 0),

diff --git a/lib/languages.js b/lib/languages.js
@@ -59,4 +59,6 @@ if (process.env.ENABLED_LANGUAGES) {
   console.log(`ENABLED_LANGUAGES: ${process.env.ENABLED_LANGUAGES}`)
 }
 
+export const languageKeys = Object.keys(languages)
+
 export default languages
diff --git a/lib/schema-event.js b/lib/schema-event.js
@@ -1,4 +1,6 @@
-import languages from './languages.js'
+import { languageKeys } from './languages.js'
+import { allVersionKeys } from './all-versions.js'
+import { productIds } from './all-products.js'
 
 const context = {
   type: 'object',
@@ -58,10 +60,24 @@ const context = {
       description: 'The browser value of `location.href`.',
       format: 'uri',
     },
-    site_language: {
+    path_language: {
       type: 'string',
-      description: 'The language the user is viewing.',
-      enum: Object.keys(languages),
+      description: 'The language the user is viewing, from the URL path.',
+      enum: languageKeys,
+    },
+    path_version: {
+      type: 'string',
+      description: 'The GitHub version of the docs, from the URL path.',
+      enum: allVersionKeys,
+    },
+    path_product: {
+      type: 'string',
+      description: 'The GitHub product the docs are for, from the URL path.',
+      enum: productIds.concat(['homepage']),
+    },
+    path_article: {
+      type: 'string',
+      description: 'The article path without language or version, from the URL path.',
     },
     page_document_type: {
       type: 'string',

diff --git a/tests/rendering/events.js b/tests/rendering/events.js
@@ -56,7 +56,7 @@ describe('POST /events', () => {
       referrer: 'https://github.com/github/docs',
       search: '?q=is%3Aissue+is%3Aopen+example+',
       href: 'https://github.com/github/docs/issues?q=is%3Aissue+is%3Aopen+example+',
-      site_language: 'en',
+      path_language: 'en',
 
       // Device information
       os: 'linux',
@@ -211,13 +211,13 @@ describe('POST /events', () => {
         400
       ))
 
-    it('should site_language is a valid option', () =>
+    it('should path_language is a valid option', () =>
       checkEvent(
         {
           ...pageExample,
           context: {
             ...pageExample.context,
-            site_language: 'nl',
+            path_language: 'nl',
           },
         },
         400