diff --git a/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/page.tsx b/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/demo/page.tsx similarity index 87% rename from packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/page.tsx rename to packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/demo/page.tsx index 5f78a91cf..7c5ccb372 100644 --- a/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/page.tsx +++ b/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/demo/page.tsx @@ -1,6 +1,6 @@ import { type RouteLayoutParams, getDynamicSiteContext } from '@/app/utils'; import { StructurePreview } from '@/components/StructurePreview'; -import { getStructurePreviewSnapshot } from './snapshot'; +import { getStructurePreviewSnapshot } from '../snapshot'; type PageProps = { params: Promise; diff --git a/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/test/page.tsx b/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/test/page.tsx deleted file mode 100644 index 044360df1..000000000 --- a/packages/gitbook/src/app/sites/dynamic/[mode]/[siteURL]/[siteData]/~gitbook/structure/test/page.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { type RouteLayoutParams, getDynamicSiteContext } from '@/app/utils'; -import { StructurePreviewTest } from '@/components/StructurePreview/StructurePreviewTest'; -import { getStructurePreviewSnapshot } from '../snapshot'; - -type PageProps = { - params: Promise; -}; - -export default async function Page(props: PageProps) { - const { context } = await getDynamicSiteContext(await props.params); - return ; -} diff --git a/packages/gitbook/src/components/StructurePreview/StructurePreviewTest.tsx b/packages/gitbook/src/components/StructurePreview/StructurePreviewTest.tsx deleted file mode 100644 index 703404a18..000000000 --- a/packages/gitbook/src/components/StructurePreview/StructurePreviewTest.tsx +++ /dev/null @@ -1,187 +0,0 @@ -'use client'; - -import * as React from 'react'; - -import { isStructurePreviewNavigationMessage, isStructurePreviewUpdate } from './state'; -import type { - StructurePreviewMessage, - StructurePreviewSnapshot, - StructurePreviewUpdate, -} from './types'; - -export function StructurePreviewTest(props: { initialSnapshot: StructurePreviewSnapshot }) { - const { initialSnapshot } = props; - const iframeRef = React.useRef(null); - const latestUpdateRef = React.useRef( - pickEditableSnapshot(initialSnapshot) - ); - const [iframeSrc, setIframeSrc] = React.useState(); - const [json, setJson] = React.useState(() => - stringifyStructurePreviewUpdate(pickEditableSnapshot(initialSnapshot)) - ); - const [error, setError] = React.useState(null); - const [navigationNotification, setNavigationNotification] = React.useState<{ - sectionId: string; - receivedAt: number; - } | null>(null); - - const postUpdate = React.useCallback((update: StructurePreviewUpdate) => { - const targetWindow = iframeRef.current?.contentWindow; - if (!targetWindow) { - return; - } - - const message: StructurePreviewMessage = { - type: 'gitbook.structure.update', - payload: update, - }; - targetWindow.postMessage(message, window.location.origin); - }, []); - - React.useEffect(() => { - const url = new URL(window.location.href); - url.pathname = url.pathname.replace(/\/test\/?$/, ''); - setIframeSrc(url.toString()); - }, []); - - React.useEffect(() => { - const handleMessage = (event: MessageEvent) => { - if ( - event.origin !== window.location.origin || - event.source !== iframeRef.current?.contentWindow || - !isStructurePreviewNavigationMessage(event.data) - ) { - return; - } - - //In a real case, here we should update variants and siteSpace to reflect the section we are currently in - setNavigationNotification({ - sectionId: event.data.payload.sectionId, - receivedAt: Date.now(), - }); - }; - - window.addEventListener('message', handleMessage); - return () => window.removeEventListener('message', handleMessage); - }, []); - - React.useEffect(() => { - if (!navigationNotification) { - return; - } - - const timeout = window.setTimeout(() => setNavigationNotification(null), 3000); - return () => window.clearTimeout(timeout); - }, [navigationNotification]); - - const handleJsonChange = (event: React.ChangeEvent) => { - const nextJson = event.target.value; - setJson(nextJson); - - const parsedUpdate = parseStructurePreviewUpdate(nextJson); - if (!parsedUpdate.ok) { - setError(parsedUpdate.error); - return; - } - - setError(null); - latestUpdateRef.current = parsedUpdate.value; - postUpdate(parsedUpdate.value); - }; - - return ( -
-
-
-

- Structure preview test -

-

- Update sections, variants, and site space JSON in realtime. -

-
-
- {error ? 'Invalid JSON' : 'Synced'} -
-
-
-
-
- -