From 5895ddb4bab455353fcd0dccb35909338873d8c1 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 22 Aug 2022 19:28:54 +0530
Subject: [PATCH 1/4] fix/Fixed viewer permission issues

---
 packages/nc-gui-v2/components/smartsheet/Toolbar.vue   |  3 ++-
 .../composables/useUIPermission/rolePermissions.ts     |  1 +
 packages/nc-gui-v2/composables/useViewColumns.ts       | 10 +++++++---
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
index 01260b88b3..a49d8e4a7b 100644
--- a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
@@ -5,6 +5,7 @@ import ToggleDrawer from '~/components/smartsheet/sidebar/toolbar/ToggleDrawer.v
 const { isGrid, isForm, isGallery } = useSmartsheetStoreOrThrow()
 const isPublic = inject(IsPublicInj, ref(false))
 const { allowCSVDownload } = useSharedView()
+const { isUIAllowed } = useUIPermission()
 
 const { isOpen } = useSidebar()
 </script>
@@ -31,7 +32,7 @@ const { isOpen } = useSidebar()
     <div class="flex-1" />
 
     <SmartsheetToolbarReload class="mx-1" />
-    <SmartsheetToolbarAddRow class="mx-1" />
+    <SmartsheetToolbarAddRow v-if="isUIAllowed('dataInsert')" class="mx-1" />
 
     <SmartsheetToolbarSearchData v-if="(isGrid || isGallery) && !isPublic" class="shrink mr-2 ml-2" />
 
diff --git a/packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts b/packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts
index b0884700bd..b89ef57c00 100644
--- a/packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts
+++ b/packages/nc-gui-v2/composables/useUIPermission/rolePermissions.ts
@@ -8,6 +8,7 @@ const rolePermissions = {
     column: true,
     tableAttachment: true,
     tableRowUpdate: true,
+    dataInsert: true,
     rowComments: true,
     gridViewOptions: true,
     sortSync: true,
diff --git a/packages/nc-gui-v2/composables/useViewColumns.ts b/packages/nc-gui-v2/composables/useViewColumns.ts
index 830e9651eb..9923839ed0 100644
--- a/packages/nc-gui-v2/composables/useViewColumns.ts
+++ b/packages/nc-gui-v2/composables/useViewColumns.ts
@@ -19,6 +19,10 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
 
   const { isSharedBase } = useProject()
 
+  const isLocalMode = computed(
+    () => isPublic.value || !isUIAllowed('hideAllColumns') || !isUIAllowed('showAllColumns') || isSharedBase.value,
+  )
+
   const loadViewColumns = async () => {
     if (!meta || !view) return
 
@@ -52,7 +56,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
   }
 
   const showAll = async (ignoreIds?: any) => {
-    if (isPublic.value || isSharedBase.value) {
+    if (isLocalMode.value) {
       fields.value = fields.value?.map((field: Field) => ({
         ...field,
         show: true,
@@ -75,7 +79,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
     reloadData?.()
   }
   const hideAll = async (ignoreIds?: any) => {
-    if (isPublic.value || isSharedBase.value) {
+    if (isLocalMode.value) {
       fields.value = fields.value?.map((field: Field) => ({
         ...field,
         show: false,
@@ -144,7 +148,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
     },
     set(v: boolean) {
       if (view?.value?.id) {
-        if (!isPublic.value && !isSharedBase.value) {
+        if (!isLocalMode.value) {
           $api.dbView
             .update(view.value.id, {
               show_system_fields: v,

From a43c3b9f2c077c13d94a54299a0b4b0c95728ad1 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Mon, 22 Aug 2022 19:46:52 +0530
Subject: [PATCH 2/4] fix/Fixed welcome page for the viewer

---
 .../pages/[projectType]/[projectId]/index/index/index.vue  | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
index 08e1eb1467..f84902cfbe 100644
--- a/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
+++ b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
@@ -12,6 +12,7 @@ const { isOverDropZone } = useDropZone(dropZone, onDrop)
 const { files, open, reset } = useFileDialog()
 
 const { isSharedBase } = useProject()
+const { isUIAllowed } = useUIPermission()
 
 const { $e } = useNuxtApp()
 
@@ -140,8 +141,12 @@ function onDropZoneClick(e: MouseEvent) {
 
 <template>
   <div class="h-full w-full text-gray-600 flex items-center justify-center relative">
-    <div v-if="isSharedBase" class="flex flex-col gap-6 items-center justify-center mx-auto text-center">
+    <div
+      v-if="isSharedBase || !isUIAllowed('dataInsert')"
+      class="flex flex-col gap-6 items-center justify-center mx-auto text-center text-gray-500 border-gray-300 border-1 w-3/5 h-1/2 rounded-md"
+    >
       <div class="text-3xl">Welcome to NocoDB!</div>
+      <div class="prose-lg leading-8">To get started, click on a table in the left pane</div>
     </div>
     <div v-else ref="dropZone">
       <general-overlay

From a69000cc1dab5e7f57ca0b6d9c36169fc224cd33 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Tue, 23 Aug 2022 01:10:11 +0530
Subject: [PATCH 3/4] fix/Improved UX for download for different viewing mode
 and user types

---
 .../components/smartsheet-toolbar/Export.vue  | 17 ++++
 .../smartsheet-toolbar/ExportSubActions.vue   | 80 +++++++++++++++++++
 .../smartsheet-toolbar/ViewActions.vue        | 73 +----------------
 .../smartsheet-toolbar/ViewInfo.vue           | 19 +++++
 .../components/smartsheet/Toolbar.vue         |  6 +-
 5 files changed, 121 insertions(+), 74 deletions(-)
 create mode 100644 packages/nc-gui-v2/components/smartsheet-toolbar/Export.vue
 create mode 100644 packages/nc-gui-v2/components/smartsheet-toolbar/ExportSubActions.vue
 create mode 100644 packages/nc-gui-v2/components/smartsheet-toolbar/ViewInfo.vue

diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/Export.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/Export.vue
new file mode 100644
index 0000000000..c9f30b06e3
--- /dev/null
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/Export.vue
@@ -0,0 +1,17 @@
+<template>
+  <a-dropdown :trigger="['click']">
+    <a-button v-t="['c:actions']" class="nc-actions-menu-btn nc-toolbar-btn">
+      <div class="flex gap-2 items-center">
+        <MdiDownload class="group-hover:text-accent text-gray-500" />
+        <span class="text-capitalize !text-sm font-weight-normal">Download</span>
+        <MdiMenuDown class="text-grey" />
+      </div>
+    </a-button>
+
+    <template #overlay>
+      <a-menu class="ml-6 !text-sm !px-0 !py-2 !rounded">
+        <SmartsheetToolbarExportSubActions />
+      </a-menu>
+    </template>
+  </a-dropdown>
+</template>
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/ExportSubActions.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/ExportSubActions.vue
new file mode 100644
index 0000000000..cca5403190
--- /dev/null
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/ExportSubActions.vue
@@ -0,0 +1,80 @@
+<script setup lang="ts">
+import { ExportTypes } from 'nocodb-sdk'
+import FileSaver from 'file-saver'
+import * as XLSX from 'xlsx'
+import { message } from 'ant-design-vue'
+
+const isPublicView = inject(IsPublicInj, ref(false))
+const fields = inject(FieldsInj, ref([]))
+
+const { project } = useProject()
+
+const { $api } = useNuxtApp()
+
+const meta = inject(MetaInj)
+
+const selectedView = inject(ActiveViewInj)
+
+const exportFile = async (exportType: ExportTypes) => {
+  let offset = 0
+  let c = 1
+  const responseType = exportType === ExportTypes.EXCEL ? 'base64' : 'blob'
+
+  try {
+    while (!isNaN(offset) && offset > -1) {
+      let res
+      if (isPublicView.value) {
+        const { exportFile: sharedViewExportFile } = useSharedView()
+        res = await sharedViewExportFile(fields.value, offset, exportType, responseType)
+      } else {
+        res = await $api.dbViewRow.export(
+          'noco',
+          project?.value.title as string,
+          meta?.value.title as string,
+          selectedView?.value.title as string,
+          exportType,
+          {
+            responseType,
+            query: {
+              offset,
+            },
+          } as any,
+        )
+      }
+      const { data, headers } = res
+      if (exportType === ExportTypes.EXCEL) {
+        const workbook = XLSX.read(data, { type: 'base64' })
+        XLSX.writeFile(workbook, `${meta?.value.title}_exported_${c++}.xlsx`)
+      } else if (exportType === ExportTypes.CSV) {
+        const blob = new Blob([data], { type: 'text/plain;charset=utf-8' })
+        FileSaver.saveAs(blob, `${meta?.value.title}_exported_${c++}.csv`)
+      }
+      offset = +headers['nc-export-offset']
+      if (offset > -1) {
+        message.info('Downloading more files')
+      } else {
+        message.success('Successfully exported all table data')
+      }
+    }
+  } catch (e: any) {
+    message.error(await extractSdkResponseErrorMsg(e))
+  }
+}
+</script>
+
+<template>
+  <a-menu-item>
+    <div v-t="['a:actions:download-csv']" class="nc-project-menu-item" @click="exportFile(ExportTypes.CSV)">
+      <MdiDownloadOutline class="text-gray-500" />
+      <!-- Download as CSV -->
+      {{ $t('activity.downloadCSV') }}
+    </div>
+  </a-menu-item>
+  <a-menu-item>
+    <div v-t="['a:actions:download-excel']" class="nc-project-menu-item" @click="exportFile(ExportTypes.EXCEL)">
+      <MdiDownloadOutline class="text-gray-500" />
+      <!-- Download as XLSX -->
+      {{ $t('activity.downloadExcel') }}
+    </div>
+  </a-menu-item>
+</template>
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue
index d77b3227bc..bd40df2f6e 100644
--- a/packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue
@@ -1,21 +1,15 @@
 <script lang="ts" setup>
-import * as XLSX from 'xlsx'
-import { ExportTypes } from 'nocodb-sdk'
-import FileSaver from 'file-saver'
 import { message } from 'ant-design-vue'
 import { LockType } from '~/lib'
 import { viewIcons } from '~/utils'
 import {
   ActiveViewInj,
-  FieldsInj,
   IsLockedInj,
   IsPublicInj,
-  MetaInj,
   extractSdkResponseErrorMsg,
   inject,
   ref,
   useNuxtApp,
-  useProject,
   useUIPermission,
 } from '#imports'
 import MdiLockOutlineIcon from '~icons/mdi/lock-outline'
@@ -28,14 +22,8 @@ const isPublicView = inject(IsPublicInj, ref(false))
 
 const isView = false
 
-const { project } = useProject()
-
 const { $api, $e } = useNuxtApp()
 
-const meta = inject(MetaInj)
-
-const fields = inject(FieldsInj, ref([]))
-
 const selectedView = inject(ActiveViewInj)
 
 const isLocked = inject(IsLockedInj)
@@ -46,52 +34,6 @@ const quickImportDialog = ref(false)
 
 const { isUIAllowed } = useUIPermission()
 
-const exportFile = async (exportType: ExportTypes) => {
-  let offset = 0
-  let c = 1
-  const responseType = exportType === ExportTypes.EXCEL ? 'base64' : 'blob'
-
-  try {
-    while (!isNaN(offset) && offset > -1) {
-      let res
-      if (isPublicView.value) {
-        const { exportFile: sharedViewExportFile } = useSharedView()
-        res = await sharedViewExportFile(fields.value, offset, exportType, responseType)
-      } else {
-        res = await $api.dbViewRow.export(
-          'noco',
-          project?.value.title as string,
-          meta?.value.title as string,
-          selectedView?.value.title as string,
-          exportType,
-          {
-            responseType,
-            query: {
-              offset,
-            },
-          } as any,
-        )
-      }
-      const { data, headers } = res
-      if (exportType === ExportTypes.EXCEL) {
-        const workbook = XLSX.read(data, { type: 'base64' })
-        XLSX.writeFile(workbook, `${meta?.value.title}_exported_${c++}.xlsx`)
-      } else if (exportType === ExportTypes.CSV) {
-        const blob = new Blob([data], { type: 'text/plain;charset=utf-8' })
-        FileSaver.saveAs(blob, `${meta?.value.title}_exported_${c++}.csv`)
-      }
-      offset = +headers['nc-export-offset']
-      if (offset > -1) {
-        message.info('Downloading more files')
-      } else {
-        message.success('Successfully exported all table data')
-      }
-    }
-  } catch (e: any) {
-    message.error(await extractSdkResponseErrorMsg(e))
-  }
-}
-
 const Icon = computed(() => {
   switch ((selectedView?.value as any)?.lock_type) {
     case LockType.Personal:
@@ -185,20 +127,7 @@ async function changeLockType(type: LockType) {
               </template>
 
               <template #expandIcon></template>
-              <a-menu-item>
-                <div v-t="['a:actions:download-csv']" class="nc-project-menu-item" @click="exportFile(ExportTypes.CSV)">
-                  <MdiDownloadOutline class="text-gray-500" />
-                  <!-- Download as CSV -->
-                  {{ $t('activity.downloadCSV') }}
-                </div>
-              </a-menu-item>
-              <a-menu-item>
-                <div v-t="['a:actions:download-excel']" class="nc-project-menu-item" @click="exportFile(ExportTypes.EXCEL)">
-                  <MdiDownloadOutline class="text-gray-500" />
-                  <!-- Download as XLSX -->
-                  {{ $t('activity.downloadExcel') }}
-                </div>
-              </a-menu-item>
+              <SmartsheetToolbarExportSubActions />
             </a-sub-menu>
             <template v-if="isUIAllowed('csvImport') && !isView && !isPublicView">
               <a-sub-menu key="upload">
diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/ViewInfo.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/ViewInfo.vue
new file mode 100644
index 0000000000..8d6de9a4da
--- /dev/null
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/ViewInfo.vue
@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import { ActiveViewInj, viewIcons } from '#imports'
+
+const selectedView = inject(ActiveViewInj)
+</script>
+
+<template>
+  <div class="flex gap-2 items-center ml-2 mr-2 pr-4 pb-1 py-0.5 border-r-1 border-gray-100">
+    <component
+      :is="viewIcons[selectedView?.type].icon"
+      v-if="selectedView?.type"
+      class="nc-view-icon group-hover:hidden"
+      :style="{ color: viewIcons[selectedView?.type].color }"
+    />
+    <span class="!text-sm font-medium max-w-36 overflow-ellipsis overflow-hidden whitespace-nowrap">{{
+      selectedView?.title
+    }}</span>
+  </div>
+</template>
diff --git a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
index a49d8e4a7b..2287cab3e0 100644
--- a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
@@ -4,7 +4,6 @@ import ToggleDrawer from '~/components/smartsheet/sidebar/toolbar/ToggleDrawer.v
 
 const { isGrid, isForm, isGallery } = useSmartsheetStoreOrThrow()
 const isPublic = inject(IsPublicInj, ref(false))
-const { allowCSVDownload } = useSharedView()
 const { isUIAllowed } = useUIPermission()
 
 const { isOpen } = useSidebar()
@@ -16,11 +15,13 @@ const { isOpen } = useSidebar()
     style="z-index: 7"
   >
     <SmartsheetToolbarViewActions
-      v-if="(isGrid && !isPublic) || (isGrid && isPublic && allowCSVDownload)"
+      v-if="isGrid && !isPublic && isUIAllowed('dataInsert')"
       :show-system-fields="false"
       class="ml-1"
     />
 
+    <SmartsheetToolbarViewInfo v-if="!isUIAllowed('dataInsert') && !isPublic" />
+
     <SmartsheetToolbarFieldsMenu v-if="isGrid || isGallery" :show-system-fields="false" class="ml-1" />
 
     <SmartsheetToolbarColumnFilterMenu v-if="isGrid || isGallery" />
@@ -29,6 +30,7 @@ const { isOpen } = useSidebar()
 
     <SmartsheetToolbarShareView v-if="(isForm || isGrid) && !isPublic" />
 
+    <SmartsheetToolbarExport v-if="!isUIAllowed('dataInsert')" />
     <div class="flex-1" />
 
     <SmartsheetToolbarReload class="mx-1" />

From b1dfeac9bc1c8e1183cd753d0b520b6923d7e318 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa010199@gmail.com>
Date: Tue, 23 Aug 2022 01:16:37 +0530
Subject: [PATCH 4/4] fix/Removed bottom padding and unnecassry ui elements in
 shared view

---
 packages/nc-gui-v2/components/shared-view/Grid.vue   | 3 ++-
 packages/nc-gui-v2/components/smartsheet/Grid.vue    | 2 +-
 packages/nc-gui-v2/components/smartsheet/Toolbar.vue | 6 +++---
 packages/nc-gui-v2/layouts/shared-view.vue           | 6 +++---
 4 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/nc-gui-v2/components/shared-view/Grid.vue b/packages/nc-gui-v2/components/shared-view/Grid.vue
index 59f5310c5e..7c0c8690e9 100644
--- a/packages/nc-gui-v2/components/shared-view/Grid.vue
+++ b/packages/nc-gui-v2/components/shared-view/Grid.vue
@@ -26,7 +26,8 @@ useProvideSmartsheetStore(sharedView as Ref<TableType>, meta, true, sorts, neste
 
 <style scoped>
 .nc-container {
-  height: calc(100% - var(--header-height));
+  height: 100%;
+  padding-bottom: 0.5rem;
   flex: 1 1 100%;
 }
 </style>
diff --git a/packages/nc-gui-v2/components/smartsheet/Grid.vue b/packages/nc-gui-v2/components/smartsheet/Grid.vue
index aff46ce8f7..7852cfd50f 100644
--- a/packages/nc-gui-v2/components/smartsheet/Grid.vue
+++ b/packages/nc-gui-v2/components/smartsheet/Grid.vue
@@ -382,7 +382,7 @@ const onNavigate = (dir: NavigateDir) => {
                   <td key="row-index" class="caption nc-grid-cell pl-5 pr-1">
                     <div class="items-center flex gap-1 min-w-[55px]">
                       <div
-                        v-if="!readOnly && !isLocked"
+                        v-if="!readOnly || !isLocked"
                         class="nc-row-no text-xs text-gray-500"
                         :class="{ hidden: row.rowMeta.selected }"
                       >
diff --git a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
index 2287cab3e0..ec91b6cd7e 100644
--- a/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui-v2/components/smartsheet/Toolbar.vue
@@ -33,12 +33,12 @@ const { isOpen } = useSidebar()
     <SmartsheetToolbarExport v-if="!isUIAllowed('dataInsert')" />
     <div class="flex-1" />
 
-    <SmartsheetToolbarReload class="mx-1" />
-    <SmartsheetToolbarAddRow v-if="isUIAllowed('dataInsert')" class="mx-1" />
+    <SmartsheetToolbarReload v-if="!isPublic" class="mx-1" />
+    <SmartsheetToolbarAddRow v-if="isUIAllowed('dataInsert') && !isPublic" class="mx-1" />
 
     <SmartsheetToolbarSearchData v-if="(isGrid || isGallery) && !isPublic" class="shrink mr-2 ml-2" />
 
-    <ToggleDrawer v-if="!isOpen" class="mr-2" />
+    <ToggleDrawer v-if="!isOpen && !isPublic" class="mr-2" />
   </div>
 </template>
 
diff --git a/packages/nc-gui-v2/layouts/shared-view.vue b/packages/nc-gui-v2/layouts/shared-view.vue
index 60141394c8..0805a47a06 100644
--- a/packages/nc-gui-v2/layouts/shared-view.vue
+++ b/packages/nc-gui-v2/layouts/shared-view.vue
@@ -19,11 +19,11 @@ export default {
         </div>
         <div>
           <div class="flex justify-center items-center">
-            <div class="flex items-center gap-2 ml-3">
+            <div class="flex items-center gap-2 ml-3 text-white">
               <template v-if="isLoading">
-                {{ $t('general.loading') }}
+                <span class="text-white">{{ $t('general.loading') }}</span>
 
-                <MdiReload :class="{ 'animate-infinite animate-spin': isLoading }" />
+                <MdiReload :class="{ 'animate-infinite animate-spin ': isLoading }" />
               </template>
               <div v-else class="text-xl font-semibold truncate text-white">
                 {{ sharedView?.title }}