Use appropriate customization settings for sites (GitbookIO#2279)

Author: taranvohra

src/app/(space)/(content)/[[...pathname]]/not-found.tsx

@@ -1,11 +1,14 @@
 import { getSpaceLanguage, t } from '@/intl/server';
-import { getSpaceLayoutData } from '@/lib/api';
+import { getSiteSpaceLayoutData, getSpaceLayoutData } from '@/lib/api';
 import { tcls } from '@/lib/tailwind';
 
 import { getContentPointer } from '../../fetch';
 
 export default async function NotFound() {
- const { customization } = await getSpaceLayoutData(getContentPointer().spaceId);
+ const pointer = getContentPointer();
+ const { customization } = await ('siteId' in pointer
+ ? getSiteSpaceLayoutData(pointer)
+ : getSpaceLayoutData(pointer.spaceId));
 
  const language = getSpaceLanguage(customization);
 

src/app/(space)/(core)/~gitbook/icon/route.tsx

@@ -5,7 +5,13 @@ import { NextRequest } from 'next/server';
 import React from 'react';
 
 import { getContentPointer } from '@/app/(space)/fetch';
-import { getCollection, getSpace, getSpaceCustomization } from '@/lib/api';
+import {
+ getCollection,
+ getSite,
+ getSiteSpaceCustomization,
+ getSpace,
+ getSpaceCustomization,
+} from '@/lib/api';
 import { getEmojiForCode } from '@/lib/emojis';
 import { tcls } from '@/lib/tailwind';
 
@@ -35,17 +41,20 @@ export async function GET(req: NextRequest) {
  const options = getOptions(req.url);
  const size = SIZES[options.size];
 
- const spaceId = getContentPointer().spaceId;
+ const pointer = getContentPointer();
+ const spaceId = pointer.spaceId;
 
  const [space, customization] = await Promise.all([
  getSpace(spaceId),
- getSpaceCustomization(spaceId),
+ 'siteId' in pointer ? getSiteSpaceCustomization(pointer) : getSpaceCustomization(spaceId),
  ]);
- const collection =
- space.visibility === ContentVisibility.InCollection && space.parent
- ? await getCollection(space.parent)
- : null;
- const contentTitle = collection?.title ?? customization.title ?? space.title;
+ const parent =
+ 'siteId' in pointer
+ ? await getSite(pointer.organizationId, pointer.siteId)
+ : space.visibility === ContentVisibility.InCollection && space.parent
+ ? await getCollection(space.parent)
+ : null;
+ const contentTitle = parent?.title ?? customization.title ?? space.title;
 
  return new ImageResponse(
  (

src/app/(space)/(core)/~gitbook/pdf/page.tsx

@@ -4,6 +4,7 @@ import {
  Revision,
  RevisionPageDocument,
  RevisionPageGroup,
+ SiteCustomizationSettings,
  Space,
 } from '@gitbook/api';
 import { Metadata } from 'next';
@@ -16,7 +17,13 @@ import { TrademarkLink } from '@/components/TableOfContents/Trademark';
 import { PolymorphicComponentProp } from '@/components/utils/types';
 import { getSpaceLanguage } from '@/intl/server';
 import { tString } from '@/intl/translate';
-import { getDocument, getSpace, getSpaceCustomization, getSpaceContentData } from '@/lib/api';
+import {
+ getDocument,
+ getSpace,
+ getSpaceCustomization,
+ getSpaceContentData,
+ getSiteSpaceCustomization,
+} from '@/lib/api';
 import { pagePDFContainerId, PageHrefContext, absoluteHref } from '@/lib/links';
 import { resolvePageId } from '@/lib/pages';
 import { ContentRefContext, resolveContentRef } from '@/lib/references';
@@ -35,7 +42,9 @@ export async function generateMetadata(): Promise<Metadata> {
  const contentPointer = getContentPointer();
  const [space, customization] = await Promise.all([
  getSpace(contentPointer.spaceId),
- getSpaceCustomization(contentPointer.spaceId),
+ 'siteId' in contentPointer
+ ? getSiteSpaceCustomization(contentPointer)
+ : getSpaceCustomization(contentPointer.spaceId),
  ]);
 
  return {
@@ -59,7 +68,9 @@ export default async function PDFHTMLOutput(props: { searchParams: { [key: strin
 
  // Load the content,
  const [customization, { space, contentTarget, pages: rootPages }] = await Promise.all([
- getSpaceCustomization(contentPointer.spaceId),
+ 'siteId' in contentPointer
+ ? getSiteSpaceCustomization(contentPointer)
+ : getSpaceCustomization(contentPointer.spaceId),
  getSpaceContentData(contentPointer),
  ]);
  const language = getSpaceLanguage(customization);
@@ -172,7 +183,10 @@ export default async function PDFHTMLOutput(props: { searchParams: { [key: strin
  );
 }
 
-async function PDFSpaceIntro(props: { space: Space; customization: CustomizationSettings }) {
+async function PDFSpaceIntro(props: {
+ space: Space;
+ customization: CustomizationSettings | SiteCustomizationSettings;
+}) {
  const { space, customization } = props;
 
  return (

src/app/(space)/fetch.ts

@@ -95,11 +95,15 @@ export async function fetchSpaceData() {
  */
 export async function fetchPageData(params: PagePathParams | PageIdParams) {
  const content = getContentPointer();
- const { space, contentTarget, pages, customization, scripts } = await getSpaceData(content);
+ const { space, contentTarget, pages, customization, scripts } = await ('siteId' in content
+ ? getSiteSpaceData(content)
+ : getSpaceData(content));
 
  const page = await resolvePage(contentTarget, pages, params);
- const [collection, document] = await Promise.all([
- fetchParentCollection(space),
+ const [parent, document] = await Promise.all([
+ 'siteId' in content
+ ? fetchParentSite(content.organizationId, content.siteId)
+ : fetchParentCollection(space),
  page?.page.documentId ? getDocument(space.id, page.page.documentId) : null,
  ]);
 
@@ -112,7 +116,7 @@ export async function fetchPageData(params: PagePathParams | PageIdParams) {
  scripts,
  ancestors: [],
  ...page,
- ...collection,
+ ...parent,
  document,
  };
 }

src/app/(space)/layout.tsx

@@ -3,14 +3,15 @@ import {
  CustomizationCorners,
  CustomizationHeaderPreset,
  CustomizationSettings,
+ SiteCustomizationSettings,
 } from '@gitbook/api';
 import assertNever from 'assert-never';
 import colors from 'tailwindcss/colors';
 
 import { emojiFontClassName } from '@/components/primitives';
 import { fonts, ibmPlexMono } from '@/fonts';
 import { getSpaceLanguage } from '@/intl/server';
-import { getSpaceLayoutData } from '@/lib/api';
+import { getSiteSpaceLayoutData, getSpaceLayoutData } from '@/lib/api';
 import { hexToRgb, shadesOfColor } from '@/lib/colors';
 import { tcls } from '@/lib/tailwind';
 
@@ -25,7 +26,10 @@ import { getContentPointer } from './fetch';
 export default async function SpaceRootLayout(props: { children: React.ReactNode }) {
  const { children } = props;
 
- const { customization } = await getSpaceLayoutData(getContentPointer().spaceId);
+ const pointer = getContentPointer();
+ const { customization } = await ('siteId' in pointer
+ ? getSiteSpaceLayoutData(pointer)
+ : getSpaceLayoutData(pointer.spaceId));
  const headerTheme = generateHeaderTheme(customization);
  const language = getSpaceLanguage(customization);
 
@@ -120,7 +124,7 @@ function generateColorVariable(name: string, color: ColorInput) {
  .join('\n');
 }
 
-function generateHeaderTheme(customization: CustomizationSettings): {
+function generateHeaderTheme(customization: CustomizationSettings | SiteCustomizationSettings): {
  backgroundColor: { light: ColorInput; dark: ColorInput };
  linkColor: { light: ColorInput; dark: ColorInput };
 } {

src/components/PageAside/PageAside.tsx

@@ -2,7 +2,13 @@ import { Menu } from '@geist-ui/icons';
 import DownloadCloud from '@geist-ui/icons/downloadCloud';
 import Github from '@geist-ui/icons/github';
 import Gitlab from '@geist-ui/icons/gitlab';
-import { CustomizationSettings, JSONDocument, RevisionPageDocument, Space } from '@gitbook/api';
+import {
+ CustomizationSettings,
+ JSONDocument,
+ RevisionPageDocument,
+ SiteCustomizationSettings,
+ Space,
+} from '@gitbook/api';
 import React from 'react';
 import urlJoin from 'url-join';
 
@@ -21,7 +27,7 @@ import { PageFeedbackForm } from '../PageFeedback';
  */
 export async function PageAside(props: {
  space: Space;
- customization: CustomizationSettings;
+ customization: CustomizationSettings | SiteCustomizationSettings;
  page: RevisionPageDocument;
  document: JSONDocument | null;
  context: ContentRefContext;

src/components/PageBody/PageBody.tsx

@@ -1,4 +1,10 @@
-import { CustomizationSettings, JSONDocument, RevisionPageDocument, Space } from '@gitbook/api';
+import {
+ CustomizationSettings,
+ JSONDocument,
+ RevisionPageDocument,
+ SiteCustomizationSettings,
+ Space,
+} from '@gitbook/api';
 import React from 'react';
 
 import { getSpaceLanguage } from '@/intl/server';
@@ -20,7 +26,7 @@ import { DateRelative } from '../primitives';
 export function PageBody(props: {
  space: Space;
  contentTarget: ContentTarget;
- customization: CustomizationSettings;
+ customization: CustomizationSettings | SiteCustomizationSettings;
  page: RevisionPageDocument;
  document: JSONDocument | null;
  context: ContentRefContext;

src/components/PageBody/PageFooterNavigation.tsx

@@ -1,6 +1,12 @@
 import ChevronLeft from '@geist-ui/icons/chevronLeft';
 import ChevronRight from '@geist-ui/icons/chevronRight';
-import { CustomizationSettings, Revision, RevisionPageDocument, Space } from '@gitbook/api';
+import {
+ CustomizationSettings,
+ Revision,
+ RevisionPageDocument,
+ SiteCustomizationSettings,
+ Space,
+} from '@gitbook/api';
 import React from 'react';
 
 import { t, getSpaceLanguage } from '@/intl/server';
@@ -15,7 +21,7 @@ import { Link } from '../primitives';
  */
 export function PageFooterNavigation(props: {
  space: Space;
- customization: CustomizationSettings;
+ customization: CustomizationSettings | SiteCustomizationSettings;
  pages: Revision['pages'];
  page: RevisionPageDocument;
 }) {