From 4a31d733a878cf6c4045c08d05ea8a6d32dac785 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Sun, 14 Aug 2022 00:24:51 +0530
Subject: [PATCH] refactor(gui-v2): use edit and readonly injection keys
 properly in all cell

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 packages/nc-gui-v2/components/cell/Checkbox.vue    |  3 ++-
 packages/nc-gui-v2/components/cell/Currency.vue    |  5 +++--
 packages/nc-gui-v2/components/cell/DatePicker.vue  |  5 +++--
 .../nc-gui-v2/components/cell/DateTimePicker.vue   |  4 ++--
 packages/nc-gui-v2/components/cell/Decimal.vue     |  5 +++--
 packages/nc-gui-v2/components/cell/Duration.vue    | 14 +++-----------
 packages/nc-gui-v2/components/cell/Email.vue       |  5 +++--
 packages/nc-gui-v2/components/cell/Float.vue       |  5 +++--
 packages/nc-gui-v2/components/cell/Integer.vue     |  5 +++--
 packages/nc-gui-v2/components/cell/MultiSelect.vue |  5 +++--
 packages/nc-gui-v2/components/cell/Percent.vue     |  5 +++--
 packages/nc-gui-v2/components/cell/Rating.vue      |  5 +++--
 .../nc-gui-v2/components/cell/SingleSelect.vue     |  5 +++--
 packages/nc-gui-v2/components/cell/Text.vue        |  5 +++--
 packages/nc-gui-v2/components/cell/TextArea.vue    |  5 +++--
 packages/nc-gui-v2/components/cell/TimePicker.vue  |  4 ++--
 packages/nc-gui-v2/components/cell/Url.vue         |  5 +++--
 packages/nc-gui-v2/components/cell/YearPicker.vue  |  4 ++--
 .../components/virtual-cell/BelongsTo.vue          |  4 ++--
 .../nc-gui-v2/components/virtual-cell/HasMany.vue  |  4 ++--
 .../components/virtual-cell/ManyToMany.vue         |  4 ++--
 .../virtual-cell/components/ItemChip.vue           |  4 ++--
 .../virtual-cell/components/ListChildItems.vue     |  4 ++--
 23 files changed, 60 insertions(+), 54 deletions(-)

diff --git a/packages/nc-gui-v2/components/cell/Checkbox.vue b/packages/nc-gui-v2/components/cell/Checkbox.vue
index 8cead9365a..9dce776a1a 100644
--- a/packages/nc-gui-v2/components/cell/Checkbox.vue
+++ b/packages/nc-gui-v2/components/cell/Checkbox.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ColumnInj, IsFormInj, getMdiIcon, inject } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue?: boolean | undefined | number
@@ -19,7 +20,7 @@ const column = inject(ColumnInj)
 
 const isForm = inject(IsFormInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const checkboxMeta = $computed(() => {
   return {
diff --git a/packages/nc-gui-v2/components/cell/Currency.vue b/packages/nc-gui-v2/components/cell/Currency.vue
index 789ef8457e..076e780194 100644
--- a/packages/nc-gui-v2/components/cell/Currency.vue
+++ b/packages/nc-gui-v2/components/cell/Currency.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { VNodeRef } from '@vue/runtime-core'
-import { ColumnInj, ReadonlyInj, computed, inject, useVModel } from '#imports'
+import { ColumnInj, computed, inject, useVModel } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | null | undefined
@@ -12,7 +13,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const column = inject(ColumnInj)!
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emit)
 
diff --git a/packages/nc-gui-v2/components/cell/DatePicker.vue b/packages/nc-gui-v2/components/cell/DatePicker.vue
index 2ff27e5000..3b95868d8d 100644
--- a/packages/nc-gui-v2/components/cell/DatePicker.vue
+++ b/packages/nc-gui-v2/components/cell/DatePicker.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import dayjs from 'dayjs'
-import { ColumnInj, ReadonlyInj } from '#imports'
+import { ColumnInj } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -12,7 +13,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const columnMeta = inject(ColumnInj, null)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 let isDateInvalid = $ref(false)
 
diff --git a/packages/nc-gui-v2/components/cell/DateTimePicker.vue b/packages/nc-gui-v2/components/cell/DateTimePicker.vue
index 22e15ed384..7aa0100bd2 100644
--- a/packages/nc-gui-v2/components/cell/DateTimePicker.vue
+++ b/packages/nc-gui-v2/components/cell/DateTimePicker.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import dayjs from 'dayjs'
-import { ReadonlyInj } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -12,7 +12,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const { isMysql } = useProject()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 let isDateInvalid = $ref(false)
 
diff --git a/packages/nc-gui-v2/components/cell/Decimal.vue b/packages/nc-gui-v2/components/cell/Decimal.vue
index bada15abc1..8b5c2db0ec 100644
--- a/packages/nc-gui-v2/components/cell/Decimal.vue
+++ b/packages/nc-gui-v2/components/cell/Decimal.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, inject, useVModel } from '#imports'
+import { inject, useVModel } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | null | string | undefined
@@ -14,7 +15,7 @@ const props = defineProps<Props>()
 
 const emits = defineEmits<Emits>()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emits)
 
diff --git a/packages/nc-gui-v2/components/cell/Duration.vue b/packages/nc-gui-v2/components/cell/Duration.vue
index b267e13dce..5a33005672 100644
--- a/packages/nc-gui-v2/components/cell/Duration.vue
+++ b/packages/nc-gui-v2/components/cell/Duration.vue
@@ -1,14 +1,6 @@
 <script setup lang="ts">
-import {
-  ColumnInj,
-  ReadonlyInj,
-  computed,
-  convertDurationToSeconds,
-  convertMS2Duration,
-  durationOptions,
-  inject,
-  ref,
-} from '#imports'
+import { ColumnInj, computed, convertDurationToSeconds, convertMS2Duration, durationOptions, inject, ref } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | string | null | undefined
@@ -20,7 +12,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const column = inject(ColumnInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const showWarningMessage = ref(false)
 
diff --git a/packages/nc-gui-v2/components/cell/Email.vue b/packages/nc-gui-v2/components/cell/Email.vue
index f85ef871ee..bb54aa85c5 100644
--- a/packages/nc-gui-v2/components/cell/Email.vue
+++ b/packages/nc-gui-v2/components/cell/Email.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, computed, inject, isEmail, useVModel } from '#imports'
+import { computed, inject, isEmail, useVModel } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -14,7 +15,7 @@ const props = defineProps<Props>()
 
 const emits = defineEmits<Emits>()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emits)
 
diff --git a/packages/nc-gui-v2/components/cell/Float.vue b/packages/nc-gui-v2/components/cell/Float.vue
index ff9b02b877..4a4f4f724f 100644
--- a/packages/nc-gui-v2/components/cell/Float.vue
+++ b/packages/nc-gui-v2/components/cell/Float.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, inject, useVModel } from '#imports'
+import { inject, useVModel } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | null | undefined
@@ -14,7 +15,7 @@ const props = defineProps<Props>()
 
 const emits = defineEmits<Emits>()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emits)
 
diff --git a/packages/nc-gui-v2/components/cell/Integer.vue b/packages/nc-gui-v2/components/cell/Integer.vue
index f3686409c1..ba6c1cd2e4 100644
--- a/packages/nc-gui-v2/components/cell/Integer.vue
+++ b/packages/nc-gui-v2/components/cell/Integer.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, inject, useVModel } from '#imports'
+import { inject, useVModel } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | null | undefined
@@ -14,7 +15,7 @@ const props = defineProps<Props>()
 
 const emits = defineEmits<Emits>()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emits)
 
diff --git a/packages/nc-gui-v2/components/cell/MultiSelect.vue b/packages/nc-gui-v2/components/cell/MultiSelect.vue
index 7450b851cd..97fba2b1a8 100644
--- a/packages/nc-gui-v2/components/cell/MultiSelect.vue
+++ b/packages/nc-gui-v2/components/cell/MultiSelect.vue
@@ -1,7 +1,8 @@
 <script lang="ts" setup>
 import type { Select as AntSelect } from 'ant-design-vue'
 import type { SelectOptionType } from 'nocodb-sdk'
-import { ActiveCellInj, ColumnInj, ReadonlyInj, computed, inject } from '#imports'
+import { ActiveCellInj, ColumnInj, computed, inject } from '#imports'
+import { EditModeInj } from '~/context'
 import MdiCloseCircle from '~icons/mdi/close-circle'
 
 interface Props {
@@ -18,7 +19,7 @@ const column = inject(ColumnInj)
 
 // const isForm = inject<boolean>('isForm', false)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const active = inject(ActiveCellInj, ref(false))
 
diff --git a/packages/nc-gui-v2/components/cell/Percent.vue b/packages/nc-gui-v2/components/cell/Percent.vue
index 45655e9657..a47b8c1bbb 100644
--- a/packages/nc-gui-v2/components/cell/Percent.vue
+++ b/packages/nc-gui-v2/components/cell/Percent.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { ColumnInj, ReadonlyInj, computed, getPercentStep, inject, isValidPercent, renderPercent } from '#imports'
+import { ColumnInj, computed, getPercentStep, inject, isValidPercent, renderPercent } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | string | null | undefined
@@ -9,7 +10,7 @@ const { modelValue } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const column = inject(ColumnInj)
 
diff --git a/packages/nc-gui-v2/components/cell/Rating.vue b/packages/nc-gui-v2/components/cell/Rating.vue
index 7125c6051e..4918deb841 100644
--- a/packages/nc-gui-v2/components/cell/Rating.vue
+++ b/packages/nc-gui-v2/components/cell/Rating.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { ColumnInj, ReadonlyInj, computed, inject } from '#imports'
+import { ColumnInj, computed, inject } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue?: number | null | undefined
@@ -11,7 +12,7 @@ const emits = defineEmits(['update:modelValue'])
 
 const column = inject(ColumnInj)!
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const ratingMeta = computed(() => {
   return {
diff --git a/packages/nc-gui-v2/components/cell/SingleSelect.vue b/packages/nc-gui-v2/components/cell/SingleSelect.vue
index 35325a777d..821ba945c4 100644
--- a/packages/nc-gui-v2/components/cell/SingleSelect.vue
+++ b/packages/nc-gui-v2/components/cell/SingleSelect.vue
@@ -1,7 +1,8 @@
 <script lang="ts" setup>
 import type { Select as AntSelect } from 'ant-design-vue'
 import type { SelectOptionType } from 'nocodb-sdk'
-import { ActiveCellInj, ColumnInj, ReadonlyInj, computed, inject } from '#imports'
+import { ActiveCellInj, ColumnInj, computed, inject } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue?: string | undefined
@@ -15,7 +16,7 @@ const column = inject(ColumnInj)
 
 // const isForm = inject<boolean>('isForm', false)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const active = inject(ActiveCellInj, ref(false))
 
diff --git a/packages/nc-gui-v2/components/cell/Text.vue b/packages/nc-gui-v2/components/cell/Text.vue
index 9636897ff6..3ae7cbc189 100644
--- a/packages/nc-gui-v2/components/cell/Text.vue
+++ b/packages/nc-gui-v2/components/cell/Text.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, inject } from '#imports'
+import { inject } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -10,7 +11,7 @@ const props = defineProps<Props>()
 
 const emits = defineEmits(['update:modelValue'])
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = useVModel(props, 'modelValue', emits)
 
diff --git a/packages/nc-gui-v2/components/cell/TextArea.vue b/packages/nc-gui-v2/components/cell/TextArea.vue
index 73b193f35b..71227b2a72 100644
--- a/packages/nc-gui-v2/components/cell/TextArea.vue
+++ b/packages/nc-gui-v2/components/cell/TextArea.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { VNodeRef } from '@vue/runtime-core'
-import { ReadonlyInj, computed, inject } from '#imports'
+import { computed, inject } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -10,7 +11,7 @@ const { modelValue } = defineProps<Props>()
 
 const emits = defineEmits(['update:modelValue'])
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = computed({
   get: () => modelValue ?? '',
diff --git a/packages/nc-gui-v2/components/cell/TimePicker.vue b/packages/nc-gui-v2/components/cell/TimePicker.vue
index a1fccd25aa..a86f07d47c 100644
--- a/packages/nc-gui-v2/components/cell/TimePicker.vue
+++ b/packages/nc-gui-v2/components/cell/TimePicker.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onClickOutside } from '@vueuse/core'
 import dayjs from 'dayjs'
-import { ReadonlyInj } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue?: string | null | undefined
@@ -13,7 +13,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const { isMysql } = useProject()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 let isTimeInvalid = $ref(false)
 
diff --git a/packages/nc-gui-v2/components/cell/Url.vue b/packages/nc-gui-v2/components/cell/Url.vue
index cfbfd0727c..87f5b52e23 100644
--- a/packages/nc-gui-v2/components/cell/Url.vue
+++ b/packages/nc-gui-v2/components/cell/Url.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { VNodeRef } from '@vue/runtime-core'
-import { ColumnInj, ReadonlyInj, computed, inject, isValidURL } from '#imports'
+import { ColumnInj, computed, inject, isValidURL } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: string | null | undefined
@@ -12,7 +13,7 @@ const emit = defineEmits(['update:modelValue'])
 
 const column = inject(ColumnInj)!
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const vModel = computed({
   get: () => value,
diff --git a/packages/nc-gui-v2/components/cell/YearPicker.vue b/packages/nc-gui-v2/components/cell/YearPicker.vue
index 39ca6edaf1..940fe3a4e9 100644
--- a/packages/nc-gui-v2/components/cell/YearPicker.vue
+++ b/packages/nc-gui-v2/components/cell/YearPicker.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { onClickOutside } from '@vueuse/core'
 import dayjs from 'dayjs'
-import { ReadonlyInj } from '#imports'
+import { EditModeInj } from '~/context'
 
 interface Props {
   modelValue: number | string | null | undefined
@@ -11,7 +11,7 @@ const { modelValue } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 let isYearInvalid = $ref(false)
 
diff --git a/packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue b/packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue
index f863851a18..499f8fb3e5 100644
--- a/packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue
+++ b/packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue
@@ -4,7 +4,7 @@ import type { Ref } from 'vue'
 import ItemChip from './components/ItemChip.vue'
 import ListItems from './components/ListItems.vue'
 import { inject, ref, useProvideLTARStore, useSmartsheetRowStoreOrThrow } from '#imports'
-import { ActiveCellInj, CellValueInj, ColumnInj, ReadonlyInj, ReloadViewDataHookInj, RowInj } from '~/context'
+import { ActiveCellInj, CellValueInj, ColumnInj, EditModeInj, ReloadViewDataHookInj, RowInj } from '~/context'
 import MdiArrowExpand from '~icons/mdi/arrow-expand'
 import MdiPlus from '~icons/mdi/plus'
 
@@ -18,7 +18,7 @@ const row = inject(RowInj)
 
 const active = inject(ActiveCellInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const listItemsDlg = ref(false)
 
diff --git a/packages/nc-gui-v2/components/virtual-cell/HasMany.vue b/packages/nc-gui-v2/components/virtual-cell/HasMany.vue
index 47a19044b3..a549964392 100644
--- a/packages/nc-gui-v2/components/virtual-cell/HasMany.vue
+++ b/packages/nc-gui-v2/components/virtual-cell/HasMany.vue
@@ -5,7 +5,7 @@ import ItemChip from './components/ItemChip.vue'
 import ListChildItems from './components/ListChildItems.vue'
 import ListItems from './components/ListItems.vue'
 import { computed, inject, ref, useProvideLTARStore, useSmartsheetRowStoreOrThrow } from '#imports'
-import { CellValueInj, ColumnInj, IsFormInj, ReadonlyInj, ReloadViewDataHookInj, RowInj } from '~/context'
+import { CellValueInj, ColumnInj, EditModeInj, IsFormInj, ReloadViewDataHookInj, RowInj } from '~/context'
 
 const column = inject(ColumnInj)!
 
@@ -17,7 +17,7 @@ const reloadTrigger = inject(ReloadViewDataHookInj)!
 
 const isForm = inject(IsFormInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const listItemsDlg = ref(false)
 
diff --git a/packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue b/packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue
index 62e6221623..a5f4655a5b 100644
--- a/packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue
+++ b/packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue
@@ -5,7 +5,7 @@ import ItemChip from './components/ItemChip.vue'
 import ListChildItems from './components/ListChildItems.vue'
 import ListItems from './components/ListItems.vue'
 import { computed, inject, ref, useProvideLTARStore, useSmartsheetRowStoreOrThrow } from '#imports'
-import { CellValueInj, ColumnInj, IsFormInj, ReadonlyInj, ReloadViewDataHookInj, RowInj } from '~/context'
+import { CellValueInj, ColumnInj, EditModeInj, IsFormInj, ReloadViewDataHookInj, RowInj } from '~/context'
 
 const column = inject(ColumnInj)!
 
@@ -17,7 +17,7 @@ const reloadTrigger = inject(ReloadViewDataHookInj)!
 
 const isForm = inject(IsFormInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const listItemsDlg = ref(false)
 
diff --git a/packages/nc-gui-v2/components/virtual-cell/components/ItemChip.vue b/packages/nc-gui-v2/components/virtual-cell/components/ItemChip.vue
index 15a7090530..f4be7fbad0 100644
--- a/packages/nc-gui-v2/components/virtual-cell/components/ItemChip.vue
+++ b/packages/nc-gui-v2/components/virtual-cell/components/ItemChip.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useLTARStoreOrThrow } from '#imports'
-import { ActiveCellInj, IsFormInj, ReadonlyInj } from '~/context'
+import { ActiveCellInj, EditModeInj, IsFormInj } from '~/context'
 
 interface Props {
   value?: string | number | boolean
@@ -13,7 +13,7 @@ const emit = defineEmits(['unlink'])
 
 const { relatedTableMeta } = useLTARStoreOrThrow()
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const active = inject(ActiveCellInj, ref(false))
 
diff --git a/packages/nc-gui-v2/components/virtual-cell/components/ListChildItems.vue b/packages/nc-gui-v2/components/virtual-cell/components/ListChildItems.vue
index 78302f33cc..8083fb0969 100644
--- a/packages/nc-gui-v2/components/virtual-cell/components/ListChildItems.vue
+++ b/packages/nc-gui-v2/components/virtual-cell/components/ListChildItems.vue
@@ -2,7 +2,7 @@
 import { Empty, Modal } from 'ant-design-vue'
 import type { ColumnType } from 'nocodb-sdk'
 import { computed, useLTARStoreOrThrow, useSmartsheetRowStoreOrThrow, useVModel, watch } from '#imports'
-import { ColumnInj, IsFormInj, ReadonlyInj } from '~/context'
+import { ColumnInj, EditModeInj, IsFormInj } from '~/context'
 
 const props = defineProps<{ modelValue?: boolean }>()
 const emit = defineEmits(['update:modelValue', 'attachRecord'])
@@ -13,7 +13,7 @@ const isForm = inject(IsFormInj, ref(false))
 
 const column = inject(ColumnInj)
 
-const editEnabled = inject(ReadonlyInj)
+const editEnabled = inject(EditModeInj)
 
 const {
   childrenList,