Merge pull request #10225 from github/repo-sync

repo sync

components/context/TocLandingContext.tsx

@@ -2,6 +2,12 @@ import pick from 'lodash/pick'
 import { createContext, useContext } from 'react'
 import { FeaturedLink, getFeaturedLinksFromReq } from './ProductLandingContext'
 
+export type LearningTrack = {
+  trackName?: string
+  prevGuide?: { href: string; title: string }
+  nextGuide?: { href: string; title: string }
+}
+
 export type TocItem = {
   fullPath: string
   title: string
@@ -16,6 +22,7 @@ export type TocLandingContextT = {
   variant?: 'compact' | 'expanded'
   featuredLinks: Record<string, Array<FeaturedLink>>
   renderedPage: string
+  currentLearningTrack?: LearningTrack
 }
 
 export const TocLandingContext = createContext<TocLandingContextT | null>(null)
@@ -43,5 +50,6 @@ export const getTocLandingContextFromRequest = (req: any): TocLandingContextT =>
 
     featuredLinks: getFeaturedLinksFromReq(req),
     renderedPage: isEarlyAccess ? req.context.renderedPage : '',
+    currentLearningTrack: req.context.currentLearningTrack,
   }
 }

components/landing/TocLanding.tsx

@@ -9,10 +9,19 @@ import { useTranslation } from 'components/hooks/useTranslation'
 import { ArticleGridLayout } from 'components/article/ArticleGridLayout'
 import { Callout } from 'components/ui/Callout'
 import { Lead } from 'components/ui/Lead'
+import { LearningTrackNav } from '../article/LearningTrackNav'
 
 export const TocLanding = () => {
-  const { title, introPlainText, tocItems, productCallout, variant, featuredLinks, renderedPage } =
-    useTocLandingContext()
+  const {
+    title,
+    introPlainText,
+    tocItems,
+    productCallout,
+    variant,
+    featuredLinks,
+    renderedPage,
+    currentLearningTrack,
+  } = useTocLandingContext()
   const { t } = useTranslation('toc')
 
   return (
@@ -58,6 +67,12 @@ export const TocLanding = () => {
             <TableOfContents items={tocItems} variant={variant} />
           </div>
         </ArticleGridLayout>
+
+        {currentLearningTrack?.trackName ? (
+          <div className="mt-4">
+            <LearningTrackNav track={currentLearningTrack} />
+          </div>
+        ) : null}
       </div>
     </DefaultLayout>
   )