Fix configuration for v2 staging (#2940)

Author: SamyPesse

packages/gitbook-v2/src/app/~gitbook/env/route.ts

@@ -5,6 +5,7 @@ import {
     GITBOOK_APP_URL,
     GITBOOK_ASSETS_URL,
     GITBOOK_DISABLE_TRACKING,
+    GITBOOK_ICONS_URL,
     GITBOOK_INTEGRATIONS_HOST,
     GITBOOK_URL,
     GITBOOK_USER_AGENT,
@@ -19,6 +20,7 @@ export async function GET(_req: NextRequest) {
         GITBOOK_APP_URL,
         GITBOOK_API_URL,
         GITBOOK_ASSETS_URL,
+        GITBOOK_ICONS_URL,
         GITBOOK_USER_AGENT,
         GITBOOK_INTEGRATIONS_HOST,
         GITBOOK_DISABLE_TRACKING,

packages/gitbook-v2/src/lib/data/index.ts

@@ -3,3 +3,4 @@ export * from './types';
 export * from './pages';
 export * from './urls';
 export * from './errors';
+export * from './lookup';

packages/gitbook-v2/src/lib/data/lookup.ts

@@ -0,0 +1,118 @@
+import { race, tryCatch } from '@/lib/async';
+import { joinPath } from '@/lib/paths';
+import { GitBookAPI, type GitBookAPIError, type PublishedSiteContentLookup } from '@gitbook/api';
+import { GITBOOK_API_TOKEN, GITBOOK_API_URL, GITBOOK_USER_AGENT } from '@v2/lib/env';
+import { getURLLookupAlternatives, stripURLSearch } from './urls';
+
+/**
+ * Lookup a content by its URL using the GitBook API.
+ * To optimize caching, we try multiple lookup alternatives and return the first one that matches.
+ */
+export async function getPublishedContentByURL(input: {
+    url: string;
+    visitorAuthToken: string | null;
+    redirectOnError: boolean;
+}): Promise<
+    | { data: PublishedSiteContentLookup; error?: undefined }
+    | { data?: undefined; error: Error | GitBookAPIError }
+> {
+    const lookupURL = new URL(input.url);
+    const url = stripURLSearch(lookupURL);
+    const lookup = getURLLookupAlternatives(url);
+
+    const result = await race(lookup.urls, async (alternative, { signal }) => {
+        const api = new GitBookAPI({
+            authToken: GITBOOK_API_TOKEN ?? undefined,
+            endpoint: GITBOOK_API_URL,
+            userAgent: GITBOOK_USER_AGENT,
+        });
+
+        const callResult = await tryCatch(
+            api.urls.getPublishedContentByUrl(
+                {
+                    url: alternative.url,
+                    visitorAuthToken: input.visitorAuthToken ?? undefined,
+                    redirectOnError: input.redirectOnError,
+                    cache: true,
+                },
+                {
+                    signal,
+                    headers: {
+                        'x-gitbook-force-cache': 'true',
+                    },
+                }
+            )
+        );
+
+        if (callResult.error) {
+            if (alternative.primary) {
+                // We only return an error for the primary alternative (full URL),
+                // as other parts could result in errors due to the URL being incomplete (share links, etc).
+                return { error: callResult.error };
+            }
+            return null;
+        }
+
+        const {
+            data: { data },
+        } = callResult;
+
+        if ('redirect' in data) {
+            if (alternative.primary) {
+                // Append the path to the redirect URL
+                // because we might have matched a shorter path and the redirect is relative to it
+                if (alternative.extraPath) {
+                    if (data.target === 'content') {
+                        const redirect = new URL(data.redirect);
+                        redirect.pathname = joinPath(redirect.pathname, alternative.extraPath);
+                        data.redirect = redirect.toString();
+                    } else {
+                        const redirect = new URL(data.redirect);
+                        if (redirect.searchParams.has('location')) {
+                            redirect.searchParams.set(
+                                'location',
+                                joinPath(
+                                    redirect.searchParams.get('location') ?? '',
+                                    alternative.extraPath
+                                )
+                            );
+                            data.redirect = redirect.toString();
+                        }
+                    }
+                }
+
+                return { data };
+            }
+
+            return null;
+        }
+
+        /**
+         * We use the following criteria to determine if the lookup result is the right one:
+         * - the primary alternative was resolved (because that's the longest or most inclusive path)
+         * - the resolution of the site URL is complete (because we want to resolve the deepest path possible)
+         *
+         * In both cases, the idea is to use the deepest/longest/most inclusive path to resolve the content.
+         */
+        if (alternative.primary || ('site' in data && data.complete)) {
+            const siteResult: PublishedSiteContentLookup = {
+                ...data,
+                changeRequest: data.changeRequest ?? lookup.changeRequest,
+                revision: data.revision ?? lookup.revision,
+                basePath: joinPath(data.basePath, lookup.basePath ?? ''),
+                pathname: joinPath(data.pathname, alternative.extraPath),
+            };
+            return { data: siteResult };
+        }
+
+        return null;
+    });
+
+    if (!result) {
+        return {
+            error: new Error('No content found'),
+        };
+    }
+
+    return result;
+}

packages/gitbook-v2/src/lib/data/urls.ts

@@ -1,121 +1,3 @@
-import { race, tryCatch } from '@/lib/async';
-import { joinPath } from '@/lib/paths';
-import { GitBookAPI, type GitBookAPIError, type PublishedSiteContentLookup } from '@gitbook/api';
-import { GITBOOK_API_TOKEN, GITBOOK_API_URL, GITBOOK_USER_AGENT } from '@v2/lib/env';
-
-/**
- * Lookup a content by its URL using the GitBook API.
- * To optimize caching, we try multiple lookup alternatives and return the first one that matches.
- */
-export async function getPublishedContentByURL(input: {
-    url: string;
-    visitorAuthToken: string | null;
-    redirectOnError: boolean;
-}): Promise<
-    | { data: PublishedSiteContentLookup; error?: undefined }
-    | { data?: undefined; error: Error | GitBookAPIError }
-> {
-    const lookupURL = new URL(input.url);
-    const url = stripURLSearch(lookupURL);
-    const lookup = getURLLookupAlternatives(url);
-
-    const result = await race(lookup.urls, async (alternative, { signal }) => {
-        const api = new GitBookAPI({
-            authToken: GITBOOK_API_TOKEN ?? undefined,
-            endpoint: GITBOOK_API_URL,
-            userAgent: GITBOOK_USER_AGENT,
-        });
-
-        const callResult = await tryCatch(
-            api.urls.getPublishedContentByUrl(
-                {
-                    url: alternative.url,
-                    visitorAuthToken: input.visitorAuthToken ?? undefined,
-                    redirectOnError: input.redirectOnError,
-                    cache: true,
-                },
-                {
-                    signal,
-                    headers: {
-                        'x-gitbook-force-cache': 'true',
-                    },
-                }
-            )
-        );
-
-        if (callResult.error) {
-            if (alternative.primary) {
-                // We only return an error for the primary alternative (full URL),
-                // as other parts could result in errors due to the URL being incomplete (share links, etc).
-                return { error: callResult.error };
-            }
-            return null;
-        }
-
-        const {
-            data: { data },
-        } = callResult;
-
-        if ('redirect' in data) {
-            if (alternative.primary) {
-                // Append the path to the redirect URL
-                // because we might have matched a shorter path and the redirect is relative to it
-                if (alternative.extraPath) {
-                    if (data.target === 'content') {
-                        const redirect = new URL(data.redirect);
-                        redirect.pathname = joinPath(redirect.pathname, alternative.extraPath);
-                        data.redirect = redirect.toString();
-                    } else {
-                        const redirect = new URL(data.redirect);
-                        if (redirect.searchParams.has('location')) {
-                            redirect.searchParams.set(
-                                'location',
-                                joinPath(
-                                    redirect.searchParams.get('location') ?? '',
-                                    alternative.extraPath
-                                )
-                            );
-                            data.redirect = redirect.toString();
-                        }
-                    }
-                }
-
-                return { data };
-            }
-
-            return null;
-        }
-
-        /**
-         * We use the following criteria to determine if the lookup result is the right one:
-         * - the primary alternative was resolved (because that's the longest or most inclusive path)
-         * - the resolution of the site URL is complete (because we want to resolve the deepest path possible)
-         *
-         * In both cases, the idea is to use the deepest/longest/most inclusive path to resolve the content.
-         */
-        if (alternative.primary || ('site' in data && data.complete)) {
-            const siteResult: PublishedSiteContentLookup = {
-                ...data,
-                changeRequest: data.changeRequest ?? lookup.changeRequest,
-                revision: data.revision ?? lookup.revision,
-                basePath: joinPath(data.basePath, lookup.basePath ?? ''),
-                pathname: joinPath(data.pathname, alternative.extraPath),
-            };
-            return { data: siteResult };
-        }
-
-        return null;
-    });
-
-    if (!result) {
-        return {
-            error: new Error('No content found'),
-        };
-    }
-
-    return result;
-}
-
 /**
  * For a given GitBook URL, return a list of alternative URLs that could be matched against to lookup the content.
  * The approach is optimized to aim at reusing cached lookup results as much as possible.

packages/gitbook-v2/src/lib/env/globals.ts

@@ -1,3 +1,11 @@
+import 'server-only';
+
+/*
+ * Support both Cloudflare and Vercel, environment variables can be bundled.
+ * To avoid leaking them on the client-side, they should be accessed from this file
+ * and not from the `process.env` object.
+ */
+
 /**
  * Main host on which GitBook is running.
  */
@@ -19,7 +27,7 @@ export const GITBOOK_ASSETS_URL =
 /**
  * GitBook app URL.
  */
-export const GITBOOK_APP_URL = process.env.NEXT_PUBLIC_GITBOOK_APP_URL || 'https://app.gitbook.com';
+export const GITBOOK_APP_URL = process.env.GITBOOK_APP_URL || 'https://app.gitbook.com';
 
 /**
  * Default GitBook API URL endpoint.
@@ -59,6 +67,17 @@ export const GITBOOK_IMAGE_RESIZE_URL = process.env.GITBOOK_IMAGE_RESIZE_URL ??
 export const GITBOOK_IMAGE_RESIZE_SIGNING_KEY =
     process.env.GITBOOK_IMAGE_RESIZE_SIGNING_KEY ?? null;
 
+/**
+ * Endpoint where icons are served.
+ */
+export const GITBOOK_ICONS_URL =
+    process.env.GITBOOK_ICONS_URL || `${GITBOOK_ASSETS_URL}/~gitbook/static/icons`;
+
+/**
+ * Token passed to the icons endpoint.
+ */
+export const GITBOOK_ICONS_TOKEN = process.env.GITBOOK_ICONS_TOKEN;
+
 /**
  * Secret used to validate requests from the GitBook app.
  */

packages/gitbook/src/components/Insights/InsightsProvider.tsx

@@ -63,6 +63,7 @@ const InsightsContext = React.createContext<TrackEventCallback>(() => {});
 
 interface InsightsProviderProps extends InsightsEventContext {
     enabled: boolean;
+    appURL: string;
     apiHost: string;
     visitorAuthToken: string | null;
     children: React.ReactNode;
@@ -72,7 +73,7 @@ interface InsightsProviderProps extends InsightsEventContext {
  * Wrap the content of the app with the InsightsProvider to track events.
  */
 export function InsightsProvider(props: InsightsProviderProps) {
-    const { enabled, apiHost, visitorAuthToken, children, ...context } = props;
+    const { enabled, appURL, apiHost, visitorAuthToken, children, ...context } = props;
 
     const visitorIdRef = React.useRef<string | null>(null);
     const eventsRef = React.useRef<{
@@ -140,7 +141,7 @@ export function InsightsProvider(props: InsightsProviderProps) {
     });
 
     const flushBatchedEvents = useDebounceCallback(async () => {
-        const visitorId = visitorIdRef.current ?? (await getVisitorId());
+        const visitorId = visitorIdRef.current ?? (await getVisitorId(appURL));
         visitorIdRef.current = visitorId;
 
         flushEventsSync();
@@ -184,15 +185,15 @@ export function InsightsProvider(props: InsightsProviderProps) {
      * Get the visitor ID and store it in a ref.
      */
     React.useEffect(() => {
-        getVisitorId().then((visitorId) => {
+        getVisitorId(appURL).then((visitorId) => {
             visitorIdRef.current = visitorId;
             // When the page is unloaded, flush all events, but only if the visitor ID is set
             window.addEventListener('beforeunload', flushEventsSync);
         });
         return () => {
             window.removeEventListener('beforeunload', flushEventsSync);
         };
-    }, [flushEventsSync]);
+    }, [flushEventsSync, appURL]);
 
     return (
         <InsightsContext.Provider value={trackEvent}>

packages/gitbook/src/components/Insights/visitorId.ts

@@ -13,10 +13,10 @@ let pendingVisitorId: Promise<string> | null = null;
 /**
  * Return the current visitor identifier.
  */
-export async function getVisitorId(): Promise<string> {
+export async function getVisitorId(appURL: string): Promise<string> {
     if (!visitorId) {
         if (!pendingVisitorId) {
-            pendingVisitorId = fetchVisitorID().finally(() => {
+            pendingVisitorId = fetchVisitorID(appURL).finally(() => {
                 pendingVisitorId = null;
             });
         }
@@ -30,7 +30,7 @@ export async function getVisitorId(): Promise<string> {
 /**
  * Propose a visitor identifier to the GitBook.com server and get the devideId back.
  */
-async function fetchVisitorID(): Promise<string> {
+async function fetchVisitorID(appURL: string): Promise<string> {
     const withoutCookies = isCookiesTrackingDisabled();
 
     if (withoutCookies) {
@@ -46,7 +46,7 @@ async function fetchVisitorID(): Promise<string> {
     // No tracking deviceId set, we'll need to consolidate with the server.
     const proposed = generateRandomId();
 
-    const url = new URL(process.env.NEXT_PUBLIC_GITBOOK_APP_URL ?? 'https://app.gitbook.com');
+    const url = new URL(appURL);
     url.pathname = '/__session';
     url.searchParams.set('proposed', proposed);
 

packages/gitbook/src/components/RootLayout/CustomizationRootLayout.tsx

@@ -31,6 +31,7 @@ import { ClientContexts } from './ClientContexts';
 
 import '@gitbook/icons/style.css';
 import './globals.css';
+import { GITBOOK_ICONS_TOKEN, GITBOOK_ICONS_URL } from '@v2/lib/env';
 
 /**
  * Layout shared between the content and the PDF renderer.
@@ -127,8 +128,8 @@ export async function CustomizationRootLayout(props: {
                 )}
             >
                 <IconsProvider
-                    assetsURL={process.env.GITBOOK_ICONS_URL ?? getAssetURL('icons')}
-                    assetsURLToken={process.env.GITBOOK_ICONS_TOKEN}
+                    assetsURL={GITBOOK_ICONS_URL}
+                    assetsURLToken={GITBOOK_ICONS_TOKEN}
                     assetsByStyles={{
                         'custom-icons': {
                             assetsURL: getAssetURL('icons'),