Skip to content

Commit 8cce487

Browse files
sbawabesbawabe
committed
move hydration boundaries up
1 parent c7fe02b commit 8cce487

File tree

5 files changed

+167
-196
lines changed

5 files changed

+167
-196
lines changed

‎packages/fern-docs/bundle/src/app/[host]/[domain]/dynamic/@sidebar/[slug]/page.tsx‎

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -87,19 +87,6 @@ export default async function SidebarPage({
8787
}
8888

8989
return (
90-
// <HydrationBoundary
91-
// hydrateAtoms={[
92-
// [
93-
// emptySidebarAtom,
94-
// found.sidebar?.children.length === 0 ||
95-
// (found.sidebar?.children.length === 1 &&
96-
// found.sidebar?.children[0]?.type === "sidebarGroup" &&
97-
// found.sidebar?.children[0].children.length === 1 &&
98-
// found.sidebar?.children[0].children[0]?.type === "page"),
99-
// ],
100-
// ]}
101-
// options={{ enableReHydrate: true }}
102-
// >
10390
<>
10491
{found.tabs && found.tabs.length > 0 && (
10592
<SidebarTabsRootServer loader={loader}>

‎packages/fern-docs/bundle/src/app/[host]/[domain]/layout.tsx‎

Lines changed: 63 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { preload } from "react-dom";
66

77
import { getEnv } from "@vercel/functions";
88
import { compact } from "es-toolkit/array";
9+
import { HydrationBoundary } from "jotai-ssr";
910

1011
import { DocsV1Read, DocsV2Read } from "@fern-api/fdr-sdk/client/types";
1112
import { isNonNullish } from "@fern-api/ui-core-utils";
@@ -28,6 +29,7 @@ import { DarkCode } from "@/state/dark-code";
2829
import { Domain } from "@/state/domain";
2930
import { LaunchDarklyInfo } from "@/state/feature-flags";
3031
import { DefaultLanguage } from "@/state/language";
32+
import { isSidebarFixedAtom } from "@/state/layout";
3133
import { SetLogoText } from "@/state/logo-text";
3234
import { RootNodeProvider, SetBasePath } from "@/state/navigation";
3335
import {
@@ -85,59 +87,71 @@ export default async function Layout({
8587
getSidebarRootNodeIdToChildToParentsMap(sidebarRootNodes);
8688

8789
return (
88-
<ThemeProvider
89-
hasLight={Boolean(colors.light)}
90-
hasDark={Boolean(colors.dark)}
91-
lightThemeColor={colors.light?.themeColor}
92-
darkThemeColor={colors.dark?.themeColor}
90+
<HydrationBoundary
91+
hydrateAtoms={[
92+
[
93+
isSidebarFixedAtom,
94+
!!colors.dark?.sidebarBackground ||
95+
!!colors.light?.sidebarBackground ||
96+
layout.isHeaderDisabled,
97+
],
98+
]}
99+
options={{ enableReHydrate: true }}
93100
>
94-
<RootNodeProvider
95-
sidebarRootNodesToChildToParentsMap={
96-
sidebarRootNodesToChildToParentsMap
97-
}
101+
<ThemeProvider
102+
hasLight={Boolean(colors.light)}
103+
hasDark={Boolean(colors.dark)}
104+
lightThemeColor={colors.light?.themeColor}
105+
darkThemeColor={colors.dark?.themeColor}
98106
>
99-
<Domain value={domain} />
100-
<SetBasePath value={basePath || "/"} />
101-
{/** HACKHACK: this is a hack to set the logo text to "Docs" for Cohere, this needs to be moved into docs.yml */}
102-
<SetLogoText text={domain.includes("cohere") ? "Docs" : undefined} />
103-
{config.defaultLanguage != null && (
104-
<DefaultLanguage language={config.defaultLanguage} />
105-
)}
106-
<DarkCode value={edgeFlags.isDarkCodeEnabled} />
107-
<Whitelabeled value={edgeFlags.isWhitelabeled} />
108-
<SetColors colors={colors} />
109-
<SetIsAskAiEnabled isAskAiEnabled={edgeFlags.isAskAiEnabled} />
110-
<SetIsDefaultSearchFilterOff
111-
isDefaultSearchFilterOff={edgeFlags.isDefaultSearchFilterOff}
112-
/>
113-
<FernUser domain={domain} host={host} />
114-
<GlobalStyles
115-
domain={domain}
116-
layout={layout}
117-
fonts={fonts}
118-
light={colors.light}
119-
dark={colors.dark}
120-
inlineCss={config.css?.inline}
121-
/>
122-
<FeatureFlagProvider featureFlagsConfig={{ launchDarkly }}>
123-
{children}
124-
</FeatureFlagProvider>
125-
<React.Suspense fallback={null}>
126-
{!edgeFlags.isSearchDisabled && !isLocalEnvironment && (
127-
<SearchV2 domain={domain} />
107+
<RootNodeProvider
108+
sidebarRootNodesToChildToParentsMap={
109+
sidebarRootNodesToChildToParentsMap
110+
}
111+
>
112+
<Domain value={domain} />
113+
<SetBasePath value={basePath || "/"} />
114+
{/** HACKHACK: this is a hack to set the logo text to "Docs" for Cohere, this needs to be moved into docs.yml */}
115+
<SetLogoText text={domain.includes("cohere") ? "Docs" : undefined} />
116+
{config.defaultLanguage != null && (
117+
<DefaultLanguage language={config.defaultLanguage} />
128118
)}
129-
</React.Suspense>
130-
{jsConfig != null && <JavascriptProvider config={jsConfig} />}
131-
{VERCEL_ENV === "production" && (
132-
<CustomerAnalytics
133-
config={mergeCustomerAnalytics(
134-
deprecated_customerAnalytics,
135-
config.analyticsConfig
136-
)}
119+
<DarkCode value={edgeFlags.isDarkCodeEnabled} />
120+
<Whitelabeled value={edgeFlags.isWhitelabeled} />
121+
<SetColors colors={colors} />
122+
<SetIsAskAiEnabled isAskAiEnabled={edgeFlags.isAskAiEnabled} />
123+
<SetIsDefaultSearchFilterOff
124+
isDefaultSearchFilterOff={edgeFlags.isDefaultSearchFilterOff}
125+
/>
126+
<FernUser domain={domain} host={host} />
127+
<GlobalStyles
128+
domain={domain}
129+
layout={layout}
130+
fonts={fonts}
131+
light={colors.light}
132+
dark={colors.dark}
133+
inlineCss={config.css?.inline}
137134
/>
138-
)}
139-
</RootNodeProvider>
140-
</ThemeProvider>
135+
<FeatureFlagProvider featureFlagsConfig={{ launchDarkly }}>
136+
{children}
137+
</FeatureFlagProvider>
138+
<React.Suspense fallback={null}>
139+
{!edgeFlags.isSearchDisabled && !isLocalEnvironment && (
140+
<SearchV2 domain={domain} />
141+
)}
142+
</React.Suspense>
143+
{jsConfig != null && <JavascriptProvider config={jsConfig} />}
144+
{VERCEL_ENV === "production" && (
145+
<CustomerAnalytics
146+
config={mergeCustomerAnalytics(
147+
deprecated_customerAnalytics,
148+
config.analyticsConfig
149+
)}
150+
/>
151+
)}
152+
</RootNodeProvider>
153+
</ThemeProvider>
154+
</HydrationBoundary>
141155
);
142156
}
143157

‎packages/fern-docs/bundle/src/app/[host]/[domain]/static/@sidebar/[slug]/page.tsx‎

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -80,20 +80,6 @@ export default async function SidebarPage({
8080
}
8181

8282
return (
83-
// <HydrationBoundary
84-
// hydrateAtoms={[
85-
// [
86-
// emptySidebarAtom,
87-
// found.sidebar?.children.length === 0 ||
88-
// (found.sidebar?.children.length === 1 &&
89-
// found.sidebar?.children[0]?.type === "sidebarGroup" &&
90-
// found.sidebar?.children[0].children.length === 1 &&
91-
// found.sidebar?.children[0].children[0]?.type === "page"),
92-
// ],
93-
// [isLandingPageAtom, found.node.type === "landingPage"],
94-
// ]}
95-
// options={{ enableReHydrate: true }}
96-
// >
9783
<>
9884
{found.tabs && found.tabs.length > 0 && (
9985
<SidebarTabsRootServer loader={loader}>

0 commit comments

Comments
 (0)