forked from code-hike/codehike
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathcode-with-notes.tsx
More file actions
48 lines (42 loc) · 1.21 KB
/
Copy pathcode-with-notes.tsx
File metadata and controls
48 lines (42 loc) · 1.21 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import { highlight } from "codehike/code"
import { Block, CodeBlock, ImageBlock, parseProps } from "codehike/blocks"
import { z } from "zod"
import theme from "@/theme.mjs"
import { HighCode } from "../code"
const ContentSchema = z.object({
code: CodeBlock,
notes: z
.array(
Block.extend({
code: CodeBlock.optional(),
}),
)
.optional(),
})
export async function CodeWithNotes(props: unknown) {
const { code, notes = [] } = parseProps(props, ContentSchema)
const highlighted = await highlight(code, theme)
// find matches between annotations and notes
// and add the note as data to the annotation
highlighted.annotations = await Promise.all(
highlighted.annotations.map(async (a) => {
const note = notes.find((n) => a.query && n.title === a.query)
if (!note) return a
let children = note.children
if (note.code) {
const highlighted = await highlight(note.code, theme)
children = (
<HighCode highlighted={highlighted} className="border-none my-0" />
)
}
return {
...a,
data: {
...a.data,
children,
},
}
}),
)
return <HighCode highlighted={highlighted} />
}