From 311f4aded87ab6d06d67d1d74fa944fc95883453 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 22 Sep 2025 20:03:06 +0300
Subject: [PATCH] fix(global_menu): zoom controls tooltip overlapping

---
 apps/client/src/widgets/buttons/global_menu.tsx | 5 ++++-
 apps/client/src/widgets/react/hooks.tsx         | 5 +++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/widgets/buttons/global_menu.tsx b/apps/client/src/widgets/buttons/global_menu.tsx
index 70e43887f..39fcb88e8 100644
--- a/apps/client/src/widgets/buttons/global_menu.tsx
+++ b/apps/client/src/widgets/buttons/global_menu.tsx
@@ -157,7 +157,10 @@ function ZoomControls({ parentComponent }: { parentComponent?: Component | null
 
     function ZoomControlButton({ command, title, icon, children }: { command: KeyboardActionNames, title: string, icon?: string, children?: ComponentChildren }) {
         const linkRef = useRef<HTMLAnchorElement>(null);
-        useStaticTooltipWithKeyboardShortcut(linkRef, title, command);
+        useStaticTooltipWithKeyboardShortcut(linkRef, title, command, {
+            placement: "bottom",
+            fallbackPlacements: [ "bottom" ]
+        });
         return (
             <a
                 ref={linkRef}
diff --git a/apps/client/src/widgets/react/hooks.tsx b/apps/client/src/widgets/react/hooks.tsx
index 6a4b4ab15..6eeac81e1 100644
--- a/apps/client/src/widgets/react/hooks.tsx
+++ b/apps/client/src/widgets/react/hooks.tsx
@@ -545,10 +545,11 @@ export function useStaticTooltip(elRef: RefObject<Element>, config?: Partial<Too
     }, [ elRef, config ]);
 }
 
-export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined) {
+export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined, opts?: Omit<Partial<Tooltip.Options>, "title">) {
     const [ keyboardShortcut, setKeyboardShortcut ] = useState<string[]>();
     useStaticTooltip(elRef, {
-        title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title
+        title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title,
+        ...opts
     });
 
     useEffect(() => {