From baf378d5ef6a859b05d7ac72ee5f262cbe6ad16a Mon Sep 17 00:00:00 2001
From: Viktor Renkema <vrenkema@gmail.com>
Date: Tue, 9 Sep 2025 11:25:26 +0200
Subject: [PATCH 1/2] Don't show the preview toolbar when rendering within
 GitBook app preview env

---
 .../src/components/AdminToolbar/AdminToolbar.tsx   | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx b/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
index ea814cc25b..b5689d1b1e 100644
--- a/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
+++ b/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
@@ -1,10 +1,9 @@
 import type { GitBookSiteContext } from '@/lib/context';
 import { Icon } from '@gitbook/icons';
-import { headers } from 'next/headers';
 import React from 'react';
 
+import { isPreviewRequest } from '@/lib/preview';
 import { tcls } from '@/lib/tailwind';
-
 import { DateRelative } from '../primitives';
 import { RefreshChangeRequestButton } from './RefreshChangeRequestButton';
 import { Toolbar, ToolbarBody, ToolbarButton, ToolbarButtonGroups } from './Toolbar';
@@ -47,10 +46,15 @@ function ToolbarLayout(props: { children: React.ReactNode }) {
  */
 export async function AdminToolbar(props: AdminToolbarProps) {
     const { context } = props;
-    const mode = (await headers()).get('x-gitbook-mode');
 
-    if (mode === 'multi-id') {
-        // We don't show the admin toolbar in multi-id mode, as it's used for previewing in the dashboard.
+    // Get the current URL from the linker (which accounts for both static and dynamic routes)
+    const currentURL = new URL(context.linker.toAbsoluteURL('/'));
+
+    // Check if this url is opened within the GitBook app's in-editor preview tab.
+    const isInAppPreview = isPreviewRequest(currentURL);
+
+    // Don't show admin toolbar for preview requests
+    if (isInAppPreview) {
         return null;
     }
 

From 16bf6b9f835f8565f2a9e548093170caaf03efcd Mon Sep 17 00:00:00 2001
From: Viktor Renkema <vrenkema@gmail.com>
Date: Tue, 9 Sep 2025 14:02:48 +0200
Subject: [PATCH 2/2] Detect iframe instead

---
 .../components/AdminToolbar/AdminToolbar.tsx  | 25 ++++++++---------
 .../components/AdminToolbar/IframeWrapper.tsx | 27 +++++++++++++++++++
 .../src/components/AdminToolbar/index.ts      |  1 +
 3 files changed, 39 insertions(+), 14 deletions(-)
 create mode 100644 packages/gitbook/src/components/AdminToolbar/IframeWrapper.tsx

diff --git a/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx b/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
index b5689d1b1e..5faac2a685 100644
--- a/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
+++ b/packages/gitbook/src/components/AdminToolbar/AdminToolbar.tsx
@@ -2,9 +2,9 @@ import type { GitBookSiteContext } from '@/lib/context';
 import { Icon } from '@gitbook/icons';
 import React from 'react';
 
-import { isPreviewRequest } from '@/lib/preview';
 import { tcls } from '@/lib/tailwind';
 import { DateRelative } from '../primitives';
+import { IframeWrapper } from './IframeWrapper';
 import { RefreshChangeRequestButton } from './RefreshChangeRequestButton';
 import { Toolbar, ToolbarBody, ToolbarButton, ToolbarButtonGroups } from './Toolbar';
 
@@ -47,23 +47,20 @@ function ToolbarLayout(props: { children: React.ReactNode }) {
 export async function AdminToolbar(props: AdminToolbarProps) {
     const { context } = props;
 
-    // Get the current URL from the linker (which accounts for both static and dynamic routes)
-    const currentURL = new URL(context.linker.toAbsoluteURL('/'));
-
-    // Check if this url is opened within the GitBook app's in-editor preview tab.
-    const isInAppPreview = isPreviewRequest(currentURL);
-
-    // Don't show admin toolbar for preview requests
-    if (isInAppPreview) {
-        return null;
-    }
-
     if (context.changeRequest) {
-        return <ChangeRequestToolbar context={context} />;
+        return (
+            <IframeWrapper>
+                <ChangeRequestToolbar context={context} />
+            </IframeWrapper>
+        );
     }
 
     if (context.revisionId !== context.space.revision) {
-        return <RevisionToolbar context={context} />;
+        return (
+            <IframeWrapper>
+                <RevisionToolbar context={context} />
+            </IframeWrapper>
+        );
     }
 
     return null;
diff --git a/packages/gitbook/src/components/AdminToolbar/IframeWrapper.tsx b/packages/gitbook/src/components/AdminToolbar/IframeWrapper.tsx
new file mode 100644
index 0000000000..270d41c85f
--- /dev/null
+++ b/packages/gitbook/src/components/AdminToolbar/IframeWrapper.tsx
@@ -0,0 +1,27 @@
+'use client';
+
+import React from 'react';
+
+interface IframeWrapperProps {
+    children: React.ReactNode;
+}
+
+/**
+ * Client component that detects if we're in an iframe and conditionally renders children
+ */
+export function IframeWrapper({ children }: IframeWrapperProps) {
+    const [isInIframe, setIsInIframe] = React.useState(false);
+
+    React.useEffect(() => {
+        // Check if we're running inside an iframe
+        const inIframe = window !== window.parent;
+        setIsInIframe(inIframe);
+    }, []);
+
+    // Don't render children if we're in an iframe (GitBook app preview)
+    if (isInIframe) {
+        return null;
+    }
+
+    return children;
+}
diff --git a/packages/gitbook/src/components/AdminToolbar/index.ts b/packages/gitbook/src/components/AdminToolbar/index.ts
index bcbabf184b..dde5147502 100644
--- a/packages/gitbook/src/components/AdminToolbar/index.ts
+++ b/packages/gitbook/src/components/AdminToolbar/index.ts
@@ -1 +1,2 @@
 export * from './AdminToolbar';
+export * from './IframeWrapper';