forked from github/docs
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathObject.tsx
More file actions
46 lines (41 loc) · 1.32 KB
/
Object.tsx
File metadata and controls
46 lines (41 loc) · 1.32 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
import { useRouter } from 'next/router'
import { Link } from 'components/Link'
import { GraphqlItem } from './GraphqlItem'
import { Table } from './Table'
import { useTranslation } from 'components/hooks/useTranslation'
import type { ObjectT, ImplementsT } from './types'
type Props = {
item: ObjectT
}
export function Object({ item }: Props) {
const { locale } = useRouter()
const { t } = useTranslation('products')
const heading1 = t('graphql.reference.implements').replace('{{ GraphQLItemTitle }}', item.name)
const heading2 = t('graphql.reference.fields').replace('{{ GraphQLItemTitle }}', item.name)
return (
<GraphqlItem item={item}>
{item.implements && (
<>
<h3 dangerouslySetInnerHTML={{ __html: heading1 }} />
<ul>
{item.implements.map((implement: ImplementsT) => (
<li key={`${implement.id}-${implement.href}-${implement.name}`}>
<code>
<Link href={implement.href} locale={locale}>
{implement.name}
</Link>
</code>
</li>
))}
</ul>
</>
)}
{item.fields && (
<>
<h3 dangerouslySetInnerHTML={{ __html: heading2 }} />
<Table fields={item.fields} />
</>
)}
</GraphqlItem>
)
}