From 41684d091ba45e1b6b541c9a6b33ef54f707595d Mon Sep 17 00:00:00 2001
From: spastorelli <spastorelli@users.noreply.github.com>
Date: Thu, 15 Aug 2024 16:52:27 +0200
Subject: [PATCH] Revert "Automatically scroll to the active page in table of
 contents (#2425) (#2429)

---
 .changeset/stupid-guests-drive.md             |  5 --
 .../TableOfContents/TableOfContents.tsx       |  5 +-
 .../TableOfContents/ToggleableLinkItem.tsx    |  7 +--
 .../useScrollToActiveTOCItem.tsx              | 60 -------------------
 4 files changed, 3 insertions(+), 74 deletions(-)
 delete mode 100644 .changeset/stupid-guests-drive.md
 delete mode 100644 packages/gitbook/src/components/TableOfContents/useScrollToActiveTOCItem.tsx

diff --git a/.changeset/stupid-guests-drive.md b/.changeset/stupid-guests-drive.md
deleted file mode 100644
index 405d4e530..000000000
--- a/.changeset/stupid-guests-drive.md
+++ /dev/null
@@ -1,5 +0,0 @@
----
-'gitbook': patch
----
-
-Automatically scroll to active page in table of contents
diff --git a/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx b/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
index ecb5633b7..aff93bbb7 100644
--- a/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
+++ b/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
@@ -14,7 +14,6 @@ import { tcls } from '@/lib/tailwind';
 
 import { PagesList } from './PagesList';
 import { Trademark } from './Trademark';
-import { TOCScrollContainerProvider } from './useScrollToActiveTOCItem';
 
 export function TableOfContents(props: {
     space: Space;
@@ -56,7 +55,7 @@ export function TableOfContents(props: {
             )}
         >
             {header ? header : null}
-            <TOCScrollContainerProvider
+            <div
                 className={tcls(
                     withHeaderOffset ? 'pt-4' : ['pt-4', 'lg:pt-0'],
                     'hidden',
@@ -88,7 +87,7 @@ export function TableOfContents(props: {
                 {customization.trademark.enabled ? (
                     <Trademark space={space} customization={customization} />
                 ) : null}
-            </TOCScrollContainerProvider>
+            </div>
         </aside>
     );
 }
diff --git a/packages/gitbook/src/components/TableOfContents/ToggleableLinkItem.tsx b/packages/gitbook/src/components/TableOfContents/ToggleableLinkItem.tsx
index cf63cf078..6610291b3 100644
--- a/packages/gitbook/src/components/TableOfContents/ToggleableLinkItem.tsx
+++ b/packages/gitbook/src/components/TableOfContents/ToggleableLinkItem.tsx
@@ -7,7 +7,6 @@ import React from 'react';
 
 import { tcls } from '@/lib/tailwind';
 
-import { useScrollToActiveTOCItem } from './useScrollToActiveTOCItem';
 import { Link } from '../primitives';
 
 const show = {
@@ -47,7 +46,6 @@ export function ToggleableLinkItem(props: {
 
     const [scope, animate] = useAnimate();
     const [isVisible, setIsVisible] = React.useState(hasActiveDescendant);
-    const linkRef = React.createRef<HTMLAnchorElement>();
 
     // Update the visibility of the children, if we are navigating to a descendant.
     React.useEffect(() => {
@@ -92,15 +90,12 @@ export function ToggleableLinkItem(props: {
     const mountedRef = React.useRef(false);
     React.useEffect(() => {
         mountedRef.current = true;
-    });
-
-    useScrollToActiveTOCItem({ linkRef, isActive });
+    }, []);
 
     return (
         <div>
             <Link
                 href={href}
-                ref={linkRef}
                 aria-selected={isActive}
                 className={tcls(
                     'group/toclink',
diff --git a/packages/gitbook/src/components/TableOfContents/useScrollToActiveTOCItem.tsx b/packages/gitbook/src/components/TableOfContents/useScrollToActiveTOCItem.tsx
deleted file mode 100644
index 78b75f0ba..000000000
--- a/packages/gitbook/src/components/TableOfContents/useScrollToActiveTOCItem.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-'use client';
-
-import React from 'react';
-
-const TOCScrollContainerContext = React.createContext<React.RefObject<HTMLDivElement> | null>(null);
-
-export function TOCScrollContainerProvider(
-    props: React.PropsWithChildren<{
-        className: React.HTMLAttributes<HTMLDivElement>['className'];
-    }>,
-) {
-    const { className, children } = props;
-    const scrollContainerRef = React.createRef<HTMLDivElement>();
-
-    return (
-        <TOCScrollContainerContext.Provider value={scrollContainerRef}>
-            <div ref={scrollContainerRef} className={className}>
-                {children}
-            </div>
-        </TOCScrollContainerContext.Provider>
-    );
-}
-
-// Offset to scroll the table of contents item by.
-const TOC_ITEM_OFFSET = 200;
-
-/**
- * Scrolls the table of contents container to the page item when it becomes active,
- * but only if the item is outside the viewable area of the container.
- */
-export function useScrollToActiveTOCItem(tocItem: {
-    isActive: boolean;
-    linkRef: React.RefObject<HTMLAnchorElement>;
-}) {
-    const { isActive, linkRef } = tocItem;
-
-    const scrollContainerRef = React.useContext(TOCScrollContainerContext);
-    React.useLayoutEffect(() => {
-        if (isActive && linkRef.current && scrollContainerRef?.current) {
-            const tocItem = linkRef.current;
-            const tocContainer = scrollContainerRef.current;
-
-            if (tocContainer) {
-                const tocItemTop = tocItem.offsetTop;
-                const containerTop = tocContainer.scrollTop;
-                const containerBottom = containerTop + tocContainer.clientHeight;
-
-                // Only scroll if the TOC item is outside the viewable area of the container
-                if (
-                    tocItemTop < containerTop + TOC_ITEM_OFFSET ||
-                    tocItemTop > containerBottom - TOC_ITEM_OFFSET
-                ) {
-                    tocContainer.scrollTo({
-                        top: tocItemTop - TOC_ITEM_OFFSET,
-                    });
-                }
-            }
-        }
-    }, [isActive, linkRef, scrollContainerRef]);
-}