Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit b6dc072

Browse filesBrowse files
committed
refactor(CSidebarNav): move the context outside the component
1 parent c719c6e commit b6dc072
Copy full SHA for b6dc072

File tree

4 files changed

+17
-14
lines changed
Filter options

4 files changed

+17
-14
lines changed

‎packages/coreui-react/src/components/nav/CNavGroup.tsx

Copy file name to clipboardExpand all lines: packages/coreui-react/src/components/nav/CNavGroup.tsx
+2-2Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import type { TransitionStatus } from 'react-transition-group'
1616

1717
import { PolymorphicRefForwardingComponent } from '../../helpers'
1818

19-
import { CNavContext } from '../sidebar/CSidebarNav'
19+
import { CSidebarNavContext } from '../sidebar/CSidebarNavContext'
2020

2121
export interface CNavGroupProps extends HTMLAttributes<HTMLDivElement | HTMLLIElement> {
2222
/**
@@ -62,7 +62,7 @@ export const CNavGroup: PolymorphicRefForwardingComponent<'li', CNavGroupProps>
6262
// eslint-disable-next-line @typescript-eslint/no-explicit-any
6363
const navItemsRef = useRef<any>(null)
6464

65-
const { visibleGroup, setVisibleGroup } = useContext(CNavContext)
65+
const { visibleGroup, setVisibleGroup } = useContext(CSidebarNavContext)
6666

6767
const [_visible, setVisible] = useState(
6868
Boolean(visible || (idx && visibleGroup && isInVisibleGroup(visibleGroup, idx))),

‎packages/coreui-react/src/components/nav/CNavLink.tsx

Copy file name to clipboardExpand all lines: packages/coreui-react/src/components/nav/CNavLink.tsx
+2-2Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
33
import classNames from 'classnames'
44

55
import { CLinkProps, CLink } from '../link/CLink'
6-
import { CNavContext } from '../sidebar/CSidebarNav'
6+
import { CSidebarNavContext } from '../sidebar/CSidebarNavContext'
77

88
import { PolymorphicRefForwardingComponent } from '../../helpers'
99
import { useForkedRef } from '../../hooks'
@@ -26,7 +26,7 @@ export const CNavLink: PolymorphicRefForwardingComponent<'a', CNavLinkProps> = f
2626
const navLinkRef = useRef<HTMLAnchorElement>(null)
2727
const forkedRef = useForkedRef(ref, navLinkRef)
2828

29-
const { setVisibleGroup } = useContext(CNavContext)
29+
const { setVisibleGroup } = useContext(CSidebarNavContext)
3030

3131
useEffect(() => {
3232
rest.active = navLinkRef.current?.classList.contains('active')

‎packages/coreui-react/src/components/sidebar/CSidebarNav.tsx

Copy file name to clipboardExpand all lines: packages/coreui-react/src/components/sidebar/CSidebarNav.tsx
+5-10Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, {
2-
createContext,
32
ElementType,
43
forwardRef,
54
HTMLAttributes,
@@ -13,6 +12,9 @@ import classNames from 'classnames'
1312
import type { CNavGroupProps } from '../nav/CNavGroup'
1413
import type { CNavLinkProps } from '../nav/CNavLink'
1514
import type { CNavItemProps } from '../nav/CNavItem'
15+
16+
import { CSidebarNavContext } from './CSidebarNavContext'
17+
1618
import { PolymorphicRefForwardingComponent } from '../../helpers'
1719

1820
export interface CSidebarNavProps extends HTMLAttributes<HTMLUListElement> {
@@ -28,13 +30,6 @@ export interface CSidebarNavProps extends HTMLAttributes<HTMLUListElement> {
2830
className?: string
2931
}
3032

31-
interface ContextProps {
32-
visibleGroup: string
33-
setVisibleGroup: React.Dispatch<React.SetStateAction<string | undefined>>
34-
}
35-
36-
export const CNavContext = createContext({} as ContextProps)
37-
3833
const isNavElement = (
3934
child: ReactNode
4035
): child is ReactElement<CNavGroupProps | CNavLinkProps | CNavItemProps> => {
@@ -82,11 +77,11 @@ export const CSidebarNav: PolymorphicRefForwardingComponent<'ul', CSidebarNavPro
8277
}
8378

8479
return (
85-
<CNavContext.Provider value={CNavContextValues}>
80+
<CSidebarNavContext.Provider value={CNavContextValues}>
8681
<Component className={classNames('sidebar-nav', className)} ref={ref} {...rest}>
8782
{recursiveClone(children)}
8883
</Component>
89-
</CNavContext.Provider>
84+
</CSidebarNavContext.Provider>
9085
)
9186
})
9287

+8Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { createContext } from 'react'
2+
3+
export interface CSidebarNavContextProps {
4+
visibleGroup: string
5+
setVisibleGroup: React.Dispatch<React.SetStateAction<string | undefined>>
6+
}
7+
8+
export const CSidebarNavContext = createContext({} as CSidebarNavContextProps)

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.