Merge pull request #3195 from nocodb/chore/gui-v2-disable-right-toolbar-in-form

chore(gui-v2): hide some right toolbar buttons in form view

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

@@ -48,7 +48,7 @@ const view = inject(ActiveViewInj)
 
 const { loadFormView, insertRow, formColumnData, formViewData, updateFormView } = useViewData(meta, view as any)
 
-const { showAll, hideAll, saveOrUpdate } = useViewColumns(view, meta as any, false, async () => {
+const { showAll, hideAll, saveOrUpdate } = useViewColumns(view, meta as any, async () => {
   await loadFormView()
   setFormData()
 })

packages/nc-gui-v2/components/smartsheet/sidebar/index.vue

@@ -3,13 +3,29 @@ import type { FormType, GalleryType, GridType, KanbanType, ViewTypes } from 'noc
 import MenuTop from './MenuTop.vue'
 import MenuBottom from './MenuBottom.vue'
 import Toolbar from './toolbar/index.vue'
-import { computed, inject, provide, ref, useElementHover, useRoute, useRouter, useViews, watch } from '#imports'
-import { ActiveViewInj, MetaInj, RightSidebarInj, ViewListInj } from '~/context'
+import {
+  ActiveViewInj,
+  IsFormInj,
+  MetaInj,
+  RightSidebarInj,
+  ViewListInj,
+  computed,
+  inject,
+  provide,
+  ref,
+  useElementHover,
+  useRoute,
+  useRouter,
+  useViews,
+  watch,
+} from '#imports'
 
 const meta = inject(MetaInj, ref())
 
 const activeView = inject(ActiveViewInj, ref())
 
+const isForm = inject(IsFormInj)
+
 const { views, loadViews } = useViews(meta)
 
 const { isUIAllowed } = useUIPermission()
@@ -109,8 +125,7 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
         </div>
       </Transition>
     </a-tooltip>
-
-    <Toolbar v-if="sidebarOpen" class="flex items-center py-3 px-3 justify-between border-b-1" />
+    <Toolbar v-if="sidebarOpen" :class="{ 'flex items-center py-3 px-3 justify-between border-b-1': !isForm }" />
 
     <Toolbar v-else class="py-3 px-2 max-w-[50px] flex !flex-col-reverse gap-4 items-center mt-[-1px]">
       <template #start>
@@ -132,7 +147,7 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
           </div>
         </a-tooltip>
 
-        <div class="dot" />
+        <div v-if="!isForm" class="dot" />
       </template>
     </Toolbar>
 

packages/nc-gui-v2/components/smartsheet/sidebar/toolbar/index.vue

@@ -5,9 +5,12 @@ import Reload from './Reload.vue'
 import ExportCache from './ExportCache.vue'
 import DeleteCache from './DeleteCache.vue'
 import DebugMeta from './DebugMeta.vue'
+import { IsFormInj } from '#imports'
 
 const { isUIAllowed } = useUIPermission()
 
+const isForm = inject(IsFormInj)
+
 const debug = $ref(false)
 
 const clickCount = $ref(0)
@@ -15,6 +18,7 @@ const clickCount = $ref(0)
 
 <template>
   <div
+    v-if="!isForm"
     class="flex gap-2"
     @click="
       () => {
@@ -51,6 +55,9 @@ const clickCount = $ref(0)
 
     <slot name="end" />
   </div>
+  <div v-else>
+    <slot name="start" />
+  </div>
 </template>
 
 <style scoped>

packages/nc-gui-v2/components/tabs/Smartsheet.vue

@@ -3,7 +3,16 @@ import type { ColumnType, TableType } from 'nocodb-sdk'
 import type { Ref } from 'vue'
 import SmartsheetGrid from '../smartsheet/Grid.vue'
 import { computed, inject, provide, useMetas, useProvideSmartsheetStore, watch, watchEffect } from '#imports'
-import { ActiveViewInj, FieldsInj, IsLockedInj, MetaInj, ReloadViewDataHookInj, RightSidebarInj, TabMetaInj } from '~/context'
+import {
+  ActiveViewInj,
+  FieldsInj,
+  IsFormInj,
+  IsLockedInj,
+  MetaInj,
+  ReloadViewDataHookInj,
+  RightSidebarInj,
+  TabMetaInj,
+} from '~/context'
 import type { TabItem } from '~/composables'
 
 const { getMeta, metas } = useMetas()
@@ -27,6 +36,8 @@ watchEffect(async () => {
 
 const reloadEventHook = createEventHook<void>()
 
+const { isGallery, isGrid, isForm } = useProvideSmartsheetStore(activeView as Ref<TableType>, meta)
+
 // todo: move to store
 provide(MetaInj, meta)
 provide(TabMetaInj, tabMeta)
@@ -35,8 +46,7 @@ provide(IsLockedInj, false)
 provide(ReloadViewDataHookInj, reloadEventHook)
 provide(FieldsInj, fields)
 provide(RightSidebarInj, ref(false))
-
-const { isGallery, isGrid, isForm } = useProvideSmartsheetStore(activeView as Ref<TableType>, meta)
+provide(IsFormInj, isForm)
 
 watch(tabMeta, async (newTabMeta, oldTabMeta) => {
   if (newTabMeta !== oldTabMeta && newTabMeta?.id) await getMeta(newTabMeta.id)