From 68215684e19e3fe3c831f781684112abb812fdac Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Mon, 2 Oct 2023 09:13:23 +0100
Subject: [PATCH] Prevent row selection, deletion and expansion from triggering
 on click events in grids

---
 .../components/grid/cells/GutterCell.svelte   | 22 ++++++++++++-------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/packages/frontend-core/src/components/grid/cells/GutterCell.svelte b/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
index 5357d4b5cf..ae51599edd 100644
--- a/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
+++ b/packages/frontend-core/src/components/grid/cells/GutterCell.svelte
@@ -17,13 +17,24 @@
   const { config, dispatch, selectedRows } = getContext("grid")
   const svelteDispatch = createEventDispatcher()
 
-  const select = () => {
+  const select = e => {
+    e.stopPropagation()
     svelteDispatch("select")
     const id = row?._id
     if (id) {
       selectedRows.actions.toggleRow(id)
     }
   }
+
+  const bulkDelete = e => {
+    e.stopPropagation()
+    dispatch("request-bulk-delete")
+  }
+
+  const expand = e => {
+    e.stopPropagation()
+    svelteDispatch("expand")
+  }
 </script>
 
 <GridCell
@@ -56,7 +67,7 @@
       {/if}
     {/if}
     {#if rowSelected && $config.canDeleteRows}
-      <div class="delete" on:click={() => dispatch("request-bulk-delete")}>
+      <div class="delete" on:click={bulkDelete}>
         <Icon
           name="Delete"
           size="S"
@@ -65,12 +76,7 @@
       </div>
     {:else}
       <div class="expand" class:visible={$config.canExpandRows && expandable}>
-        <Icon
-          size="S"
-          name="Maximize"
-          hoverable
-          on:click={() => svelteDispatch("expand")}
-        />
+        <Icon size="S" name="Maximize" hoverable on:click={expand} />
       </div>
     {/if}
   </div>