Skip to content

Commit ef939d3

Browse files
committed
WIP: migration from pages to app dir
1 parent 6bf4b1b commit ef939d3

File tree

13 files changed

+239
-380
lines changed

13 files changed

+239
-380
lines changed

apps/web/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,8 @@
3030
"@sentry/browser": "^7.75.0",
3131
"@tanstack/react-query": "^5.29.0",
3232
"axios": "^1.4.0",
33-
"codemirror5": "npm:codemirror@5",
3433
"codemirror": "npm:codemirror@6",
34+
"codemirror5": "npm:codemirror@5",
3535
"date-fns": "^2.30.0",
3636
"date-fns-tz": "^2.0.0",
3737
"dotenv": "^16.3.1",
@@ -43,6 +43,7 @@
4343
"inquirer": "^9.2.7",
4444
"nanoid": "^5.0.7",
4545
"next": "^14.2.1",
46+
"next-seo": "^6.0.0",
4647
"prismjs": "^1.29.0",
4748
"react": "^18.2.0",
4849
"react-dom": "18.2.0",

apps/web/src/app/books/page.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
1-
// import Aside from '@/features/bookEdit/components/Aside'
1+
import Aside from '@/features/bookEdit/components/Aside'
22

33
function page() {
44
return (
55
<>
6-
{/* <Aside /> */}
7-
hello
6+
<Aside />
87
</>
98
)
109
}

apps/web/src/features/bookEdit/components/Aside/Aside.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,15 @@
33
import styles from './Aside.module.css'
44
import { bindClassNames } from '@/lib/styles/bindClassNames'
55
import { Navbar } from '@packages/nextra-theme-docs'
6+
import { navbarFlatDirectories } from '../test/mock'
67

78
const cx = bindClassNames(styles)
89

910
function Aside() {
1011
return (
1112
<div className={cx('block')}>
12-
<Navbar flatDirectories={[]} items={[]} />
13+
<div>books</div>
14+
<Navbar flatDirectories={navbarFlatDirectories} items={[]} />
1315
</div>
1416
)
1517
}
Lines changed: 48 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,50 @@
1-
// import { Item, NavbarFlatDirectories, NavbarItems, PageItem } from '@packages/nextra-theme-docs'
1+
import { NavbarFlatDirectories, NavbarItems } from '@packages/nextra-theme-docs'
22

3-
// export const navbarFlatDirectories: NavbarFlatDirectories[] = [
4-
// {
5-
// title: 'Introduction',
6-
// kind: 'MdxPage',
7-
// name: 'index',
8-
// route: '/',
9-
// type: 'doc',
10-
// },
11-
// {
12-
// title: 'Another Page',
13-
// kind: 'MdxPage',
14-
// name: 'another',
15-
// route: '/another',
16-
// type: 'doc',
17-
// },
18-
// {
19-
// title: 'Satori',
20-
// kind: 'MdxPage',
21-
// name: 'satori',
22-
// route: '/advanced/satori',
23-
// type: 'doc',
24-
// },
25-
// {
26-
// title: 'Hi',
27-
// kind: 'MdxPage',
28-
// name: 'hi',
29-
// route: '/advanced/ hello/hi',
30-
// type: 'doc',
31-
// },
32-
// {
33-
// title: 'Balanced Client Driven Flexibility 6614ba2e52f87b67fc14427b',
34-
// kind: 'MdxPage',
35-
// name: 'Balanced_client-driven_flexibility_6614ba2e52f87b67fc14427b',
36-
// route: '/Balanced_client-driven_flexibility_6614ba2e52f87b67fc14427b',
37-
// type: 'doc',
38-
// },
39-
// ]
3+
export const navbarFlatDirectories: NavbarFlatDirectories = [
4+
{
5+
title: 'Introduction',
6+
kind: 'MdxPage',
7+
name: 'index',
8+
route: '/',
9+
type: 'doc',
10+
},
11+
{
12+
title: 'Another Page',
13+
kind: 'MdxPage',
14+
name: 'another',
15+
route: '/another',
16+
type: 'doc',
17+
},
18+
{
19+
title: 'Satori',
20+
kind: 'MdxPage',
21+
name: 'satori',
22+
route: '/advanced/satori',
23+
type: 'doc',
24+
},
25+
{
26+
title: 'Hi',
27+
kind: 'MdxPage',
28+
name: 'hi',
29+
route: '/advanced/ hello/hi',
30+
type: 'doc',
31+
},
32+
{
33+
title: 'Balanced Client Driven Flexibility 6614ba2e52f87b67fc14427b',
34+
kind: 'MdxPage',
35+
name: 'Balanced_client-driven_flexibility_6614ba2e52f87b67fc14427b',
36+
route: '/Balanced_client-driven_flexibility_6614ba2e52f87b67fc14427b',
37+
type: 'doc',
38+
},
39+
]
4040

41-
// export const navbarItems: NavbarItems[] = [
42-
// {
43-
// name: 'contact',
44-
// route: '',
45-
// title: 'Contact ↗',
46-
// type: 'page',
47-
// href: 'https://twitter.com/shuding_',
48-
// newWindow: true,
49-
// },
50-
// ]
41+
export const navbarItems: NavbarItems = [
42+
{
43+
name: 'contact',
44+
route: '',
45+
title: 'Contact ↗',
46+
type: 'page',
47+
href: 'https://twitter.com/shuding_',
48+
newWindow: true,
49+
},
50+
]

packages/nextra-theme-docs/src/components/404.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { useRouter } from 'next/router'
21
import { useMounted } from 'nextra/hooks'
32
import type { ReactElement } from 'react'
43
import { useConfig } from '../contexts'
@@ -8,7 +7,6 @@ import { Anchor } from './anchor'
87
export function NotFoundPage(): ReactElement | null {
98
const config = useConfig()
109
const mounted = useMounted()
11-
const { asPath } = useRouter()
1210
const { content, labels } = config.notFound
1311
if (!content) {
1412
return null
@@ -19,8 +17,8 @@ export function NotFoundPage(): ReactElement | null {
1917
<Anchor
2018
href={getGitIssueUrl({
2119
repository: config.docsRepositoryBase,
22-
title: `Found broken \`${mounted ? asPath : ''}\` link. Please fix!`,
23-
labels
20+
title: `Found broken \`${mounted ? '' : ''}\` link. Please fix!`,
21+
labels,
2422
})}
2523
newWindow
2624
className="nx-text-primary-600 nx-underline nx-decoration-from-font [text-underline-position:from-font]"

packages/nextra-theme-docs/src/components/500.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { useRouter } from 'next/router'
21
import { useMounted } from 'nextra/hooks'
32
import type { ReactElement } from 'react'
43
import { useConfig } from '../contexts'
@@ -8,7 +7,6 @@ import { Anchor } from './anchor'
87
export function ServerSideErrorPage(): ReactElement | null {
98
const config = useConfig()
109
const mounted = useMounted()
11-
const { asPath } = useRouter()
1210
const { content, labels } = config.serverSideError
1311
if (!content) {
1412
return null
@@ -19,10 +17,8 @@ export function ServerSideErrorPage(): ReactElement | null {
1917
<Anchor
2018
href={getGitIssueUrl({
2119
repository: config.docsRepositoryBase,
22-
title: `Got server-side error in \`${
23-
mounted ? asPath : ''
24-
}\` url. Please fix!`,
25-
labels
20+
title: `Got server-side error in \`${mounted ? '' : ''}\` url. Please fix!`,
21+
labels,
2622
})}
2723
newWindow
2824
className="nx-text-primary-600 nx-underline nx-decoration-from-font [text-underline-position:from-font]"

packages/nextra-theme-docs/src/components/flexsearch.tsx

Lines changed: 22 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import cn from 'clsx'
22
// flexsearch types are incorrect, they were overwritten in tsconfig.json
33
import FlexSearch from 'flexsearch'
4-
import { useRouter } from 'next/router'
54
import type { SearchData } from 'nextra'
65
import type { ReactElement, ReactNode } from 'react'
76
import { useCallback, useState } from 'react'
@@ -56,13 +55,8 @@ const loadIndexes = (basePath: string, locale: string): Promise<void> => {
5655
return promise
5756
}
5857

59-
const loadIndexesImpl = async (
60-
basePath: string,
61-
locale: string
62-
): Promise<void> => {
63-
const response = await fetch(
64-
`${basePath}/_next/static/chunks/nextra-data-${locale}.json`
65-
)
58+
const loadIndexesImpl = async (basePath: string, locale: string): Promise<void> => {
59+
const response = await fetch(`${basePath}/_next/static/chunks/nextra-data-${locale}.json`)
6660
const searchData = (await response.json()) as SearchData
6761

6862
const pageIndex: PageIndex = new FlexSearch.Document({
@@ -71,13 +65,13 @@ const loadIndexesImpl = async (
7165
document: {
7266
id: 'id',
7367
index: 'content',
74-
store: ['title']
68+
store: ['title'],
7569
},
7670
context: {
7771
resolution: 9,
7872
depth: 2,
79-
bidirectional: true
80-
}
73+
bidirectional: true,
74+
},
8175
})
8276

8377
const sectionIndex: SectionIndex = new FlexSearch.Document({
@@ -87,13 +81,13 @@ const loadIndexesImpl = async (
8781
id: 'id',
8882
index: 'content',
8983
tag: 'pageId',
90-
store: ['title', 'content', 'url', 'display']
84+
store: ['title', 'content', 'url', 'display'],
9185
},
9286
context: {
9387
resolution: 9,
9488
depth: 2,
95-
bidirectional: true
96-
}
89+
bidirectional: true,
90+
},
9791
})
9892

9993
let pageId = 0
@@ -114,7 +108,7 @@ const loadIndexesImpl = async (
114108
title,
115109
pageId: `page_${pageId}`,
116110
content: title,
117-
...(paragraphs[0] && { display: paragraphs[0] })
111+
...(paragraphs[0] && { display: paragraphs[0] }),
118112
})
119113

120114
for (let i = 0; i < paragraphs.length; i++) {
@@ -123,7 +117,7 @@ const loadIndexesImpl = async (
123117
url,
124118
title,
125119
pageId: `page_${pageId}`,
126-
content: paragraphs[i]
120+
content: paragraphs[i],
127121
})
128122
}
129123

@@ -134,19 +128,16 @@ const loadIndexesImpl = async (
134128
pageIndex.add({
135129
id: pageId,
136130
title: structurizedData.title,
137-
content: pageContent
131+
content: pageContent,
138132
})
139133
}
140134

141135
indexes[locale] = [pageIndex, sectionIndex]
142136
}
143137

144-
export function Flexsearch({
145-
className
146-
}: {
147-
className?: string
148-
}): ReactElement {
149-
const { locale = DEFAULT_LOCALE, basePath } = useRouter()
138+
export function Flexsearch({ className }: { className?: string }): ReactElement {
139+
const locale = DEFAULT_LOCALE
140+
const basePath = '/'
150141
const [loading, setLoading] = useState(false)
151142
const [error, setError] = useState(false)
152143
const [results, setResults] = useState<SearchResult[]>([])
@@ -160,7 +151,7 @@ export function Flexsearch({
160151
const pageResults =
161152
pageIndex.search<true>(search, 5, {
162153
enrich: true,
163-
suggest: true
154+
suggest: true,
164155
})[0]?.result || []
165156

166157
const results: Result[] = []
@@ -175,7 +166,7 @@ export function Flexsearch({
175166
sectionIndex.search<true>(search, 5, {
176167
enrich: true,
177168
suggest: true,
178-
tag: `page_${result.id}`
169+
tag: `page_${result.id}`,
179170
})[0]?.result || []
180171

181172
let isFirstItemOfPage = true
@@ -199,7 +190,7 @@ export function Flexsearch({
199190
<div
200191
className={cn(
201192
'nx-mx-2.5 nx-mb-2 nx-mt-6 nx-select-none nx-border-b nx-border-black/10 nx-px-2.5 nx-pb-1.5 nx-text-xs nx-font-semibold nx-uppercase nx-text-gray-500 first:nx-mt-0 dark:nx-border-white/20 dark:nx-text-gray-300',
202-
'contrast-more:nx-border-gray-600 contrast-more:nx-text-gray-900 contrast-more:dark:nx-border-gray-50 contrast-more:dark:nx-text-gray-50'
193+
'contrast-more:nx-border-gray-600 contrast-more:nx-text-gray-900 contrast-more:dark:nx-border-gray-50 contrast-more:dark:nx-text-gray-50',
203194
)}
204195
>
205196
{result.doc.title}
@@ -216,7 +207,7 @@ export function Flexsearch({
216207
</div>
217208
)}
218209
</>
219-
)
210+
),
220211
})
221212
isFirstItemOfPage = false
222213
}
@@ -234,12 +225,12 @@ export function Flexsearch({
234225
}
235226
return a._page_rk - b._page_rk
236227
})
237-
.map(res => ({
228+
.map((res) => ({
238229
id: `${res._page_rk}_${res._section_rk}`,
239230
route: res.route,
240231
prefix: res.prefix,
241-
children: res.children
242-
}))
232+
children: res.children,
233+
})),
243234
)
244235
}
245236

@@ -255,7 +246,7 @@ export function Flexsearch({
255246
setLoading(false)
256247
}
257248
},
258-
[locale, basePath]
249+
[locale, basePath],
259250
)
260251

261252
const handleChange = async (value: string) => {

0 commit comments

Comments
 (0)