chore(nc-gui): remove `as any` typecasts wherever possible

packages/nc-gui/components/dashboard/TreeView.vue

@@ -104,7 +104,7 @@ const initSortable = (el: Element) => {
 
       // update the item order
       await $api.dbTable.reorder(item.id as string, {
-        order: item.order as any,
+        order: item.order,
       })
     },
     animation: 150,
@@ -142,7 +142,7 @@ const reloadTables = async () => {
 }
 
 const addTableTab = (table: TableType) => {
-  addTab({ title: table.title, id: table.id, type: table.type as any })
+  addTab({ title: table.title, id: table.id, type: table.type as TabType })
 }
 
 function openRenameTableDialog(table: TableType, rightClick = false) {

packages/nc-gui/components/shared-view/Grid.vue

@@ -1,12 +1,10 @@
 <script setup lang="ts">
-import type { Ref } from 'vue'
-import type { TableType } from 'nocodb-sdk'
 import { message } from 'ant-design-vue'
-import { ActiveViewInj, FieldsInj, IsPublicInj, MetaInj, ReadonlyInj, ReloadViewDataHookInj } from '~/context'
+import { ActiveViewInj, FieldsInj, IsPublicInj, MetaInj, ReadonlyInj, ReloadViewDataHookInj } from '#imports'
 
 const { sharedView, meta, sorts, nestedFilters } = useSharedView()
 const { signedIn } = useGlobal()
-const { loadProject } = useProject((meta.value as any)?.project_id)
+const { loadProject } = useProject(meta.value?.project_id)
 
 const reloadEventHook = createEventHook<void>()
 
@@ -14,10 +12,10 @@ provide(ReloadViewDataHookInj, reloadEventHook)
 provide(ReadonlyInj, true)
 provide(MetaInj, meta)
 provide(ActiveViewInj, sharedView)
-provide(FieldsInj, ref(meta.value.columns as any[]))
+provide(FieldsInj, ref(meta.value?.columns || []))
 provide(IsPublicInj, ref(true))
 
-useProvideSmartsheetStore(sharedView as Ref<TableType>, meta, true, sorts, nestedFilters)
+useProvideSmartsheetStore(sharedView, meta, true, sorts, nestedFilters)
 
 if (signedIn.value) {
   try {

packages/nc-gui/components/smartsheet-toolbar/ExportSubActions.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { RequestParams } from 'nocodb-sdk'
 import { ExportTypes } from 'nocodb-sdk'
 import FileSaver from 'file-saver'
 import * as XLSX from 'xlsx'
@@ -47,7 +48,7 @@ const exportFile = async (exportType: ExportTypes) => {
               sortArrJson: JSON.stringify(sorts.value),
               filterArrJson: JSON.stringify(nestedFilters.value),
             },
-          } as any,
+          } as RequestParams,
         )
       }
       const { data, headers } = res

packages/nc-gui/components/smartsheet-toolbar/FieldsMenu.vue

@@ -48,7 +48,7 @@ const {
 } = useViewColumns(activeView, meta, () => reloadDataHook.trigger())
 
 watch(
-  () => (activeView.value as any)?.id,
+  () => activeView.value?.id,
   async (newVal, oldVal) => {
     if (newVal !== oldVal && meta.value) {
       await loadViewColumns()

packages/nc-gui/components/smartsheet-toolbar/MoreActions.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import * as XLSX from 'xlsx'
+import type { RequestParams } from 'nocodb-sdk'
 import { ExportTypes } from 'nocodb-sdk'
 import FileSaver from 'file-saver'
 import { message } from 'ant-design-vue'
@@ -71,7 +72,7 @@ const exportFile = async (exportType: ExportTypes) => {
               sortArrJson: JSON.stringify(sorts.value),
               filterArrJson: JSON.stringify(nestedFilters.value),
             },
-          } as any,
+          } as RequestParams,
         )
       }
       const { data, headers } = res

packages/nc-gui/components/smartsheet-toolbar/ShareView.vue

@@ -69,7 +69,7 @@ async function saveAllowCSVDownload() {
     const meta = shared.value.meta && typeof shared.value.meta === 'string' ? JSON.parse(shared.value.meta) : shared.value.meta
     await $api.dbViewShare.update(shared.value.id, {
       meta,
-    } as any)
+    })
     // Successfully updated
     message.success(t('msg.success.updated'))
   } catch (e: any) {

packages/nc-gui/components/smartsheet-toolbar/SortListMenu.vue

@@ -32,7 +32,7 @@ const columnByID = computed(() =>
 )
 
 watch(
-  () => (view?.value as any)?.id,
+  () => view!.value?.id,
   () => {
     loadSorts()
   },

packages/nc-gui/components/smartsheet-toolbar/ViewActions.vue

@@ -44,7 +44,7 @@ const { isUIAllowed } = useUIPermission()
 const { isSharedBase } = useProject()
 
 const Icon = computed(() => {
-  switch ((selectedView?.value as any)?.lock_type) {
+  switch (selectedView?.value.lock_type) {
     case LockType.Personal:
       return MdiAccountIcon
     case LockType.Locked:
@@ -65,8 +65,8 @@ async function changeLockType(type: LockType) {
     return message.info(t('msg.toast.futureRelease'))
   }
   try {
-    ;(selectedView.value as any).lock_type = type
-    $api.dbView.update(selectedView.value.id as string, {
+    selectedView.value.lock_type = type
+    await $api.dbView.update(selectedView.value.id as string, {
       lock_type: type,
     })
 

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

@@ -1,10 +1,18 @@
 <script setup lang="ts">
 import HTTPSnippet from 'httpsnippet'
-import { useClipboard } from '@vueuse/core'
 import { message } from 'ant-design-vue'
-import { useI18n } from 'vue-i18n'
-import { ActiveViewInj, MetaInj } from '~/context'
-import { inject, useGlobal, useProject, useSmartsheetStoreOrThrow, useVModel, useViewData } from '#imports'
+import {
+  ActiveViewInj,
+  MetaInj,
+  inject,
+  useClipboard,
+  useGlobal,
+  useI18n,
+  useProject,
+  useSmartsheetStoreOrThrow,
+  useVModel,
+  useViewData,
+} from '#imports'
 
 const props = defineProps<Props>()
 
@@ -26,7 +34,7 @@ const view = $(inject(ActiveViewInj)!)
 
 const { xWhere } = useSmartsheetStoreOrThrow()
 
-const { queryParams } = $(useViewData($$(meta), view as any, xWhere))
+const { queryParams } = $(useViewData($$(meta), $$(view), xWhere))
 
 const { copy } = useClipboard()
 

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

@@ -59,7 +59,7 @@ reloadEventHook.on(async () => {
   setFormData()
 })
 
-const { showAll, hideAll, saveOrUpdate } = useViewColumns(view, meta as any, async () => reloadEventHook.trigger())
+const { showAll, hideAll, saveOrUpdate } = useViewColumns(view, meta, async () => reloadEventHook.trigger())
 
 const { syncLTARRefs, row } = useProvideSmartsheetRowStore(
   meta,
@@ -252,10 +252,9 @@ function setFormData() {
 
   formViewData.value = {
     ...formViewData.value,
-    submit_another_form: !!(formViewData?.value?.submit_another_form ?? 0),
-    // todo: show_blank_form missing from FormType
-    show_blank_form: !!((formViewData?.value as any)?.show_blank_form ?? 0),
-  } as any
+    submit_another_form: !!(formViewData.value?.submit_another_form ?? 0),
+    show_blank_form: !!(formViewData.value?.show_blank_form ?? 0),
+  }
 
   // email me
   let data: Record<string, boolean> = {}
@@ -338,7 +337,7 @@ const updateColMeta = useDebounceFn(async (col: Record<string, any>) => {
 }, 250)
 
 watch(submitted, (v) => {
-  if (v && (formViewData?.value as any)?.show_blank_form) {
+  if (v && formViewData.value?.show_blank_form) {
     secondsRemain.value = 5
     const intvl = setInterval(() => {
       if (--secondsRemain.value < 0) {

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

@@ -1,8 +1,5 @@
 <script lang="ts" setup>
 import { isVirtualCol } from 'nocodb-sdk'
-import { inject, provide, useViewData } from '#imports'
-import Row from '~/components/smartsheet/Row.vue'
-import type { Row as RowType } from '~/composables'
 import {
   ActiveViewInj,
   ChangePageInj,
@@ -14,15 +11,21 @@ import {
   OpenNewRecordFormHookInj,
   PaginationDataInj,
   ReadonlyInj,
-} from '~/context'
+  ReloadViewDataHookInj,
+  inject,
+  provide,
+  useViewData,
+} from '#imports'
+import Row from '~/components/smartsheet/Row.vue'
+import type { Row as RowType } from '~/composables'
 import ImageIcon from '~icons/mdi/file-image-box'
 
 interface Attachment {
   url: string
 }
 
-const meta = inject(MetaInj)
-const view = inject(ActiveViewInj)
+const meta = inject(MetaInj)!
+const view = inject(ActiveViewInj)!
 const reloadViewDataHook = inject(ReloadViewDataHookInj)
 const openNewRecordFormHook = inject(OpenNewRecordFormHookInj, createEventHook())
 
@@ -38,7 +41,7 @@ const {
   galleryData,
   changePage,
   addEmptyRow,
-} = useViewData(meta, view as any)
+} = useViewData(meta, view)
 
 const { isUIAllowed } = useUIPermission()
 
@@ -192,15 +195,18 @@ openNewRecordFormHook?.on(async () => {
   grid-auto-rows: 1fr;
   grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
 }
-:depp(.slick-dots li button) {
+
+:deep(.slick-dots li button) {
   background-color: black;
 }
+
 .ant-carousel.gallery-carousel :deep(.slick-dots) {
   position: relative;
   height: auto;
   bottom: 0px;
 }
-.ant-carousel.gallery-carousel :deep(.slick-dots li div > div) {
+
+.ant-carousel.gallery-carousel :deep(.slick-dots li div) {
   background: #000;
   border: 0;
   border-radius: 1px;
@@ -215,15 +221,18 @@ openNewRecordFormHook?.on(async () => {
   transition: all 0.5s;
   width: 100%;
 }
-.ant-carousel.gallery-carousel :deep(.slick-dots li.slick-active div > div) {
+
+.ant-carousel.gallery-carousel :deep(.slick-dots li.slick-active div) {
   opacity: 1;
 }
+
 .ant-carousel.gallery-carousel :deep(.slick-prev) {
   left: 0;
   height: 100%;
   top: 12px;
   width: 50%;
 }
+
 .ant-carousel.gallery-carousel :deep(.slick-next) {
   right: 0;
   height: 100%;

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

@@ -17,7 +17,6 @@ import {
   ReadonlyInj,
   ReloadViewDataHookInj,
   createEventHook,
-  enumColor,
   inject,
   onClickOutside,
   onMounted,
@@ -37,9 +36,9 @@ import { NavigateDir } from '~/lib'
 
 const { t } = useI18n()
 
-const meta = inject(MetaInj)
+const meta = inject(MetaInj)!
 
-const view = inject(ActiveViewInj)
+const view = inject(ActiveViewInj)!
 
 // keep a root fields variable and will get modified from
 // fields menu and get used in grid and gallery
@@ -93,7 +92,7 @@ const {
   deleteSelectedRows,
   selectedAllRecords,
   removeRowIfNew,
-} = useViewData(meta, view as any, xWhere)
+} = useViewData(meta, view, xWhere)
 
 const { loadGridViewColumns, updateWidth, resizingColWidth, resizingCol } = useGridViewColumnWidth(view as any)
 onMounted(loadGridViewColumns)
@@ -137,9 +136,9 @@ const selectCell = (row: number, col: number) => {
 }
 
 watch(
-  () => (view?.value as any)?.id,
-  async (n?: string, o?: string) => {
-    if (n && o && n !== o) {
+  () => view?.value.id,
+  async (next, old) => {
+    if (next && old && next !== old) {
       await loadData()
     }
   },

packages/nc-gui/components/tabs/auth/UserManagement.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
 import { message } from 'ant-design-vue'
 import { useI18n } from 'vue-i18n'
+import type { RequestParams } from 'nocodb-sdk'
 import UsersModal from './user-management/UsersModal.vue'
 import FeedbackForm from './user-management/FeedbackForm.vue'
 import {
   extractSdkResponseErrorMsg,
   onBeforeMount,
-  projectRoleTagColors,
   ref,
   useApi,
   useClipboard,
@@ -61,7 +61,7 @@ const loadUsers = async (page = currentPage, limit = currentLimit) => {
         offset: searchText.value.length === 0 ? (page - 1) * limit : 0,
         query: searchText.value,
       },
-    } as any)
+    } as RequestParams)
     if (!response.users) return
 
     totalRows = response.users.pageInfo.totalRows ?? 0

packages/nc-gui/components/tabs/auth/user-management/ShareBase.vue

@@ -35,8 +35,7 @@ const loadBase = async () => {
   try {
     if (!project.value.id) return
 
-    // todo: response is missing roles in type
-    const res = (await $api.project.sharedBaseGet(project.value.id)) as any
+    const res = await $api.project.sharedBaseGet(project.value.id)
 
     base = {
       uuid: res.uuid,
@@ -52,10 +51,9 @@ const createShareBase = async (role = ShareBaseRole.Viewer) => {
   try {
     if (!project.value.id) return
 
-    // todo: return type void?
-    const res = (await $api.project.sharedBaseUpdate(project.value.id, {
+    const res = await $api.project.sharedBaseUpdate(project.value.id, {
       roles: role,
-    })) as any
+    })
 
     base = res ?? {}
     base!.role = role

packages/nc-gui/components/virtual-cell/HasMany.vue

@@ -54,7 +54,7 @@ const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvid
 )
 await loadRelatedTableMeta()
 
-const localCellValue = computed(() => {
+const localCellValue = computed<any[]>(() => {
   if (cellValue?.value) {
     return cellValue?.value ?? []
   } else if (isNew.value) {
@@ -64,7 +64,7 @@ const localCellValue = computed(() => {
 })
 
 const cells = computed(() =>
-  localCellValue.value.reduce((acc: any[], curr: any) => {
+  localCellValue.value.reduce((acc, curr) => {
     if (!relatedTablePrimaryValueProp.value) return acc
 
     const value = curr[relatedTablePrimaryValueProp.value]
@@ -72,12 +72,12 @@ const cells = computed(() =>
     if (!value) return acc
 
     return [...acc, { value, item: curr }]
-  }, [] as any[]),
+  }, []),
 )
 
 const unlinkRef = async (rec: Record<string, any>) => {
   if (isNew.value) {
-    removeLTARRef(rec, column?.value as ColumnType)
+    await removeLTARRef(rec, column.value)
   } else {
     await unlink(rec)
   }

packages/nc-gui/components/virtual-cell/ManyToMany.vue

@@ -53,7 +53,7 @@ const { loadRelatedTableMeta, relatedTablePrimaryValueProp, unlink } = useProvid
 
 await loadRelatedTableMeta()
 
-const localCellValue = computed(() => {
+const localCellValue = computed<any[]>(() => {
   if (cellValue?.value) {
     return cellValue?.value ?? []
   } else if (isNew.value) {
@@ -63,7 +63,7 @@ const localCellValue = computed(() => {
 })
 
 const cells = computed(() =>
-  localCellValue.value.reduce((acc: any[], curr: any) => {
+  localCellValue.value.reduce((acc, curr) => {
     if (!relatedTablePrimaryValueProp.value) return acc
 
     const value = curr[relatedTablePrimaryValueProp.value]
@@ -71,12 +71,12 @@ const cells = computed(() =>
     if (!value) return acc
 
     return [...acc, { value, item: curr }]
-  }, [] as any[]),
+  }, []),
 )
 
 const unlinkRef = async (rec: Record<string, any>) => {
   if (isNew.value) {
-    removeLTARRef(rec, column?.value as ColumnType)
+    await removeLTARRef(rec, column.value)
   } else {
     await unlink(rec)
   }

packages/nc-gui/components/webhook/Editor.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { Form, message } from 'ant-design-vue'
 import { useI18n } from 'vue-i18n'
+import type { Ref } from 'vue'
 import { MetaInj, extractSdkResponseErrorMsg, fieldRequiredValidator, inject, reactive, useApi, useNuxtApp } from '#imports'
 
 const emit = defineEmits(['backToList', 'editOrAdd'])
@@ -254,28 +255,28 @@ async function onEventChange() {
 
   hook.notification.payload = payload
 
-  let channels: Record<string, any>[] | null = null
+  let channels: Ref<Record<string, any>[] | null> = ref(null)
 
   switch (hook.notification.type) {
     case 'Slack':
-      channels = slackChannels as any
+      channels = slackChannels
       break
     case 'Microsoft Teams':
-      channels = teamsChannels as any
+      channels = teamsChannels
       break
     case 'Discord':
-      channels = discordChannels as any
+      channels = discordChannels
       break
     case 'Mattermost':
-      channels = mattermostChannels as any
+      channels = mattermostChannels
       break
   }
 
   if (channels) {
     hook.notification.payload.webhook_url =
       hook.notification.payload.webhook_url &&
-      hook.notification.payload.webhook_url.map((v: Record<string, any>) =>
-        channels?.find((s: Record<string, any>) => v.webhook_url === s.webhook_url),
+      hook.notification.payload.webhook_url.map((v: { webhook_url: string }) =>
+        channels.value?.find((s) => v.webhook_url === s.webhook_url),
       )
   }
 
@@ -289,13 +290,21 @@ async function onEventChange() {
 
 async function loadPluginList() {
   try {
-    const plugins = (await api.plugin.list()).list as any
-    apps.value = plugins.reduce((o: Record<string, any>[], p: Record<string, any>) => {
-      p.tags = p.tags ? p.tags.split(',') : []
-      p.parsedInput = p.input && JSON.parse(p.input)
-      o[p.title] = p
+    const plugins = (await api.plugin.list()).list!
+
+    apps.value = plugins.reduce((o, p) => {
+      const plugin: { title: string; tags: string[]; parsedInput: Record<string, any> } = {
+        title: '',
+        tags: [],
+        parsedInput: {},
+        ...(p as any),
+      }
+      plugin.tags = p.tags ? p.tags.split(',') : []
+      plugin.parsedInput = p.input && JSON.parse(p.input)
+      o[plugin.title] = plugin
+
       return o
-    }, {})
+    }, {} as Record<string, any>)
 
     if (hook.event && hook.operation) {
       hook.eventOperation = `${hook.event} ${hook.operation}`

packages/nc-gui/composables/useColumnCreateStore.ts

@@ -84,7 +84,7 @@ const [useProvideColumnCreateStore, useColumnCreateStore] = createInjectionState
     const onUidtOrIdTypeChange = () => {
       const { isCurrency } = useColumn(ref(formState.value as ColumnType))
 
-      const colProp = sqlUi?.value.getDataTypeForUiType(formState?.value as any, idType as any)
+      const colProp = sqlUi.value.getDataTypeForUiType(formState.value as { uidt: UITypes }, idType ?? undefined)
       formState.value = {
         ...formState.value,
         meta: {},

packages/nc-gui/composables/useExpandedFormStore.ts

@@ -94,9 +94,8 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
       await api.utils.commentRow({
         fk_model_id: meta.value?.id as string,
         row_id: rowId,
-        // todo: description missing from argument type
         description: comment.value,
-      } as any)
+      })
 
       comment.value = ''
 

packages/nc-gui/composables/useGridViewColumnWidth.ts

@@ -5,7 +5,7 @@ import { useMetas } from './useMetas'
 import { useUIPermission } from './useUIPermission'
 import { IsPublicInj } from '~/context'
 
-export function useGridViewColumnWidth(view: Ref<(GridType & { id?: string }) | undefined>) {
+export function useGridViewColumnWidth(view: Ref<GridType | undefined>) {
   const { css, load: loadCss, unload: unloadCss } = useStyleTag('')
   const { isUIAllowed } = useUIPermission()
   const { $api } = useNuxtApp()
@@ -16,7 +16,7 @@ export function useGridViewColumnWidth(view: Ref<(GridType & { id?: string }) |
   const resizingColWidth = ref('200px')
   const isPublic = inject(IsPublicInj, ref(false))
 
-  const columns = computed<ColumnType[]>(() => metas?.value?.[(view?.value as any)?.fk_model_id as string]?.columns)
+  const columns = computed<ColumnType[]>(() => metas?.value?.[(view.value as any)?.fk_model_id as string]?.columns)
 
   watch(
     [gridViewCols, resizingCol, resizingColWidth],
@@ -37,8 +37,9 @@ export function useGridViewColumnWidth(view: Ref<(GridType & { id?: string }) |
   )
 
   const loadGridViewColumns = async () => {
-    if (!view.value?.id && !isPublic.value) return
-    const colsData: GridColumnType[] = isPublic.value ? columns.value : await $api.dbView.gridColumnsList(view.value.id)
+    if ((!view.value || view.value?.id) && !isPublic.value) return
+
+    const colsData: GridColumnType[] = isPublic.value ? columns.value : await $api.dbView.gridColumnsList(view.value!.id!)
     gridViewCols.value = colsData.reduce<Record<string, GridColumnType>>(
       (o, col) => ({
         ...o,

packages/nc-gui/composables/useLTARStore.ts

@@ -1,4 +1,4 @@
-import type { ColumnType, LinkToAnotherRecordType, PaginatedType, TableType } from 'nocodb-sdk'
+import type { ColumnType, LinkToAnotherRecordType, PaginatedType, RequestParams, TableType } from 'nocodb-sdk'
 import type { ComputedRef, Ref } from 'vue'
 import { Modal, message } from 'ant-design-vue'
 import { useI18n } from 'vue-i18n'
@@ -46,10 +46,10 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
 
     const isPublic: boolean = $(inject(IsPublicInj, ref(false)))
 
-    const colOptions = $computed(() => column?.value.colOptions as LinkToAnotherRecordType)
+    const colOptions = $computed(() => column.value?.colOptions as LinkToAnotherRecordType)
 
     const { sharedView } = useSharedView() as Record<string, any>
-    const projectId = project?.value?.id || sharedView.value?.view?.project_id
+    const projectId = project.value?.id || sharedView.value?.view?.project_id
 
     // getters
     const meta = computed(() => metas?.value?.[column?.value?.fk_model_id as string])
@@ -73,18 +73,18 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
     }
 
     const loadRelatedTableMeta = async () => {
-      await getMeta(colOptions?.fk_related_model_id as string)
+      await getMeta(colOptions.fk_related_model_id as string)
     }
 
     const relatedTablePrimaryValueProp = computed(() => {
-      return (relatedTableMeta?.value?.columns?.find((c) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title
+      return (relatedTableMeta.value?.columns?.find((c) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title
     })
 
     const relatedTablePrimaryKeyProps = computed(() => {
-      return relatedTableMeta?.value?.columns?.filter((c) => c.pk)?.map((c) => c.title) ?? []
+      return relatedTableMeta.value?.columns?.filter((c) => c.pk)?.map((c) => c.title) ?? []
     })
     const primaryValueProp = computed(() => {
-      return (meta?.value?.columns?.find((c: Required<ColumnType>) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title
+      return (meta.value?.columns?.find((c: Required<ColumnType>) => c.pv) || relatedTableMeta?.value?.columns?.[0])?.title
     })
 
     const loadChildrenExcludedList = async () => {
@@ -93,7 +93,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
           const route = useRoute()
           childrenExcludedList.value = await $api.public.dataRelationList(
             route.params.viewId as string,
-            column?.value?.id,
+            column.value.id,
             {},
             {
               headers: {
@@ -106,7 +106,7 @@ const [useProvideLTARStore, useLTARStore] = useInjectionState(
                   childrenExcludedListPagination.query &&
                   `(${relatedTablePrimaryValueProp.value},like,${childrenExcludedListPagination.query})`,
                 fields: [relatedTablePrimaryValueProp.value, ...relatedTablePrimaryKeyProps.value],
-              } as any,
+              } as RequestParams,
             },
           )
 

packages/nc-gui/composables/useLoadingIndicator/index.ts

@@ -0,0 +1,72 @@
+import { computed, ref } from '#imports'
+
+interface UseLoadingIndicatorProps {
+  duration?: number
+  throttle?: number
+}
+
+export function useLoadingIndicator({ duration = 2000, throttle = 200 }: UseLoadingIndicatorProps) {
+  const progress = ref(0)
+  const isLoading = ref(false)
+  const step = computed(() => 10000 / duration)
+
+  let _timer: any = null
+  let _throttle: any = null
+
+  function start() {
+    clear()
+    progress.value = 0
+    isLoading.value = true
+    if (throttle) {
+      if (process.client) {
+        _throttle = setTimeout(_startTimer, throttle)
+      }
+    } else {
+      _startTimer()
+    }
+  }
+
+  function finish() {
+    progress.value = 100
+    _hide()
+  }
+
+  function clear() {
+    clearInterval(_timer)
+    clearTimeout(_throttle)
+    _timer = null
+    _throttle = null
+  }
+
+  function _increase(num: number) {
+    progress.value = Math.min(100, progress.value + num)
+  }
+
+  function _hide() {
+    clear()
+    if (process.client) {
+      setTimeout(() => {
+        isLoading.value = false
+        setTimeout(() => {
+          progress.value = 0
+        }, 400)
+      }, 500)
+    }
+  }
+
+  function _startTimer() {
+    if (process.client) {
+      _timer = setInterval(() => {
+        _increase(step.value)
+      }, 100)
+    }
+  }
+
+  return {
+    progress,
+    isLoading,
+    start,
+    finish,
+    clear,
+  }
+}

packages/nc-gui/composables/useSharedFormViewStore.ts

@@ -51,8 +51,10 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
     columns.value?.filter((c) => c.show).filter((col) => !isVirtualCol(col) || col.uidt === UITypes.LinkToAnotherRecord),
   )
   const loadSharedView = async () => {
+    if (!sharedView.value) return
+
     try {
-      const viewMeta: Record<string, any> = await api.public.sharedViewMetaGet(sharedViewId, {
+      const viewMeta = await api.public.sharedViewMetaGet(sharedViewId, {
         headers: {
           'xc-password': password.value,
         },
@@ -90,7 +92,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
     for (const column of formColumns.value) {
       if (
         !isVirtualCol(column) &&
-        ((column.rqd && !column.cdf) || (column.pk && !(column.ai || column.cdf)) || (column as any).required)
+        ((column.rqd && !column.cdf) || (column.pk && !(column.ai || column.cdf)) || column.required)
       ) {
         obj.localState[column.title!] = { required }
       } else if (
@@ -141,7 +143,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
       }
 
       await api.public.dataCreate(
-        (sharedView.value as any)?.uuid as string,
+        sharedView.value!.uuid!,
         {
           data,
           ...attachment,
@@ -156,7 +158,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
       submitted.value = true
       progress.value = false
 
-      await message.success(sharedFormView.value?.sucess_msg || 'Saved successfully.')
+      await message.success(sharedFormView.value?.success_msg || 'Saved successfully.')
     } catch (e: any) {
       console.log(e)
       await message.error(await extractSdkResponseErrorMsg(e))
@@ -166,7 +168,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
 
   /** reset form if show_blank_form is true */
   watch(submitted, (nextVal) => {
-    if (nextVal && (sharedFormView.value as any)?.show_blank_form) {
+    if (nextVal && sharedFormView.value?.show_blank_form) {
       secondsRemain.value = 5
       const intvl = setInterval(() => {
         secondsRemain.value = secondsRemain.value - 1

packages/nc-gui/composables/useSharedView.ts

@@ -40,7 +40,7 @@ export function useSharedView() {
     allowCSVDownload.value = JSON.parse(viewMeta.meta)?.allowCSVDownload
 
     if (localPassword) password.value = localPassword
-    sharedView.value = { ...viewMeta }
+    sharedView.value = { title: '', ...viewMeta }
     meta.value = { ...viewMeta.model }
 
     let order = 1
@@ -56,11 +56,13 @@ export function useSharedView() {
   }
 
   const fetchSharedViewData = async () => {
+    if (!sharedView.value) return
+
     const page = paginationData.value.page || 1
     const pageSize = paginationData.value.pageSize || 25
 
     const { data } = await $api.public.dataList(
-      (sharedView.value as any)?.uuid,
+      sharedView.value.uuid!,
       {
         offset: (page - 1) * pageSize,
         filterArrJson: JSON.stringify(nestedFilters.value),
@@ -82,8 +84,8 @@ export function useSharedView() {
     type: ExportTypes.EXCEL | ExportTypes.CSV,
     responseType: 'base64' | 'blob',
   ) => {
-    return await $api.public.csvExport((sharedView.value as any)?.uuid, type, {
-      format: responseType as any,
+    return await $api.public.csvExport(sharedView.value!.uuid!, type, {
+      format: responseType,
       query: {
         fields: fields.map((field) => field.title),
         offset,

packages/nc-gui/composables/useSmartsheetStore.ts

@@ -5,8 +5,8 @@ import { computed, reactive, useInjectionState, useNuxtApp, useProject, useTempl
 
 const [useProvideSmartsheetStore, useSmartsheetStore] = useInjectionState(
   (
-    view: Ref<ViewType>,
-    meta: Ref<TableType>,
+    view: Ref<ViewType | undefined>,
+    meta: Ref<TableType | undefined>,
     shared = false,
     initalSorts?: Ref<SortType[]>,
     initialFilters?: Ref<FilterType[]>,
@@ -24,15 +24,15 @@ const [useProvideSmartsheetStore, useSmartsheetStore] = useInjectionState(
     })
 
     // getters
-    const isLocked = computed(() => (view?.value as any)?.lock_type === 'locked')
-    const isPkAvail = computed(() => meta?.value?.columns?.some((c) => c.pk))
-    const isGrid = computed(() => (view?.value as any)?.type === ViewTypes.GRID)
-    const isForm = computed(() => (view?.value as any)?.type === ViewTypes.FORM)
-    const isSharedForm = computed(() => isForm?.value && shared)
-    const isGallery = computed(() => (view?.value as any)?.type === ViewTypes.GALLERY)
+    const isLocked = computed(() => view.value?.lock_type === 'locked')
+    const isPkAvail = computed(() => meta.value?.columns?.some((c) => c.pk))
+    const isGrid = computed(() => view.value?.type === ViewTypes.GRID)
+    const isForm = computed(() => view.value?.type === ViewTypes.FORM)
+    const isSharedForm = computed(() => isForm.value && shared)
+    const isGallery = computed(() => view.value?.type === ViewTypes.GALLERY)
     const xWhere = computed(() => {
       let where
-      const col = meta?.value?.columns?.find(({ id }) => id === search.field) || meta?.value?.columns?.find((v) => v.pv)
+      const col = meta.value?.columns?.find(({ id }) => id === search.field) || meta.value?.columns?.find((v) => v.pv)
       if (!col) return
 
       if (!search.query.trim()) return
@@ -44,7 +44,7 @@ const [useProvideSmartsheetStore, useSmartsheetStore] = useInjectionState(
       return where
     })
 
-    const isSqlView = computed(() => meta?.value?.type === 'view')
+    const isSqlView = computed(() => meta.value?.type === 'view')
 
     const sorts = initalSorts ?? ref<SortType[]>([])
     const nestedFilters: Ref<FilterType[]> = initialFilters ?? ref<FilterType[]>([])

packages/nc-gui/composables/useViewColumns.ts

@@ -26,12 +26,12 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
   const metaColumnById = computed<Record<string, ColumnType>>(() => {
     if (!meta.value?.columns) return {}
 
-    return meta.value?.columns?.reduce(
-      (acc: ColumnType, curr: ColumnType) => ({
+    return meta.value.columns.reduce(
+      (acc, curr) => ({
         ...acc,
         [curr.id!]: curr,
       }),
-      {} as any,
+      {},
     )
   })
 
@@ -136,7 +136,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
     if (isUIAllowed('fieldsSync')) {
       if (field.id && view?.value?.id) {
         await $api.dbViewColumn.update(view.value.id, field.id, field)
-      } else if (view?.value?.id) {
+      } else if (view?.value.id) {
         const insertedField = (await $api.dbViewColumn.create(view.value.id, field)) as any
 
         /** update the field in fields if defined */
@@ -152,7 +152,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
   const showSystemFields = computed({
     get() {
       // todo: show_system_fields missing from ViewType
-      return (view?.value as any)?.show_system_fields || false
+      return view?.value.show_system_fields || false
     },
     set(v: boolean) {
       if (view?.value?.id) {
@@ -163,7 +163,7 @@ export function useViewColumns(view: Ref<ViewType> | undefined, meta: ComputedRe
             })
             .finally(() => reloadData?.())
         }
-        ;(view.value as any).show_system_fields = v
+        view.value.show_system_fields = v
       }
       $e('a:fields:system-fields')
     },

packages/nc-gui/composables/useViewData.ts

@@ -33,8 +33,8 @@ export interface Row {
 }
 
 export function useViewData(
-  meta: Ref<TableType> | ComputedRef<TableType> | undefined,
-  viewMeta: Ref<ViewType & { id: string }> | ComputedRef<ViewType & { id: string }> | undefined,
+  meta: Ref<TableType | undefined> | ComputedRef<TableType | undefined>,
+  viewMeta: Ref<ViewType | undefined> | ComputedRef<(ViewType & { id: string }) | undefined>,
   where?: ComputedRef<string | undefined>,
 ) {
   if (!meta) {
@@ -47,8 +47,7 @@ export function useViewData(
   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 }>()
+  const formViewData = ref<FormType>()
   const formattedData = ref<Row[]>([])
 
   const isPublic = inject(IsPublicInj, ref(false))
@@ -153,19 +152,19 @@ export function useViewData(
 
     aggCommentCount.value = await $api.utils.commentCount({
       ids,
-      fk_model_id: meta?.value.id as string,
+      fk_model_id: meta.value?.id as string,
     })
 
     for (const row of formattedData.value) {
-      const id = extractPkFromRow(row.row, meta?.value?.columns as ColumnType[])
+      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
     }
   }
 
   async function loadData(params: Parameters<Api<any>['dbViewRow']['list']>[4] = {}) {
-    if ((!project?.value?.id || !meta?.value?.id || !viewMeta?.value?.id) && !isPublic.value) return
+    if ((!project?.value?.id || !meta.value?.id || !viewMeta.value?.id) && !isPublic.value) return
     const response = !isPublic.value
-      ? await api.dbViewRow.list('noco', project.value.id!, meta!.value.id!, viewMeta!.value.id, {
+      ? await api.dbViewRow.list('noco', project.value.id!, meta.value!.id!, viewMeta.value!.id!, {
           ...queryParams.value,
           ...params,
           ...(isUIAllowed('sortSync') ? {} : { sortArrJson: JSON.stringify(sorts.value) }),
@@ -196,7 +195,7 @@ export function useViewData(
       const insertedData = await $api.dbViewRow.create(
         NOCO,
         project?.value.id as string,
-        meta?.value.id as string,
+        meta.value?.id as string,
         viewMeta?.value?.id as string,
         insertObj,
       )
@@ -216,12 +215,12 @@ export function useViewData(
 
   async function updateRowProperty(toUpdate: Row, property: string) {
     try {
-      const id = extractPkFromRow(toUpdate.row, meta?.value.columns as ColumnType[])
+      const id = extractPkFromRow(toUpdate.row, meta.value?.columns as ColumnType[])
 
       const updatedRowData = await $api.dbViewRow.update(
         NOCO,
         project?.value.id as string,
-        meta?.value.id as string,
+        meta.value?.id as string,
         viewMeta?.value?.id as string,
         id,
         {
@@ -235,7 +234,7 @@ export function useViewData(
       // audit
       $api.utils
         .auditRowUpdate(id, {
-          fk_model_id: meta?.value.id as string,
+          fk_model_id: meta.value?.id as string,
           column_name: property,
           row_id: id,
           value: getHTMLEncodedText(toUpdate.row[property]),
@@ -273,8 +272,8 @@ export function useViewData(
     const res: any = await $api.dbViewRow.delete(
       'noco',
       project.value.id as string,
-      meta?.value.id as string,
-      viewMeta?.value.id as string,
+      meta.value?.id as string,
+      viewMeta.value?.id as string,
       id,
     )
 
@@ -295,7 +294,7 @@ export function useViewData(
       if (!row.rowMeta.new) {
         const id = meta?.value?.columns
           ?.filter((c) => c.pk)
-          .map((c) => row.row[c.title as any])
+          .map((c) => row.row[c.title!])
           .join('___')
 
         const deleted = await deleteRowById(id as string)
@@ -362,7 +361,7 @@ export function useViewData(
         ?.map((c: Record<string, any>) => ({
           ...c,
           fk_column_id: c.id,
-          fk_view_id: viewMeta.value.id,
+          fk_view_id: viewMeta.value?.id,
           ...(fieldById[c.id] ? fieldById[c.id] : {}),
           order: (fieldById[c.id] && fieldById[c.id].order) || order++,
           id: fieldById[c.id] && fieldById[c.id].id,

packages/nc-gui/composables/useViewFilters.ts

@@ -1,4 +1,4 @@
-import type { ViewType } from 'nocodb-sdk'
+import type { FilterType, ViewType } from 'nocodb-sdk'
 import type { ComputedRef, Ref } from 'vue'
 import { message } from 'ant-design-vue'
 import {
@@ -69,13 +69,13 @@ export function useViewFilters(
         if (parentId) {
           filters.value = await $api.dbTableFilter.childrenRead(parentId)
         } else {
-          filters.value = (await $api.dbTableWebhookFilter.read(hookId as string)) as any
+          filters.value = (await $api.dbTableWebhookFilter.read(hookId!)).filters.list
         }
       } else {
         if (parentId) {
           filters.value = await $api.dbTableFilter.childrenRead(parentId)
         } else {
-          filters.value = await $api.dbTableFilter.read(view?.value?.id as string)
+          filters.value = await $api.dbTableFilter.read(view!.value.id!)
         }
       }
     } catch (e: any) {
@@ -99,12 +99,12 @@ export function useViewFilters(
             filters.value[+i] = (await $api.dbTableWebhookFilter.create(hookId, {
               ...filter,
               fk_parent_id: parentId,
-            })) as any
+            })) as unknown as FilterType
           } else {
-            filters.value[+i] = (await $api.dbTableFilter.create(view?.value?.id as string, {
+            filters.value[+i] = await $api.dbTableFilter.create(view?.value?.id as string, {
               ...filter,
               fk_parent_id: parentId,
-            })) as any
+            })
           }
         }
       }
@@ -168,10 +168,10 @@ export function useViewFilters(
         })
       } else {
         // todo: return type of dbTableFilter is void?
-        filters.value[i] = (await $api.dbTableFilter.create(view?.value?.id as string, {
+        filters.value[i] = await $api.dbTableFilter.create(view.value.id!, {
           ...filter,
           fk_parent_id: parentId,
-        })) as any
+        })
       }
     } catch (e: any) {
       console.log(e)

packages/nc-gui/composables/useViewSorts.ts

@@ -21,14 +21,15 @@ export function useViewSorts(
 
   const loadSorts = async () => {
     if (isPublic.value) {
-      const sharedSorts = sharedView.value?.sorts || []
+      // todo: sorts missing on `ViewType`
+      const sharedSorts = (sharedView.value as any)?.sorts || []
       sorts.value = [...sharedSorts]
       return
     }
 
     try {
       if (!view?.value) return
-      sorts.value = ((await $api.dbTableSort.list(view?.value?.id as string)) as any)?.sorts?.list
+      sorts.value = (await $api.dbTableSort.list(view.value!.id!)).sorts?.list || []
     } catch (e: any) {
       console.error(e)
       message.error(await extractSdkResponseErrorMsg(e))
@@ -48,7 +49,7 @@ export function useViewSorts(
           await $api.dbTableSort.update(sort.id, sort)
           $e('sort-updated')
         } else {
-          sorts.value[i] = (await $api.dbTableSort.create(view?.value?.id as string, sort)) as any
+          sorts.value[i] = (await $api.dbTableSort.create(view?.value.id as string, sort)) as unknown as SortType
         }
       }
       reloadData?.()

packages/nc-gui/layouts/base.vue

@@ -102,7 +102,7 @@ hooks.hook('page:finish', () => {
       <a-tooltip placement="bottom">
         <template #title> Switch language</template>
 
-        <GeneralLanguage class="nc-lang-btn" />
+        <GeneralLanguage v-if="!signedIn" class="nc-lang-btn" />
       </a-tooltip>
 
       <div class="w-full h-full overflow-hidden">

packages/nc-gui/utils/viewUtils.ts

@@ -18,7 +18,7 @@ export const viewIcons = {
 }
 
 export const viewTypeAlias = {
-  [ViewTypes.GRID as any]: 'grid',
-  [ViewTypes.FORM as any]: 'form',
-  [ViewTypes.GALLERY as any]: 'gallery',
+  [ViewTypes.GRID]: 'grid',
+  [ViewTypes.FORM]: 'form',
+  [ViewTypes.GALLERY]: 'gallery',
 }