diff --git a/frontend/src/AppBuilder/RightSideBar/Inspector/EventManager.jsx b/frontend/src/AppBuilder/RightSideBar/Inspector/EventManager.jsx
index 3cb63ca58b..1b59da6844 100644
--- a/frontend/src/AppBuilder/RightSideBar/Inspector/EventManager.jsx
+++ b/frontend/src/AppBuilder/RightSideBar/Inspector/EventManager.jsx
@@ -32,7 +32,6 @@ import useStore from '@/AppBuilder/_stores/store';
 import { useEventActions, useEvents } from '@/AppBuilder/_stores/slices/eventsSlice';
 import ToggleGroup from '@/ToolJetUI/SwitchGroup/ToggleGroup';
 import ToggleGroupItem from '@/ToolJetUI/SwitchGroup/ToggleGroupItem';
-import SolidIcon from '@/_ui/Icon/SolidIcons';
 
 export const EventManager = ({
   sourceId,
@@ -102,8 +101,23 @@ export const EventManager = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [JSON.stringify(currentEvents)]);
 
-  let actionOptions = ActionTypes.map((action) => {
-    return { label: action.name, value: action.id, icon: action.icon };
+  let groupedOptions = ActionTypes.reduce((acc, action) => {
+    const groupName = action.group;
+
+    if (!acc[groupName]) {
+      acc[groupName] = [];
+    }
+
+    acc[groupName].push({
+      label: action.name,
+      value: action.id,
+    });
+
+    return acc;
+  }, {});
+
+  let actionOptions = Object.keys(groupedOptions).map((groupName) => {
+    return { label: groupName, options: groupedOptions[groupName] };
   });
 
   let checkIfClicksAreInsideOf = document.querySelector('.cm-completionListIncompleteBottom');
@@ -123,6 +137,15 @@ export const EventManager = ({
     menuList: (base) => ({
       ...base,
     }),
+    group: (base) => ({
+      ...base,
+      padding: 0,
+    }),
+    groupHeading: (base) => ({
+      ...base,
+      margin: 0,
+      padding: '0 10px',
+    }),
   };
 
   const actionLookup = Object.fromEntries(ActionTypes.map((actionType) => [actionType.id, actionType]));
@@ -395,12 +418,15 @@ export const EventManager = ({
     return defaultValue;
   };
 
-  const renderActionOption = (option) => (
-    <div className="d-flex align-items-center justify-content-start tw-gap-[8px]">
-      <SolidIcon name={option.icon} width="16px" height="16px" />
-      <span>{option.label}</span>
-    </div>
-  );
+  const formatGroupLabel = (data) => {
+    if (data.label === 'run-action') return;
+    return (
+      <div
+        className="tw-border-x-0 tw-border-t-0 tw-border-b-px tw-border-solid tw-my-[4px]"
+        style={{ borderColor: 'var(--border-weak)' }}
+      ></div>
+    );
+  };
 
   function eventPopover(event, index) {
     return (
@@ -448,7 +474,7 @@ export const EventManager = ({
                 styles={styles}
                 useMenuPortal={false}
                 useCustomStyles={true}
-                customOption={renderActionOption}
+                formatGroupLabel={formatGroupLabel}
               />
             </div>
           </div>
diff --git a/frontend/src/Editor/ActionTypes.js b/frontend/src/Editor/ActionTypes.js
index 067622ccb0..e3fb69f95d 100644
--- a/frontend/src/Editor/ActionTypes.js
+++ b/frontend/src/Editor/ActionTypes.js
@@ -3,13 +3,13 @@ export const ActionTypes = [
     name: 'Run query',
     id: 'run-query',
     options: [{ queryId: '' }],
-    icon: '',
+    group: 'run-action',
   },
   {
     name: 'Show Alert',
     id: 'show-alert',
     options: [{ name: 'message', type: 'text', default: 'Message !' }],
-    icon: '',
+    group: 'run-action',
   },
   {
     name: 'Control component',
@@ -18,19 +18,19 @@ export const ActionTypes = [
       { name: 'component', type: 'text', default: '' },
       { name: 'action', type: 'text', default: '' },
     ],
-    icon: '',
+    group: 'control-component',
   },
   {
     name: 'Show modal',
     id: 'show-modal',
     options: [{ name: 'modal', type: 'text', default: '' }],
-    icon: '',
+    group: 'control-component',
   },
   {
     name: 'Close modal',
     id: 'close-modal',
     options: [{ name: 'modal', type: 'text', default: '' }],
-    icon: '',
+    group: 'control-component',
   },
   {
     name: 'Set table page',
@@ -43,13 +43,13 @@ export const ActionTypes = [
       },
       { name: 'pageIndex', type: 'text', default: '{{1}}' },
     ],
-    icon: '',
+    group: 'control-component',
   },
   {
     name: 'Switch page',
     id: 'switch-page',
     options: [{ name: 'page', type: 'text', default: '' }],
-    icon: '',
+    group: 'navigation',
   },
   {
     name: 'Go to app',
@@ -58,13 +58,13 @@ export const ActionTypes = [
       { name: 'app', type: 'text', default: '' },
       { name: 'queryParams', type: 'code', default: '[]' },
     ],
-    icon: '',
+    group: 'navigation',
   },
   {
     name: 'Open webpage',
     id: 'open-webpage',
     options: [{ name: 'url', type: 'text', default: 'https://example.com' }],
-    icon: '',
+    group: 'navigation',
   },
   {
     name: 'Set page variable',
@@ -73,7 +73,7 @@ export const ActionTypes = [
       { name: 'key', type: 'code', default: '' },
       { name: 'value', type: 'code', default: '' },
     ],
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Unset page variable',
@@ -82,12 +82,12 @@ export const ActionTypes = [
       { name: 'key', type: 'code', default: '' },
       { name: 'value', type: 'code', default: '' },
     ],
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Unset all page variables',
     id: 'unset-all-page-variables',
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Set variable',
@@ -96,23 +96,23 @@ export const ActionTypes = [
       { name: 'key', type: 'code', default: '' },
       { name: 'value', type: 'code', default: '' },
     ],
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Unset variable',
     id: 'unset-custom-variable',
     options: [{ name: 'key', type: 'code', default: '' }],
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Unset all variables',
     id: 'unset-all-custom-variables',
-    icon: '',
+    group: 'variable',
   },
   {
     name: 'Logout',
     id: 'logout',
-    icon: '',
+    group: 'other',
   },
   {
     name: 'Generate file',
@@ -122,7 +122,7 @@ export const ActionTypes = [
       { name: 'fileName', type: 'text', default: '' },
       { name: 'data', type: 'code', default: '{{[]}}' },
     ],
-    icon: '',
+    group: 'other',
   },
   {
     name: 'Set local storage',
@@ -131,12 +131,12 @@ export const ActionTypes = [
       { name: 'key', type: 'code', default: '' },
       { name: 'value', type: 'code', default: '' },
     ],
-    icon: '',
+    group: 'other',
   },
   {
     name: 'Copy to clipboard',
     id: 'copy-to-clipboard',
     options: [{ name: 'copy-to-clipboard', type: 'text', default: '' }],
-    icon: '',
+    group: 'other',
   },
 ];