CB-5092 fix: selectors and nodes context menu do not break layout for…

… small screens
dbeaver · May 20, 2024 · 7083d4e · 7083d4e
1 parent 9eaf013
commit 7083d4e
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 6 deletions.
diff --git a/webapp/packages/core-blocks/src/FormControls/Combobox.tsx b/webapp/packages/core-blocks/src/FormControls/Combobox.tsx
@@ -106,6 +106,7 @@ export const Combobox: ComboboxType = observer(function Combobox({
     placement: 'bottom-end',
     currentId: null,
     gutter: 4,
+    unstable_fixed: true,
   });
 
   if (readOnly) {
@@ -150,11 +151,6 @@ export const Combobox: ComboboxType = observer(function Combobox({
     }
   }
 
-  function handleArrowClick(e: React.MouseEvent) {
-    e.preventDefault();
-    handleClick();
-  }
-
   const handleChange = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
       const value = event.target.value;
@@ -303,7 +299,7 @@ export const Combobox: ComboboxType = observer(function Combobox({
           onClick={handleClick}
           {...rest}
         />
-        <MenuButton {...menu} disabled={readOnly || disabled || hideMenu} className={styles.menuButton} onClick={handleArrowClick}>
+        <MenuButton {...menu} disabled={readOnly || disabled || hideMenu} className={styles.menuButton}>
           <Icon name="arrow" viewBox="0 0 16 16" className={s(styles, { icon: true, focus })} />
         </MenuButton>
         <Menu {...menu} ref={menuRef} aria-label={propertyName} className={s(styles, { menu: true })} modal>

diff --git a/webapp/packages/core-blocks/src/Menu/Menu.tsx b/webapp/packages/core-blocks/src/Menu/Menu.tsx
@@ -70,6 +70,7 @@ export const Menu = observer<IMenuProps, HTMLButtonElement>(
       placement,
       visible,
       rtl,
+      unstable_fixed: true,
     });
     const styles = useS(style);