refactor/gui-v2-Share view minor cleanup

packages/nc-gui-v2/composables/useViewData.ts

@@ -30,17 +30,28 @@ export function useViewData(
     throw new Error('Table meta is not available')
   }
 
-  const paginationData = ref<PaginatedType>({ page: 1, pageSize: 25 })
+  const _paginationData = ref<PaginatedType>({ page: 1, pageSize: 25 })
   const aggCommentCount = ref<{ row_id: string; count: number }[]>([])
   const galleryData = ref<GalleryType>()
   const formColumnData = ref<FormType>()
   // todo: missing properties on FormType (success_msg, show_blank_form,
   const formViewData = ref<FormType & { success_msg?: string; show_blank_form?: boolean }>()
 
+  let isPublic = inject(IsPublicInj, ref(false))
   const { project } = useProject()
   const { fetchSharedViewData, paginationData: sharedPaginationData } = useSharedView()
   const { $api } = useNuxtApp()
-  let isPublic = inject(IsPublicInj, ref(false))
+
+  const paginationData = computed({
+    get: () => (isPublic.value ? sharedPaginationData.value : _paginationData.value),
+    set: (value) => {
+      if (isPublic.value) {
+        sharedPaginationData.value = value
+      } else {
+        _paginationData.value = value
+      }
+    },
+  })
 
   const selectedAllRecords = computed({
     get() {
@@ -322,15 +333,6 @@ export function useViewData(
     }
   }
 
-  watch(
-    () => paginationData.value,
-    () => {
-      if (!isPublic.value) return
-
-      sharedPaginationData.value = paginationData.value
-    },
-  )
-
   return {
     loadData,
     paginationData,

packages/nc-gui-v2/composables/useViewFilters.ts

@@ -2,7 +2,7 @@ import type { FilterType, ViewType } from 'nocodb-sdk'
 import type { ComputedRef, Ref } from 'vue'
 import { useNuxtApp, useUIPermission } from '#imports'
 import { useMetas } from '~/composables/useMetas'
-import { IsPublicInj, MetaInj } from '~/context'
+import { IsPublicInj, ReloadViewDataHookInj } from '~/context'
 
 export function useViewFilters(
   view: Ref<ViewType> | undefined,
@@ -11,16 +11,28 @@ export function useViewFilters(
   reloadData?: () => void,
 ) {
   const { filters: sharedViewFilter } = useSharedView()
-  const meta = inject(MetaInj)
-  const { loadData } = useViewData(meta, view)
 
-  const filters = ref<(FilterType & { status?: 'update' | 'delete' | 'create'; parentId?: string })[]>([])
+  const reloadHook = inject(ReloadViewDataHookInj)
+
+  const _filters = ref<(FilterType & { status?: 'update' | 'delete' | 'create'; parentId?: string })[]>([])
 
   const isPublic = inject(IsPublicInj, ref(false))
   const { $api } = useNuxtApp()
   const { isUIAllowed } = useUIPermission()
   const { metas } = useMetas()
 
+  const filters = computed({
+    get: () => (isPublic.value ? sharedViewFilter.value : _filters.value),
+    set: (value) => {
+      if (isPublic.value) {
+        sharedViewFilter.value = value
+        reloadHook?.trigger()
+      } else {
+        _filters.value = value
+      }
+    },
+  })
+
   const loadFilters = async (hookId?: string) => {
     if (isPublic.value) return
 
@@ -111,27 +123,21 @@ export function useViewFilters(
   }
 
   const addFilter = () => {
-    filters.value = [
-      ...filters.value,
-      {
-        comparison_op: 'eq',
-        value: '',
-        status: 'create',
-        logical_op: 'and',
-      },
-    ]
+    filters.value.push({
+      comparison_op: 'eq',
+      value: '',
+      status: 'create',
+      logical_op: 'and',
+    })
   }
 
   const addFilterGroup = async () => {
-    filters.value = [
-      ...filters.value,
-      {
-        parentId,
-        is_group: true,
-        status: 'create',
-        logical_op: 'and',
-      },
-    ]
+    filters.value.push({
+      parentId,
+      is_group: true,
+      status: 'create',
+      logical_op: 'and',
+    })
     const index = filters.value.length - 1
     await saveOrUpdate(filters.value[index], index, true)
   }
@@ -152,15 +158,5 @@ export function useViewFilters(
     },
   )
 
-  watch(
-    () => filters.value,
-    () => {
-      if (!isPublic.value) return
-
-      sharedViewFilter.value = filters.value
-      loadData()
-    },
-  )
-
   return { filters, loadFilters, sync, deleteFilter, saveOrUpdate, addFilter, addFilterGroup }
 }