Merge pull request #9112 from nocodb/nc-fix/sentry-errors

Nc fix/sentry errors

packages/nc-gui/app.vue

@@ -96,6 +96,27 @@ onMounted(() => {
     refreshCommandPalette()
   })
 })
+
+// ref: https://github.com/vuejs/vue-cli/issues/7431#issuecomment-1793385162
+// Stop error resizeObserver
+const debounce = (callback: (...args: any[]) => void, delay: number) => {
+  let tid: any
+  return function (...args: any[]) {
+    const ctx = self
+    tid && clearTimeout(tid)
+    tid = setTimeout(() => {
+      callback.apply(ctx, args)
+    }, delay)
+  }
+}
+
+const _ = (window as any).ResizeObserver
+;(window as any).ResizeObserver = class ResizeObserver extends _ {
+  constructor(callback: (...args: any[]) => void) {
+    callback = debounce(callback, 20)
+    super(callback)
+  }
+}
 </script>
 
 <template>

packages/nc-gui/components/smartsheet/Kanban.vue

@@ -278,6 +278,8 @@ async function onMove(event: any, stackKey: string) {
 }
 
 const kanbanListScrollHandler = useDebounceFn(async (e: any) => {
+  if (!e.target) return
+
   if (e.target.scrollTop + e.target.clientHeight + INFINITY_SCROLL_THRESHOLD >= e.target.scrollHeight) {
     const stackTitle = e.target.getAttribute('data-stack-title')
     const pageSize = appInfo.value.defaultLimit || 25

packages/nc-gui/components/smartsheet/expanded-form/RichComment.vue

@@ -96,6 +96,8 @@ const editor = useEditor({
   onBlur: (e) => {
     const targetEl = e?.event.relatedTarget as HTMLElement
 
+    if (!targetEl) return
+
     if (
       !targetEl?.closest(
         '.comment-bubble-menu, .nc-rich-text-comment, .tippy-box, .nc-comment-save-btn, .rich-text-bottom-bar, .mention, .nc-mention-list, .tippy-content, .nc-comment-rich-editor',

packages/nc-gui/composables/useExtensions.ts

@@ -188,17 +188,21 @@ export const useExtensions = createSharedComposable(() => {
       return
     }
 
-    const { list } = await $api.extensions.list(baseId)
+    try {
+      const { list } = await $api.extensions.list(baseId)
 
-    const extensions = list?.map((ext: any) => new Extension(ext))
+      const extensions = list?.map((ext: any) => new Extension(ext))
 
-    if (baseExtensions.value[baseId]) {
-      baseExtensions.value[baseId].extensions = extensions || baseExtensions.value[baseId].extensions
-    } else {
-      baseExtensions.value[baseId] = {
-        extensions: extensions || [],
-        expanded: false,
+      if (baseExtensions.value[baseId]) {
+        baseExtensions.value[baseId].extensions = extensions || baseExtensions.value[baseId].extensions
+      } else {
+        baseExtensions.value[baseId] = {
+          extensions: extensions || [],
+          expanded: false,
+        }
       }
+    } catch (e) {
+      console.log(e)
     }
   }
 
@@ -345,7 +349,9 @@ export const useExtensions = createSharedComposable(() => {
     () => base.value?.id,
     (baseId) => {
       if (baseId && !baseExtensions.value[baseId]) {
-        loadExtensionsForBase(baseId)
+        loadExtensionsForBase(baseId).catch((e) => {
+          console.error(e)
+        })
       }
     },
     {

packages/nc-gui/composables/useKanbanViewStore.ts

@@ -52,7 +52,7 @@ const [useProvideKanbanViewStore, useKanbanViewStore] = useInjectionState(
       if (!col) return
 
       if (!search.value.query.trim()) return
-      if (['text', 'string'].includes(sqlUi.value.getAbstractType(col)) && col.dt !== 'bigint') {
+      if (sqlUi.value && ['text', 'string'].includes(sqlUi.value.getAbstractType(col)) && col.dt !== 'bigint') {
         where = `(${col.title},like,%${search.value.query.trim()}%)`
       } else {
         where = `(${col.title},eq,${search.value.query.trim()})`

packages/nc-gui/composables/useSmartsheetStore.ts

@@ -46,7 +46,7 @@ const [useProvideSmartsheetStore, useSmartsheetStore] = useInjectionState(
       if (!col) return
 
       if (!search.value.query.trim()) return
-      if (['text', 'string'].includes(sqlUi.value.getAbstractType(col)) && col.dt !== 'bigint') {
+      if (sqlUi.value && ['text', 'string'].includes(sqlUi.value.getAbstractType(col)) && col.dt !== 'bigint') {
         where = `(${col.title},like,%${search.value.query.trim()}%)`
       } else {
         where = `(${col.title},eq,${search.value.query.trim()})`

packages/nc-gui/composables/useViewColumns.ts

@@ -434,22 +434,27 @@ const [useProvideViewColumns, useViewColumns] = useInjectionState(
           scope: defineViewScope({ view: view.value }),
         })
       }
+      try {
+        // sync with server if allowed
+        if (!isPublic.value && isUIAllowed('viewFieldEdit') && gridViewCols.value[id]?.id) {
+          await $api.dbView.gridColumnUpdate(gridViewCols.value[id].id as string, {
+            ...props,
+          })
+        }
 
-      // sync with server if allowed
-      if (!isPublic.value && isUIAllowed('viewFieldEdit') && gridViewCols.value[id]?.id) {
-        await $api.dbView.gridColumnUpdate(gridViewCols.value[id].id as string, {
-          ...props,
-        })
-      }
-
-      if (gridViewCols.value?.[id]) {
-        Object.assign(gridViewCols.value[id], {
-          ...gridViewCols.value[id],
-          ...props,
-        })
-      } else {
-        // fallback to reload
-        await loadViewColumns()
+        if (gridViewCols.value?.[id]) {
+          Object.assign(gridViewCols.value[id], {
+            ...gridViewCols.value[id],
+            ...props,
+          })
+        } else {
+          // fallback to reload
+          await loadViewColumns()
+        }
+      } catch (e) {
+        // this could happen if user doesn't have permission to update view columns
+        // todo: find out root cause and handle with isUIAllowed
+        console.error(e)
       }
     }
 

packages/nc-gui/composables/useViewData.ts

@@ -143,14 +143,18 @@ export function useViewData(
 
     if (!ids?.length || ids?.some((id) => !id)) return
 
-    aggCommentCount.value = await $api.utils.commentCount({
-      ids,
-      fk_model_id: metaId.value as string,
-    })
-
-    for (const row of formattedData.value) {
-      const id = extractPkFromRow(row.row, meta.value?.columns as ColumnType[])
-      row.rowMeta.commentCount = +(aggCommentCount.value?.find((c: Record<string, any>) => c.row_id === id)?.count || 0)
+    try {
+      aggCommentCount.value = await $api.utils.commentCount({
+        ids,
+        fk_model_id: metaId.value as string,
+      })
+
+      for (const row of formattedData.value) {
+        const id = extractPkFromRow(row.row, meta.value?.columns as ColumnType[])
+        row.rowMeta.commentCount = +(aggCommentCount.value?.find((c: Record<string, any>) => c.row_id === id)?.count || 0)
+      }
+    } catch (e) {
+      console.error(e)
     }
   }
 

packages/nc-gui/store/bases.ts

@@ -182,29 +182,33 @@ export const useBases = defineStore('basesStore', () => {
 
   // actions
   const loadProject = async (baseId: string, force = false) => {
-    if (!force && isProjectPopulated(baseId)) return bases.value.get(baseId)
+    try {
+      if (!force && isProjectPopulated(baseId)) return bases.value.get(baseId)
 
-    const _project = await api.base.read(baseId)
+      const _project = await api.base.read(baseId)
 
-    if (!_project) {
-      await navigateTo(`/`)
-      return
-    }
+      if (!_project) {
+        await navigateTo(`/`)
+        return
+      }
 
-    _project.meta = _project?.meta && typeof _project.meta === 'string' ? JSON.parse(_project.meta) : {}
+      _project.meta = _project?.meta && typeof _project.meta === 'string' ? JSON.parse(_project.meta) : {}
 
-    const existingProject = bases.value.get(baseId) ?? ({} as any)
+      const existingProject = bases.value.get(baseId) ?? ({} as any)
 
-    const base = {
-      ...existingProject,
-      ..._project,
-      isExpanded: route.value.params.baseId === baseId || existingProject.isExpanded,
-      // isLoading is managed by Sidebar
-      isLoading: existingProject.isLoading,
-      meta: { ...parseProp(existingProject.meta), ...parseProp(_project.meta) },
-    }
+      const base = {
+        ...existingProject,
+        ..._project,
+        isExpanded: route.value.params.baseId === baseId || existingProject.isExpanded,
+        // isLoading is managed by Sidebar
+        isLoading: existingProject.isLoading,
+        meta: { ...parseProp(existingProject.meta), ...parseProp(_project.meta) },
+      }
 
-    bases.value.set(baseId, base)
+      bases.value.set(baseId, base)
+    } catch (e: any) {
+      await message.error(await extractSdkResponseErrorMsg(e))
+    }
   }
 
   const getSqlUi = async (baseId: string, sourceId: string) => {