49 lines
1.3 KiB
JavaScript
49 lines
1.3 KiB
JavaScript
import React from 'react'
|
|
import { useSelector, useDispatch } from 'react-redux'
|
|
|
|
import {
|
|
CSidebar,
|
|
CSidebarBrand,
|
|
CSidebarNav,
|
|
CSidebarToggler,
|
|
CCreateNavItem,
|
|
} from '@coreui/react'
|
|
|
|
import CIcon from '@coreui/icons-react'
|
|
|
|
// sidebar nav config
|
|
import navigation from '../_nav'
|
|
|
|
const AppSidebar = () => {
|
|
const dispatch = useDispatch()
|
|
const unfoldable = useSelector((state) => state.sidebarUnfoldable)
|
|
const sidebarShow = useSelector((state) => state.sidebarShow)
|
|
|
|
return (
|
|
<CSidebar
|
|
position="fixed"
|
|
selfHiding="md"
|
|
unfoldable={unfoldable}
|
|
show={sidebarShow}
|
|
onShow={() => console.log('show')}
|
|
onHide={() => {
|
|
dispatch({ type: 'set', sidebarShow: false })
|
|
}}
|
|
>
|
|
<CSidebarBrand className="d-none d-md-flex" to="/">
|
|
<CIcon className="sidebar-brand-full" name="logo-negative" height={35} />
|
|
<CIcon className="sidebar-brand-narrow" name="sygnet" height={35} />
|
|
</CSidebarBrand>
|
|
<CSidebarNav>
|
|
<CCreateNavItem items={navigation} />
|
|
</CSidebarNav>
|
|
<CSidebarToggler
|
|
className="d-none d-lg-flex"
|
|
onClick={() => dispatch({ type: 'set', sidebarUnfoldable: !unfoldable })}
|
|
/>
|
|
</CSidebar>
|
|
)
|
|
}
|
|
|
|
export default React.memo(AppSidebar)
|