From 1261dec6d0adc913e226e7563de8b8d25600890a Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Fri, 22 Dec 2023 10:31:06 +0000
Subject: [PATCH] fix: Fixed issue with single and multi select click to open
 in grid

---
 packages/nc-gui/components/cell/MultiSelect.vue  | 16 ----------------
 packages/nc-gui/components/cell/SingleSelect.vue | 15 ---------------
 .../tests/db/columns/columnSingleSelect.spec.ts  |  7 ++++++-
 3 files changed, 6 insertions(+), 32 deletions(-)

diff --git a/packages/nc-gui/components/cell/MultiSelect.vue b/packages/nc-gui/components/cell/MultiSelect.vue
index be01b87adc..e5185aa97d 100644
--- a/packages/nc-gui/components/cell/MultiSelect.vue
+++ b/packages/nc-gui/components/cell/MultiSelect.vue
@@ -1,12 +1,10 @@
 <script lang="ts" setup>
-import { onUnmounted } from '@vue/runtime-core'
 import { message } from 'ant-design-vue'
 import tinycolor from 'tinycolor2'
 import type { Select as AntSelect } from 'ant-design-vue'
 import type { SelectOptionType, SelectOptionsType } from 'nocodb-sdk'
 import {
   ActiveCellInj,
-  CellClickHookInj,
   ColumnInj,
   EditColumnInj,
   EditModeInj,
@@ -299,26 +297,12 @@ const onTagClick = (e: Event, onClose: Function) => {
   }
 }
 
-const cellClickHook = inject(CellClickHookInj, null)
-
 const toggleMenu = () => {
-  if (cellClickHook) return
-
   if (isFocusing.value) return
 
   isOpen.value = editAllowed.value && !isOpen.value
 }
 
-const cellClickHookHandler = () => {
-  isOpen.value = editAllowed.value && !isOpen.value
-}
-onMounted(() => {
-  cellClickHook?.on(cellClickHookHandler)
-})
-onUnmounted(() => {
-  cellClickHook?.on(cellClickHookHandler)
-})
-
 const handleClose = (e: MouseEvent) => {
   // close dropdown if clicked outside of dropdown
   if (
diff --git a/packages/nc-gui/components/cell/SingleSelect.vue b/packages/nc-gui/components/cell/SingleSelect.vue
index 02420a9564..a7cd2820a1 100644
--- a/packages/nc-gui/components/cell/SingleSelect.vue
+++ b/packages/nc-gui/components/cell/SingleSelect.vue
@@ -1,12 +1,10 @@
 <script lang="ts" setup>
-import { onUnmounted } from '@vue/runtime-core'
 import { message } from 'ant-design-vue'
 import tinycolor from 'tinycolor2'
 import type { Select as AntSelect } from 'ant-design-vue'
 import type { SelectOptionType } from 'nocodb-sdk'
 import {
   ActiveCellInj,
-  CellClickHookInj,
   ColumnInj,
   EditColumnInj,
   EditModeInj,
@@ -232,8 +230,6 @@ const onSelect = () => {
   isEditable.value = false
 }
 
-const cellClickHook = inject(CellClickHookInj, null)
-
 const toggleMenu = (e: Event) => {
   // todo: refactor
   // check clicked element is clear icon
@@ -244,23 +240,12 @@ const toggleMenu = (e: Event) => {
     vModel.value = ''
     return e.stopPropagation()
   }
-  if (cellClickHook) return
 
   if (isFocusing.value) return
 
   isOpen.value = editAllowed.value && !isOpen.value
 }
 
-const cellClickHookHandler = () => {
-  isOpen.value = editAllowed.value && !isOpen.value
-}
-onMounted(() => {
-  cellClickHook?.on(cellClickHookHandler)
-})
-onUnmounted(() => {
-  cellClickHook?.on(cellClickHookHandler)
-})
-
 const handleClose = (e: MouseEvent) => {
   if (isOpen.value && aselect.value && !aselect.value.$el.contains(e.target)) {
     isOpen.value = false
diff --git a/tests/playwright/tests/db/columns/columnSingleSelect.spec.ts b/tests/playwright/tests/db/columns/columnSingleSelect.spec.ts
index f7b8b04201..74df46ddcc 100644
--- a/tests/playwright/tests/db/columns/columnSingleSelect.spec.ts
+++ b/tests/playwright/tests/db/columns/columnSingleSelect.spec.ts
@@ -39,7 +39,12 @@ test.describe('Single select', () => {
 
     await grid.column.selectOption.addOption({ index: 2, option: 'Option 3', columnTitle: 'SingleSelect' });
 
-    await grid.cell.selectOption.select({ index: 0, columnHeader: 'SingleSelect', option: 'Option 3' });
+    await grid.cell.selectOption.select({
+      index: 0,
+      columnHeader: 'SingleSelect',
+      option: 'Option 3',
+      ignoreDblClick: true,
+    });
     await grid.cell.selectOption.verify({ index: 0, columnHeader: 'SingleSelect', option: 'Option 3' });
 
     await grid.column.selectOption.editOption({ index: 2, columnTitle: 'SingleSelect', newOption: 'New Option 3' });