Skip to content

Commit 8cd8bed

Browse files
felixfeng33felixfeng33
committed
fix build
1 parent d7b5742 commit 8cd8bed

6 files changed

Lines changed: 107 additions & 9 deletions

File tree

‎apps/www/src/app/(app)/docs/[[...slug]]/nav-items-grid.tsx‎

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'use client';
22

3-
import { useState } from 'react';
3+
import { Suspense, useState } from 'react';
44

55
import type { SidebarNavItem } from '@/types/nav';
66

@@ -71,7 +71,7 @@ const filterItems = (
7171
}, []);
7272
};
7373

74-
export function NavItemCard({
74+
function NavItemCardInner({
7575
category,
7676
item,
7777
}: {
@@ -107,6 +107,30 @@ export function NavItemCard({
107107
);
108108
}
109109

110+
export function NavItemCard({
111+
category,
112+
item,
113+
}: {
114+
category: string;
115+
item: SidebarNavItem;
116+
}) {
117+
return (
118+
<Suspense fallback={
119+
<Card className="h-full bg-muted/30 p-0">
120+
<CardContent className="flex gap-2 p-2">
121+
<div className="flex size-12 shrink-0 items-center justify-center rounded-lg border bg-white animate-pulse" />
122+
<div className="space-y-0 flex-1">
123+
<div className="h-4 bg-muted animate-pulse rounded w-3/4" />
124+
<div className="h-3 bg-muted animate-pulse rounded w-1/2 mt-1" />
125+
</div>
126+
</CardContent>
127+
</Card>
128+
}>
129+
<NavItemCardInner category={category} item={item} />
130+
</Suspense>
131+
);
132+
}
133+
110134
export function NavItemsGrid({
111135
category,
112136
showFilter = true,

‎apps/www/src/app/(app)/docs/examples/server-side/page.tsx‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ import type { Doc } from '@/types/doc';
22

33
import type { Metadata } from 'next';
44

5+
import { Suspense } from 'react';
6+
57
import { AutoformatPlugin } from '@platejs/autoformat';
68
import { DocxPlugin } from '@platejs/docx';
79
import {
@@ -42,7 +44,7 @@ export const metadata: Metadata = {
4244
},
4345
};
4446

45-
export default function RSCPage() {
47+
function RSCPageContent() {
4648
const mockDoc: Partial<Doc> = {
4749
description: 'Server-side rendering.',
4850
title: 'Server-Side',
@@ -96,3 +98,11 @@ export default function RSCPage() {
9698
</DocContent>
9799
);
98100
}
101+
102+
export default function RSCPage() {
103+
return (
104+
<Suspense fallback={<div>Loading...</div>}>
105+
<RSCPageContent />
106+
</Suspense>
107+
);
108+
}

‎apps/www/src/app/(app)/docs/examples/slate-to-html/page.tsx‎

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
import { Suspense } from 'react';
2+
13
import { DocContent } from '@/app/(app)/docs/[[...slug]]/doc-content';
24
import { BlockDisplay } from '@/components/block-display';
35
import { exampleNavMap } from '@/config/docs-examples';
46

5-
export default function SlateToHtmlPage() {
7+
function SlateToHtmlContent() {
68
return (
79
<DocContent
810
category="example"
@@ -18,3 +20,11 @@ export default function SlateToHtmlPage() {
1820
</DocContent>
1921
);
2022
}
23+
24+
export default function SlateToHtmlPage() {
25+
return (
26+
<Suspense fallback={<div>Loading...</div>}>
27+
<SlateToHtmlContent />
28+
</Suspense>
29+
);
30+
}

‎apps/www/src/components/api-list.tsx‎

Lines changed: 54 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'use client';
22

3-
import React, { type ReactNode, createContext, useState } from 'react';
3+
import React, { type ReactNode, createContext, useEffect, useState } from 'react';
44

55
import { Separator } from '@/components/ui/separator';
66
import { cn } from '@/lib/utils';
@@ -72,6 +72,11 @@ export function APIItem({
7272
value,
7373
}: Item) {
7474
const { listType, name: contextName } = React.useContext(APIContext);
75+
const [mounted, setMounted] = useState(false);
76+
77+
useEffect(() => {
78+
setMounted(true);
79+
}, []);
7580

7681
const id = contextName
7782
? `${contextName}-${listType ? `${listTypeToId[listType]}-` : ''}${name}`
@@ -80,6 +85,42 @@ export function APIItem({
8085
.replace(/^-|-$/g, '')
8186
: undefined;
8287

88+
// During SSR or when not mounted, render a simpler version
89+
if (!mounted) {
90+
return (
91+
<li id={id} className="scroll-mt-20 py-4">
92+
<h4 className="relative py-2 text-start leading-none font-semibold tracking-tight">
93+
{id && (
94+
<a
95+
className={cn(
96+
'opacity-0 hover:opacity-100'
97+
)}
98+
onClick={(e) => e.stopPropagation()}
99+
href={`#${id}`}
100+
>
101+
<div className="absolute top-2 -left-5 pr-1 leading-none">
102+
<Icons.pragma className="size-4 text-muted-foreground" />
103+
</div>
104+
</a>
105+
)}
106+
<span className="font-mono text-sm leading-none font-semibold">
107+
{name}
108+
</span>
109+
{required && (
110+
<span className="font-mono text-xs leading-none text-orange-500">
111+
{' '}
112+
REQUIRED
113+
</span>
114+
)}
115+
<span className="text-left font-mono text-sm leading-none font-medium text-muted-foreground">
116+
{!required && optional && ' optional'} {type}
117+
</span>
118+
</h4>
119+
<div className="pt-2 pb-0">{children}</div>
120+
</li>
121+
);
122+
}
123+
83124
return (
84125
<AccordionItem className="border-none select-text" value={value ?? name}>
85126
<AccordionTrigger className="group p-0 hover:no-underline">
@@ -217,6 +258,11 @@ export function APIList({
217258

218259
const [values, setValues] = useState<string[]>(defaultValues);
219260
const [expanded, setExpanded] = useState(!collapsed);
261+
const [mounted, setMounted] = useState(false);
262+
263+
useEffect(() => {
264+
setMounted(true);
265+
}, []);
220266

221267
if (listType === 'returns' && !childCount) return null;
222268

@@ -290,7 +336,7 @@ export function APIList({
290336
{/* {listType !== 'returns' && <Separator />} */}
291337
<Separator />
292338

293-
{hasItems ? (
339+
{hasItems && mounted ? (
294340
<Accordion
295341
className="w-full space-y-2 py-4"
296342
value={values}
@@ -304,6 +350,12 @@ export function APIList({
304350
});
305351
})}
306352
</Accordion>
353+
) : hasItems && !mounted ? (
354+
<div className="py-4">
355+
{React.Children.map(children, (child, i) => {
356+
return child;
357+
})}
358+
</div>
307359
) : childCount > 0 ? (
308360
children
309361
) : (

‎apps/www/src/hooks/useLocale.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
'use client';
2+
13
import { useSearchParams } from 'next/navigation';
24

35
export const useLocale = () => {

‎apps/www/src/lib/highlight-code.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,12 +97,12 @@ export async function highlightCode(code: string, language = 'tsx') {
9797
type: 'root',
9898
children: [
9999
{
100-
type: 'element',
101-
tagName: 'figure',
100+
children: node.children as any,
102101
properties: {
103102
'data-rehype-pretty-code-figure': '',
104103
},
105-
children: node.children as any,
104+
tagName: 'figure',
105+
type: 'element',
106106
},
107107
],
108108
} as any;

0 commit comments

Comments
 (0)