-
Notifications
You must be signed in to change notification settings - Fork 645
/
sidebar-pages.tsx
52 lines (42 loc) · 1.23 KB
/
sidebar-pages.tsx
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
49
50
51
52
import React from 'react'
import { Navigation, NavigationElementProps } from '@adminjs/design-system'
import { useHistory, useLocation } from 'react-router'
import ViewHelpers from '../../../../backend/utils/view-helpers/view-helpers'
import { useTranslation } from '../../../hooks/use-translation'
import { ReduxState } from '../../../store/store'
type Props = {
pages?: ReduxState['pages'];
}
const h = new ViewHelpers()
const SidebarPages: React.FC<Props> = (props) => {
const { pages } = props
const { translateLabel } = useTranslation()
const location = useLocation()
const history = useHistory()
if (!pages || !pages.length) {
return (<></>)
}
const isActive = (page): boolean => (
!!location.pathname.match(`/pages/${page.name}`)
)
const elements: Array<NavigationElementProps> = pages.map(page => ({
id: page.name,
label: page.name,
isSelected: isActive(page),
icon: page.icon,
href: h.pageUrl(page.name),
onClick: (event, element): void => {
event.preventDefault()
if (element.href) {
history.push(element.href)
}
},
}))
return (
<Navigation
label={translateLabel('pages')}
elements={elements}
/>
)
}
export default SidebarPages