Skip to content

Commit ce25791

Browse files
authored
fix(navbar): on Mobile Screen Navbar remains open even page is changed (#1247)
* fix((navbar)): fixed Navbar Collapse was not happening when clicking on Navbar.Link * fix(navbar): eslint issue fixed for Navbar.Link * fix: made changes based on Suggested Changes in PR # 1247 * fix: handling Users Custom onClick event as well * fix: renamed the userOnClick to onClick * fix: made changes accordingly to latest review by Sutu
1 parent 91ddac0 commit ce25791

File tree

1 file changed

+9
-2
lines changed

1 file changed

+9
-2
lines changed

src/components/Navbar/NavbarLink.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'use client';
22

3-
import type { ComponentProps, ElementType, FC } from 'react';
3+
import type { ComponentProps, ElementType, FC, MouseEvent } from 'react';
44
import { twMerge } from 'tailwind-merge';
55
import { mergeDeep } from '../../helpers/merge-deep';
66
import type { DeepPartial } from '../../types';
@@ -28,12 +28,18 @@ export const NavbarLink: FC<NavbarLinkProps> = ({
2828
children,
2929
className,
3030
theme: customTheme = {},
31+
onClick,
3132
...props
3233
}) => {
33-
const { theme: rootTheme } = useNavbarContext();
34+
const { theme: rootTheme, setIsOpen } = useNavbarContext();
3435

3536
const theme = mergeDeep(rootTheme.link, customTheme);
3637

38+
const handleClick = (event: MouseEvent<HTMLAnchorElement>) => {
39+
setIsOpen(false);
40+
onClick?.(event);
41+
};
42+
3743
return (
3844
<li>
3945
<Component
@@ -44,6 +50,7 @@ export const NavbarLink: FC<NavbarLinkProps> = ({
4450
theme.disabled[disabled ? 'on' : 'off'],
4551
className,
4652
)}
53+
onClick={handleClick}
4754
{...props}
4855
>
4956
{children}

0 commit comments

Comments
 (0)