bug(web): close map control tooltip when menu button is clicked (elec…

…tricitymaps#6813)
PPsyrius · Jun 10, 2024 · f45e09f · f45e09f
1 parent 47f32d7
commit f45e09f
Showing 1 changed file with 7 additions and 2 deletions.
diff --git a/web/src/features/map-controls/MapButton.tsx b/web/src/features/map-controls/MapButton.tsx
@@ -1,10 +1,11 @@
 import * as Toggle from '@radix-ui/react-toggle';
+import { twMerge } from 'tailwind-merge';
 
 import TooltipWrapper from '../../components/tooltips/TooltipWrapper';
 
 interface MapButtonProperties {
  onClick?: () => void;
- icon: any;
+ icon: JSX.Element;
  tooltipText?: string;
  className?: string;
  dataTestId?: string;
@@ -26,7 +27,11 @@ export default function MapButton({
  <TooltipWrapper tooltipContent={tooltipText}>
  <Component
  onClick={onClick}
- className={`pointer-events-auto flex h-8 w-8 items-center justify-center rounded bg-white/80 text-left shadow-lg backdrop-blur-sm transition hover:bg-white dark:bg-gray-800/80 dark:hover:bg-gray-900/90 ${className}`}
+ className={twMerge(
+ `flex h-8 w-8 items-center justify-center rounded bg-white/80 text-left shadow-lg backdrop-blur-sm transition hover:bg-white dark:bg-gray-800/80 dark:hover:bg-gray-900/90`,
+ className,
+ asToggle && 'pointer-events-auto'
+ )}
  aria-label={ariaLabel}
  data-test-id={dataTestId}
  role="button"