docs: DX and performance improvements in API reference (#9430)

- Improve scroll behavior between active sections
- Improve lag when clicking on a sidebar item
- Refactor internal working of the `SidebarProvider` to find active items faster.
- Use Next.js's `useRouter` hook for changing the hash (since they added the option to disable scroll)
- Change `isBrowser` from a hook to a provider since it's widely used across applications.
- Other general improvements and fixes.

Closes DOCS-952
This commit is contained in:
Shahed Nasser
2024-10-02 18:51:02 +03:00
committed by GitHub
parent 5fb9c1f82e
commit 0f6f56e764
38 changed files with 294 additions and 218 deletions

View File

@@ -2,6 +2,7 @@
import clsx from "clsx"
import { useActiveOnScroll, useSidebar } from "docs-ui"
import { useRouter } from "next/navigation"
import { useEffect, useRef } from "react"
export type SectionProps = {
@@ -20,6 +21,7 @@ const Section = ({
useDefaultIfNoActive: false,
})
const { setActivePath } = useSidebar()
const router = useRouter()
useEffect(() => {
if ("scrollRestoration" in history) {
@@ -30,7 +32,9 @@ const Section = ({
useEffect(() => {
if (activeItemId.length) {
history.pushState({}, "", `#${activeItemId}`)
router.push(`#${activeItemId}`, {
scroll: false,
})
setActivePath(activeItemId)
}
}, [activeItemId])