From 35785b78f4c810390d1281c16bed6348a15bfb1b Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Mon, 1 Aug 2022 14:51:21 +0530
Subject: [PATCH] refactor(gui-v2): type correction and avoid unnecessary
 callback in watch

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 .../components/smartsheet-toolbar/FieldsMenu.vue         | 4 +++-
 packages/nc-gui-v2/composables/useViewColumns.ts         | 9 +++------
 packages/nc-gui-v2/context/index.ts                      | 2 +-
 3 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue b/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
index 4f9215170d..9d459f2580 100644
--- a/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
+++ b/packages/nc-gui-v2/components/smartsheet-toolbar/FieldsMenu.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { TableType } from 'nocodb-sdk'
+import type { ComputedRef } from 'vue'
 import { computed, inject } from 'vue'
 import Draggable from 'vuedraggable'
 import { ActiveViewInj, FieldsInj, IsLockedInj, MetaInj, ReloadViewDataHookInj } from '~/context'
@@ -38,7 +40,7 @@ const {
   hideAll,
   saveOrUpdate,
   sortedFields,
-} = useViewColumns(activeView, meta, false, () => reloadDataHook?.trigger())
+} = useViewColumns(activeView, meta as ComputedRef<TableType>, false, () => reloadDataHook?.trigger())
 
 watch(
   () => activeView?.value?.id,
diff --git a/packages/nc-gui-v2/composables/useViewColumns.ts b/packages/nc-gui-v2/composables/useViewColumns.ts
index a9ab3e5bb7..b1057c5f56 100644
--- a/packages/nc-gui-v2/composables/useViewColumns.ts
+++ b/packages/nc-gui-v2/composables/useViewColumns.ts
@@ -1,12 +1,12 @@
 import { isSystemColumn } from 'nocodb-sdk'
 import type { ColumnType, FormType, GalleryType, GridType, TableType } from 'nocodb-sdk'
 import { watch } from 'vue'
-import type { Ref } from 'vue'
+import type { ComputedRef, Ref } from 'vue'
 import { useNuxtApp } from '#app'
 
 export default function (
   view: Ref<(GridType | FormType | GalleryType) & { id?: string }> | undefined,
-  meta: Ref<TableType> | undefined,
+  meta: ComputedRef<TableType>,
   isPublic = false,
   reloadData?: () => void,
 ) {
@@ -131,10 +131,7 @@ export default function (
   })
 
   // reload view columns when table meta changes
-  watch(
-    () => meta?.value,
-    () => loadViewColumns(),
-  )
+  watch(meta, () => loadViewColumns())
 
   return {
     fields,
diff --git a/packages/nc-gui-v2/context/index.ts b/packages/nc-gui-v2/context/index.ts
index d455e0d811..c3f1953239 100644
--- a/packages/nc-gui-v2/context/index.ts
+++ b/packages/nc-gui-v2/context/index.ts
@@ -5,7 +5,7 @@ import type { useViewData } from '#imports'
 import type { TabItem } from '~/composables/useTabs'
 
 export const ColumnInj: InjectionKey<ColumnType & { meta: any }> = Symbol('column-injection')
-export const MetaInj: InjectionKey<Ref<TableType>> = Symbol('meta-injection')
+export const MetaInj: InjectionKey<ComputedRef<TableType>> = Symbol('meta-injection')
 export const TabMetaInj: InjectionKey<ComputedRef<TabItem>> = Symbol('tab-meta-injection')
 export const PaginationDataInj: InjectionKey<ReturnType<typeof useViewData>['paginationData']> =
   Symbol('pagination-data-injection')