github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 09:19:04 -04:00
Code Issues Projects Releases Packages Wiki Activity

Fix special click behavior in new side nav (#214650)

Browse source 
Not sure whether we have an issue for is, but a problem I constantly run
into is that cmd+click to open in new tab doesn't work with the new side
nav. You need to do right click + open in new tab which is taking at
least 3 times as long.

This is a problem because it's not the expected behavior - the entries
in the nav are regular links and they should behave like that (the old
nav didn't have this problem).

This PR fixes the issue to not call `e.preventDefault()` in case it's a
"special click" and only triggers the in-page navigation in cases where
the user does a normal left click.

Co-authored-by: Bhavya RM <bhavya@elastic.co>
This commit is contained in:
Joe Reuter 2025-03-18 17:06:58 +01:00 • committed by GitHub
parent b9d240b38b
commit df55627b2d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 18 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/platform/packages/shared/shared-ux/chrome/navigation/src/ui/components/navigation_section_ui.tsx
View file

@ -283,6 +283,16 @@ const getEuiProps = (
})
.flat();
/**
* Check if the click event is a special click (e.g. right click, click with modifier key)
* We do not want to prevent the default behavior in these cases.
*/
const isSpecialClick = (e: React.MouseEvent<HTMLElement | HTMLButtonElement>) => {
const isModifiedEvent = !!(e.metaKey || e.altKey || e.ctrlKey || e.shiftKey);
const isLeftClickEvent = e.button === 0;
return isModifiedEvent || !isLeftClickEvent;
};
const linkProps: EuiCollapsibleNavItemProps['linkProps'] | undefined = hasLink
? {
href,
@ -301,6 +311,10 @@ const getEuiProps = (
return;
}
if (isSpecialClick(e)) {
return;
}
if (href) {
e.preventDefault();
navigateToUrl(href);
@ -327,6 +341,10 @@ const getEuiProps = (
// will be used in the breadcrumb navigation.
if (isAccordion && isCollapsible) return;
if (isSpecialClick(e)) {
return;
}
if (href !== undefined) {
e.preventDefault();
navigateToUrl(href);