From c6685912e6000ce9228777f113a9e058a3bc31e8 Mon Sep 17 00:00:00 2001
From: Armin Mehinovic <4390250+arminmeh@users.noreply.github.com>
Date: Fri, 13 Dec 2024 11:06:07 +0100
Subject: [PATCH] [DataGrid] Toggle menu on click in `GridActionsCell`
 (@k-rajat19) (#15871)

Co-authored-by: Rajat <robertdoweny2301@gmail.com>
---
 .../x-data-grid/src/components/cell/GridActionsCell.tsx  | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/x-data-grid/src/components/cell/GridActionsCell.tsx b/packages/x-data-grid/src/components/cell/GridActionsCell.tsx
index 39c20b5c639e2..dbe8571e6cbb5 100644
--- a/packages/x-data-grid/src/components/cell/GridActionsCell.tsx
+++ b/packages/x-data-grid/src/components/cell/GridActionsCell.tsx
@@ -121,6 +121,13 @@ function GridActionsCell(props: GridActionsCellProps) {
   const hideMenu = () => {
     setOpen(false);
   };
+  const toggleMenu = () => {
+    if (open) {
+      hideMenu();
+    } else {
+      showMenu();
+    }
+  };
 
   const handleTouchRippleRef =
     (index: string | number) => (instance: TouchRippleActions | null) => {
@@ -213,7 +220,7 @@ function GridActionsCell(props: GridActionsCellProps) {
           aria-controls={open ? menuId : undefined}
           role="menuitem"
           size="small"
-          onClick={showMenu}
+          onClick={toggleMenu}
           touchRippleRef={handleTouchRippleRef(buttonId)}
           tabIndex={focusedButtonIndex === iconButtons.length ? tabIndex : -1}
           {...rootProps.slotProps?.baseIconButton}