* Remove json.parse(json.stringify( usage to improve performance * Fix missing / duplicate keys in some renders * Fix missing react-is dependency (only seemed to cause problems from pruning on the heroku deploy) * Add nextjs tag to datadog-connect config when nextjs is a query param * Fix router.asPath usage to exclude query param * Fix styling inconsistencies noticed when testing * Add a few tests
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
import { useRouter } from 'next/router'
|
|
import Link from 'next/link'
|
|
import cx from 'classnames'
|
|
|
|
import type { TocItem } from '../context/ProductLandingContext'
|
|
|
|
export const TableOfContents = (props: { items?: Array<TocItem> }) => {
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<div>
|
|
{(props.items || []).map((obj) => {
|
|
if (!obj) {
|
|
return null
|
|
}
|
|
const { fullPath: href, title, intro } = obj
|
|
const isActive = router.pathname === href
|
|
return (
|
|
<div key={href} className={cx('mb-5', isActive && 'color-auto-gray-4')}>
|
|
<Link href={href}>
|
|
<a className="Bump-link--hover no-underline d-block py-1 border-bottom color-border-primary">
|
|
<h4>
|
|
{title}
|
|
<span className="Bump-link-symbol">→</span>
|
|
</h4>
|
|
</a>
|
|
</Link>
|
|
{intro && <p className="f4 mt-3" dangerouslySetInnerHTML={{ __html: intro }} />}
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
)
|
|
}
|