feat(gui-v2): make shared views editable

packages/nc-gui-v2/components/shared-view/Grid.vue

@@ -1,10 +1,13 @@
 <script setup lang="ts">
 import type { Ref } from 'vue'
 import type { TableType } from 'nocodb-sdk'
+import { message } from 'ant-design-vue'
 
 import { ActiveViewInj, FieldsInj, IsPublicInj, MetaInj, ReadonlyInj, ReloadViewDataHookInj } from '~/context'
 
 const { sharedView, meta, sorts, nestedFilters } = useSharedView()
+const { isAuthenticated } = useGlobal()
+const { loadProject } = useProject(meta?.value.project_id)
 
 const reloadEventHook = createEventHook<void>()
 provide(ReloadViewDataHookInj, reloadEventHook)
@@ -15,6 +18,15 @@ provide(FieldsInj, ref(meta.value.columns as any[]))
 provide(IsPublicInj, ref(true))
 
 useProvideSmartsheetStore(sharedView as Ref<TableType>, meta, true, sorts, nestedFilters)
+
+if (isAuthenticated) {
+  try {
+    await loadProject()
+  } catch (e: any) {
+    console.error(e)
+    message.error(await extractSdkResponseErrorMsg(e))
+  }
+}
 </script>
 
 <template>

packages/nc-gui-v2/components/smartsheet/Cell.vue

@@ -170,6 +170,6 @@ const syncAndNavigate = (dir: NavigateDir) => {
     <CellText v-else-if="isString" v-model="vModel" />
     <CellJson v-else-if="isJSON" v-model="vModel" />
     <CellText v-else v-model="vModel" />
-    <div v-if="(isLocked || (isPublic && !isForm)) && !isAttachment" class="nc-locked-overlay" @click.stop.prevent />
+    <div v-if="(isLocked || (isPublic && readOnly && !isForm)) && !isAttachment" class="nc-locked-overlay" @click.stop.prevent />
   </div>
 </template>

packages/nc-gui-v2/components/smartsheet/Grid.vue

@@ -49,6 +49,7 @@ const reloadViewDataHook = inject(ReloadViewDataHookInj, createEventHook())
 const openNewRecordFormHook = inject(OpenNewRecordFormHookInj, createEventHook())
 
 const { isUIAllowed } = useUIPermission()
+const hasEditPermission = isUIAllowed('xcDatatableEditable')
 
 // todo: get from parent ( inject or use prop )
 const isView = false
@@ -65,7 +66,7 @@ const _contextMenu = ref(false)
 const contextMenu = computed({
   get: () => _contextMenu.value,
   set: (val) => {
-    if (!readOnly) {
+    if (hasEditPermission) {
       _contextMenu.value = val
     }
   },
@@ -102,7 +103,7 @@ provide(PaginationDataInj, paginationData)
 
 provide(ChangePageInj, changePage)
 
-provide(ReadonlyInj, !isUIAllowed('xcDatatableEditable'))
+provide(ReadonlyInj, !hasEditPermission)
 
 reloadViewDataHook?.on(async () => {
   await loadData()
@@ -170,7 +171,7 @@ const clearCell = async (ctx: { row: number; col: number }) => {
 const { copy } = useClipboard()
 
 const makeEditable = (row: Row, col: ColumnType) => {
-  if (isPublicView.value || editEnabled || isView) {
+  if (!hasEditPermission || editEnabled || isView) {
     return
   }
   if (!isPkAvail.value && !row.rowMeta.new) {
@@ -426,7 +427,7 @@ const onNavigate = (dir: NavigateDir) => {
                     :key="columnObj.id"
                     class="cell relative cursor-pointer nc-grid-cell"
                     :class="{
-                      active: !isPublicView && selected.col === colIndex && selected.row === rowIndex,
+                      active: isUIAllowed('xcDatatableEditable') && selected.col === colIndex && selected.row === rowIndex,
                     }"
                     :data-key="rowIndex + columnObj.id"
                     :data-col="columnObj.id"
@@ -472,7 +473,7 @@ const onNavigate = (dir: NavigateDir) => {
           TODO: add relationType !== 'bt' ?
           v1: <tr v-if="!isView && !isLocked && !isPublicView && isEditable && relationType !== 'bt'">
         -->
-            <tr v-if="!isView && !isLocked && !isPublicView && isUIAllowed('xcDatatableEditable')">
+            <tr v-if="!isView && !isLocked && isUIAllowed('xcDatatableEditable')">
               <td
                 v-t="['c:row:add:grid-bottom']"
                 :colspan="visibleColLength + 1"

packages/nc-gui-v2/composables/useGlobal/state.ts

@@ -75,6 +75,7 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
     get: () => storage.value.token || '',
     set: (val) => (storage.value.token = val),
   })
+  const isAuthenticated = !!token.value
 
   const appInfo = ref<AppInfo>({
     ncSiteUrl: process.env.NC_BACKEND_URL || (process.env.NODE_ENV === 'production' ? location.origin : 'http://localhost:8080'),
@@ -105,6 +106,7 @@ export function useGlobalState(storageKey = 'nocodb-gui-v2'): State {
     ...toRefs(storage.value),
     storage,
     token,
+    isAuthenticated,
     jwtPayload: payload,
     timestamp,
     runningRequests,

packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts

@@ -1,4 +1,5 @@
 const rolePermissions = {
+  super: '*',
   creator: '*',
   owner: '*',
   guest: {},