Fixes

packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx

@@ -105,7 +105,6 @@ export function SpaceLayout(props: {
                                 )}
                             >
                                 <TableOfContents
-                                    context={context}
                                     header={
                                         withTopHeader ? null : (
                                             <div

packages/gitbook/src/components/TableOfContents/TOCScrollContent.tsx

@@ -1,16 +1,19 @@
 import { PagesList } from '@/components/TableOfContents';
 import { Trademark } from '@/components/TableOfContents';
 import { TOCScrollContainer } from '@/components/TableOfContents/TOCScroller';
+import { encodeClientTableOfContents } from '@/components/TableOfContents/encodeClientTableOfContents';
+import type { GitBookSiteContext } from '@/lib/context';
 import { tcls } from '@/lib/tailwind';
 import { SiteInsightsTrademarkPlacement } from '@gitbook/api';
-import type { GitBookSiteContext } from '@v2/lib/context';
 
-export function TOCScrollContent(props: {
+export async function TOCScrollContent(props: {
     context: GitBookSiteContext;
     innerHeader?: React.ReactNode;
 }) {
     const { context, innerHeader } = props;
-    const { customization } = context;
+    const { customization, revision } = context;
+
+    const pages = await encodeClientTableOfContents(context, revision.pages, revision.pages);
 
     return (
         <div // The actual sidebar, either shown with a filled bg or transparent.
@@ -51,9 +54,7 @@ export function TOCScrollContent(props: {
                 )}
             >
                 <PagesList
-                    rootPages={context.pages}
-                    pages={context.pages}
-                    context={context}
+                    pages={pages}
                     style="page-no-toc:hidden border-tint-subtle sidebar-list-line:border-l"
                 />
                 {customization.trademark.enabled ? (

packages/gitbook/src/components/TableOfContents/TableOfContents.tsx

@@ -3,12 +3,10 @@
 import { MobileMenuScript, useMobileMenuSheet } from '@/components/MobileMenu';
 import { TableOfContentsScript } from '@/components/TableOfContents/TableOfContentsScript';
 import { Button } from '@/components/primitives';
-import type { GitBookSiteContext } from '@/lib/context';
 import { tcls } from '@/lib/tailwind';
 import type React from 'react';
 
 export function TableOfContents(props: {
-    context: GitBookSiteContext;
     header?: React.ReactNode; // Displayed outside the scrollable TOC as a sticky header
     children: React.ReactNode;
 }) {
@@ -108,8 +106,9 @@ export function TableOfContents(props: {
                         variant="secondary"
                         icon="close"
                         iconOnly
+                        size="medium"
                         autoFocus={false}
-                        className="absolute top-2 right-2 z-50 bg-transparent text-tint opacity-8 shadow-none ring-transparent lg:hidden"
+                        className="absolute top-2 right-2 z-50 aspect-square bg-transparent text-tint opacity-8 shadow-none ring-transparent lg:hidden"
                         onClick={() => setOpen(false)}
                     >
                         <span className="sr-only">Close</span>