fix(gui-v2): use isUIAllowed('xcDatatableEditable') instead of isSharedBase

packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue

@@ -11,9 +11,9 @@ import {
   defineAsyncComponent,
   inject,
   ref,
-  useProject,
   useProvideLTARStore,
   useSmartsheetRowStoreOrThrow,
+  useUIPermission,
 } from '#imports'
 import MdiArrowExpand from '~icons/mdi/arrow-expand'
 import MdiPlus from '~icons/mdi/plus'
@@ -36,11 +36,12 @@ const readOnly = inject(ReadonlyInj, false)
 
 const isLocked = inject(IsLockedInj)
 
-const { isSharedBase } = useProject()
+const { isUIAllowed } = useUIPermission()
 
 const listItemsDlg = ref(false)
 
 const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
+
 const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
   column as Ref<Required<ColumnType>>,
   row,
@@ -77,7 +78,10 @@ const unlinkRef = async (rec: Record<string, any>) => {
         <ItemChip :item="value" :value="value[relatedTablePrimaryValueProp]" @unlink="unlinkRef(value)" />
       </template>
     </div>
-    <div v-if="!readOnly && !isLocked && !isSharedBase" class="flex-1 flex justify-end gap-1 min-h-[30px] align-center">
+    <div
+      v-if="!readOnly && !isLocked && isUIAllowed('xcDatatableEditable')"
+      class="flex-1 flex justify-end gap-1 min-h-[30px] align-center"
+    >
       <component
         :is="addIcon"
         class="text-sm nc-action-icon text-gray-500/50 hover:text-gray-500 select-none group-hover:(text-gray-500) nc-plus"

packages/nc-gui-v2/components/virtual-cell/HasMany.vue

@@ -13,9 +13,9 @@ import {
   defineAsyncComponent,
   inject,
   ref,
-  useProject,
   useProvideLTARStore,
   useSmartsheetRowStoreOrThrow,
+  useUIPermission,
 } from '#imports'
 
 const ItemChip = defineAsyncComponent(() => import('./components/ItemChip.vue'))
@@ -42,9 +42,10 @@ const listItemsDlg = ref(false)
 
 const childListDlg = ref(false)
 
-const { isSharedBase } = useProject()
+const { isUIAllowed } = useUIPermission()
 
 const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
+
 const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
   column as Ref<Required<ColumnType>>,
   row,
@@ -94,7 +95,10 @@ const unlinkRef = async (rec: Record<string, any>) => {
           </span>
         </template>
       </div>
-      <div v-if="!isLocked && !isSharedBase" class="flex-grow flex justify-end gap-1 min-h-[30px] align-center">
+      <div
+        v-if="!isLocked && isUIAllowed('xcDatatableEditable')"
+        class="flex-grow flex justify-end gap-1 min-h-[30px] align-center"
+      >
         <MdiArrowExpand
           class="select-none transform text-sm nc-action-icon text-gray-500/50 hover:text-gray-500 nc-arrow-expand"
           @click="childListDlg = true"

packages/nc-gui-v2/components/virtual-cell/ManyToMany.vue

@@ -12,9 +12,9 @@ import {
   computed,
   inject,
   ref,
-  useProject,
   useProvideLTARStore,
   useSmartsheetRowStoreOrThrow,
+  useUIPermission,
 } from '#imports'
 
 const ItemChip = defineAsyncComponent(() => import('./components/ItemChip.vue'))
@@ -41,7 +41,7 @@ const listItemsDlg = ref(false)
 
 const childListDlg = ref(false)
 
-const { isSharedBase } = useProject()
+const { isUIAllowed } = useUIPermission()
 
 const { state, isNew, removeLTARRef } = useSmartsheetRowStoreOrThrow()
 const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvideLTARStore(
@@ -94,7 +94,7 @@ const unlinkRef = async (rec: Record<string, any>) => {
         </template>
       </div>
 
-      <div v-if="!isLocked && !isSharedBase" class="flex-1 flex justify-end gap-1 min-h-[30px] align-center">
+      <div v-if="!isLocked && isUIAllowed('xcDatatableEditable')" class="flex-1 flex justify-end gap-1 min-h-[30px] align-center">
         <MdiArrowExpand
           class="text-sm nc-action-icon text-gray-500/50 hover:text-gray-500 nc-arrow-expand"
           @click="childListDlg = true"

packages/nc-gui-v2/components/virtual-cell/components/ItemChip.vue

@@ -7,7 +7,7 @@ import {
   inject,
   ref,
   useLTARStoreOrThrow,
-  useProject,
+  useUIPermission,
 } from '#imports'
 
 interface Props {
@@ -23,9 +23,9 @@ const ExpandedForm: any = defineAsyncComponent(() => import('../../smartsheet/ex
 
 const { relatedTableMeta } = useLTARStoreOrThrow()!
 
-const { isSharedBase } = useProject()
+const { isUIAllowed } = useUIPermission()
 
-const readonly = inject(ReadonlyInj, false)
+const readOnly = inject(ReadonlyInj, false)
 
 const active = inject(ActiveCellInj, ref(false))
 
@@ -50,13 +50,13 @@ export default {
   >
     <span class="name">{{ value }}</span>
 
-    <div v-show="active || isForm" v-if="!readonly && !isLocked" class="flex align-center">
+    <div v-show="active || isForm" v-if="!readOnly && !isLocked && isUIAllowed('xcDatatableEditable')" class="flex align-center">
       <MdiCloseThick class="unlink-icon text-xs text-gray-500/50 group-hover:text-gray-500" @click.stop="emit('unlink')" />
     </div>
 
     <Suspense>
       <ExpandedForm
-        v-if="!readonly && !isLocked && expandedFormDlg && !isSharedBase"
+        v-if="!readOnly && !isLocked && expandedFormDlg"
         v-model="expandedFormDlg"
         :row="{ row: item }"
         :meta="relatedTableMeta"