Merge branch 'feature/lightning-menu' of gitlab.com:theappsmith/internal-tools-client into fix/icons-placement-issues

app/client/src/components/editorComponents/LightningMenu/helpers.tsx

@@ -64,6 +64,11 @@ export const getApiOptions = (
   openDirection: Directions.RIGHT,
   openOnHover: false,
   skin: skin,
+  modifiers: {
+    offset: {
+      offset: "0, 16px",
+    },
+  },
 });
 
 export const getQueryOptions = (
@@ -108,6 +113,11 @@ export const getQueryOptions = (
   openDirection: Directions.RIGHT,
   openOnHover: false,
   skin: skin,
+  modifiers: {
+    offset: {
+      offset: "0, 16px",
+    },
+  },
 });
 
 export const getWidgetOptions = (
@@ -133,6 +143,11 @@ export const getWidgetOptions = (
   openDirection: Directions.RIGHT,
   openOnHover: false,
   skin: skin,
+  modifiers: {
+    offset: {
+      offset: "0, 16px",
+    },
+  },
 });
 
 export const getLightningMenuOptions = (

app/client/src/components/editorComponents/LightningMenu/index.tsx

@@ -55,6 +55,11 @@ const lightningMenuOptions = (
         onCloseLightningMenu();
       }
     },
+    modifiers: {
+      offset: {
+        offset: "0, 32px",
+      },
+    },
   };
 };
 

app/client/src/pages/common/CustomizedDropdown/index.tsx

@@ -7,6 +7,7 @@ import {
   Classes,
   PopoverInteractionKind,
   Icon,
+  IPopoverSharedProps,
 } from "@blueprintjs/core";
 import { IconNames } from "@blueprintjs/icons";
 import { MenuIcons } from "icons/MenuIcons";
@@ -47,6 +48,7 @@ export type CustomizedDropdownProps = {
   openOnHover?: boolean;
   usePortal?: boolean;
   skin?: Skin;
+  modifiers?: IPopoverSharedProps["modifiers"];
 };
 
 const getIcon = (icon?: string, intent?: Intent) => {
@@ -147,6 +149,7 @@ export const CustomizedDropdown = (
           props.onCloseDropDown();
         }
       }}
+      modifiers={props.modifiers}
     >
       <DropdownTrigger skin={skin}>{trigger}</DropdownTrigger>
       <DropdownContent skin={skin}>{content}</DropdownContent>