chore(gui-v2): update import paths for composables

packages/nc-gui-v2/components/cell/Attachment.vue

@@ -37,7 +37,7 @@ watchEffect(() => {
   }
 })
 
-const selectImage = (file: any, i) => {
+const selectImage = (file: any, i: unknown) => {
   // todo: implement
 }
 
@@ -49,7 +49,7 @@ const addFile = () => {
   fileInput.value?.click()
 }
 
-const onFileSelection = async (e) => {
+const onFileSelection = async (e: unknown) => {
   // if (this.isPublicGrid) {
   //   return
   // }

packages/nc-gui-v2/components/cell/Email.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { computed } from '#imports'
-import { isEmail } from '~/utils/validation'
+import { isEmail } from '~/utils'
 
 const { modelValue: value } = defineProps<Props>()
 

packages/nc-gui-v2/components/dlg/AirtableImport.vue

@@ -142,7 +142,7 @@ async function sync() {
       method: 'POST',
       headers: { 'xc-auth': $state.token.value as string },
       params: {
-        id: socket.id,
+        id: socket?.id,
       },
     })
   } catch (e: any) {

packages/nc-gui-v2/components/monaco/Editor.vue

@@ -3,7 +3,7 @@ import * as monaco from 'monaco-editor'
 import JsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker'
 import EditorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'
 import { onMounted } from '#imports'
-import { deepCompare } from '~/utils/deepCompare'
+import { deepCompare } from '~/utils'
 
 const { modelValue } = defineProps<{ modelValue: any }>()
 
@@ -83,5 +83,3 @@ watch(
 <template>
   <div ref="root"></div>
 </template>
-
-<style scoped></style>

packages/nc-gui-v2/components/smartsheet-header/CellIcon.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ColumnType } from 'nocodb-sdk'
 import { ColumnInj } from '~/context'
-import useColumn from '~/composables/useColumn'
+import { useColumn } from '#imports'
 import KeyIcon from '~icons/mdi/key-variant'
 import JSONIcon from '~icons/mdi/code-json'
 // import FKIcon from '~icons/mdi/link-variant'

packages/nc-gui-v2/components/smartsheet-toolbar/ColumnFilter.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
+import type { FilterType } from 'nocodb-sdk'
 import { UITypes } from 'nocodb-sdk'
 import FieldListAutoCompleteDropdown from './FieldListAutoCompleteDropdown.vue'
 import { useNuxtApp } from '#app'
-import { inject } from '#imports'
+import { inject, useViewFilters } from '#imports'
 import { comparisonOpList } from '~/utils/filterUtils'
 import { ActiveViewInj, MetaInj, ReloadViewDataHookInj } from '~/context'
-import useViewFilters from '~/composables/useViewFilters'
 import MdiDeleteIcon from '~icons/mdi/close-box'
 import MdiAddIcon from '~icons/mdi/plus'
 const { nested = false, parentId } = defineProps<{ nested?: boolean; parentId?: string }>()
@@ -20,8 +20,9 @@ const { filters, deleteFilter, saveOrUpdate, loadFilters, addFilter } = useViewF
   reloadDataHook?.trigger()
 })
 
-const filterUpdateCondition = (filter, i) => {
+const filterUpdateCondition = (filter: FilterType, i: number) => {
   saveOrUpdate(filter, i)
+
   $e('a:filter:update', {
     logical: filter.logical_op,
     comparison: filter.comparison_op,
@@ -63,7 +64,7 @@ const types = computed(() => {
 })
 
 watch(
-  () => activeView?.value?.id,
+  () => (activeView?.value as any)?.id,
   (n, o) => {
     if (n !== o) loadFilters()
   },

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

@@ -4,7 +4,7 @@ import type { ComputedRef } from 'vue'
 import { computed, inject } from 'vue'
 import Draggable from 'vuedraggable'
 import { ActiveViewInj, FieldsInj, IsLockedInj, MetaInj, ReloadViewDataHookInj } from '~/context'
-import useViewColumns from '~/composables/useViewColumns'
+import { useViewColumns } from '#imports'
 import MdiMenuDownIcon from '~icons/mdi/menu-down'
 import MdiEyeIcon from '~icons/mdi/eye-off-outline'
 import MdiDragIcon from '~icons/mdi/drag'
@@ -43,7 +43,7 @@ const {
 } = useViewColumns(activeView, meta as ComputedRef<TableType>, false, () => reloadDataHook?.trigger())
 
 watch(
-  () => activeView?.value?.id,
+  () => (activeView?.value as any)?.id,
   async (newVal, oldVal) => {
     if (newVal !== oldVal && meta?.value) {
       await loadViewColumns()
@@ -59,7 +59,7 @@ watch(
   { immediate: true },
 )
 
-const onMove = (event) => {
+const onMove = (event: unknown) => {
   // todo : sync with server
   // if (!sortedFields?.value) return
   // if (sortedFields?.value.length - 1 === event.moved.newIndex) {

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

@@ -1,9 +1,8 @@
 <script setup lang="ts">
 import type { ColumnType } from 'nocodb-sdk'
 import { provide } from 'vue'
-import { computed } from '#imports'
+import { computed, useColumn } from '#imports'
 import { ColumnInj } from '~/context'
-import useColumn from '~/composables/useColumn'
 
 interface Props {
   column: ColumnType

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

@@ -1,8 +1,7 @@
 <script lang="ts" setup>
 import { isVirtualCol } from 'nocodb-sdk'
-import { inject, onKeyStroke, onMounted, provide } from '#imports'
+import { inject, provide, useViewData } from '#imports'
 import { ActiveViewInj, ChangePageInj, IsFormInj, IsGridInj, MetaInj, PaginationDataInj, ReadonlyInj } from '~/context'
-import useViewData from '~/composables/useViewData'
 
 const meta = inject(MetaInj)
 const view = inject(ActiveViewInj)
@@ -13,7 +12,7 @@ const isPublicView = false
 const selected = reactive<{ row?: number | null; col?: number | null }>({})
 const editEnabled = ref(false)
 
-const { loadData, paginationData, formattedData: data, updateRowProperty, changePage } = useViewData(meta, view)
+const { loadData, paginationData, formattedData: data, updateRowProperty, changePage } = useViewData(meta, view as any)
 
 provide(IsFormInj, false)
 provide(IsGridInj, false)

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

@@ -1,8 +1,6 @@
 <script lang="ts" setup>
 import { isVirtualCol } from 'nocodb-sdk'
-import { inject, onKeyStroke, onMounted, provide } from '#imports'
-import { useProvideColumnCreateStore } from '~/composables/useColumnCreateStore'
-import useGridViewColumnWidth from '~/composables/useGridViewColumnWidth'
+import { inject, onKeyStroke, onMounted, provide, useGridViewColumnWidth, useViewData, useProvideColumnCreateStore } from '#imports'
 import {
   ActiveViewInj,
   ChangePageInj,
@@ -13,7 +11,6 @@ import {
   PaginationDataInj,
   ReloadViewDataHookInj,
 } from '~/context'
-import useViewData from '~/composables/useViewData'
 import MdiPlusIcon from '~icons/mdi/plus'
 
 const meta = inject(MetaInj)
@@ -29,7 +26,7 @@ const selected = reactive<{ row?: number | null; col?: number | null }>({})
 const editEnabled = ref(false)
 const addColumnDropdown = ref(false)
 
-const { loadData, paginationData, formattedData: data, updateRowProperty, changePage } = useViewData(meta, view)
+const { loadData, paginationData, formattedData: data, updateRowProperty, changePage } = useViewData(meta, view as any)
 const { loadGridViewColumns, updateWidth, resizingColWidth, resizingCol } = useGridViewColumnWidth(view)
 onMounted(loadGridViewColumns)
 
@@ -55,7 +52,7 @@ onKeyStroke(['Enter'], (e) => {
 })
 
 watch(
-  () => view?.value?.id,
+  () => (view?.value as any)?.id,
   async (n?: string, o?: string) => {
     if (n && n !== o) {
       await loadData()

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

@@ -1,8 +1,7 @@
 <script setup lang="ts">
 import type { ColumnType } from 'nocodb-sdk'
-import { provide } from '#imports'
+import { provide, useVirtualCell } from '#imports'
 import { ColumnInj } from '~/context'
-import useVirtualCell from '~/composables/useVirtualCell'
 
 interface Props {
   column: ColumnType

packages/nc-gui-v2/components/virtual-cell/BelongsTo.vue

@@ -2,7 +2,7 @@
 import type { ColumnType } from 'nocodb-sdk'
 import ItemChip from './components/ItemChip.vue'
 import { ColumnInj } from '~/context'
-import useBelongsTo from '~/composables/useBelongsTo'
+import { useBelongsTo } from '#imports'
 
 const column = inject(ColumnInj)
 const value = inject('value')

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

@@ -1,5 +1,5 @@
 import type { ColumnType, TableType } from 'nocodb-sdk'
-import useMetas from './useMetas'
+import { useMetas } from './useMetas'
 
 export function useBelongsTo(column: ColumnType) {
   const { metas, getMeta } = useMetas()

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

@@ -1,5 +1,5 @@
 import type { ColumnType, TableType } from 'nocodb-sdk'
-import useMetas from './useMetas'
+import { useMetas } from './useMetas'
 
 export function useManyToMany(column: ColumnType) {
   const { metas, getMeta } = useMetas()

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

@@ -20,7 +20,7 @@ function getPredicate(key: Partial<TabItem>) {
     (!('type' in key) || tab.type === key.id)
 }
 
-export default () => {
+export function useTabs() {
   const tabs = useState<TabItem[]>('tabs', () => [])
 
   const route = useRoute()

packages/nc-gui-v2/nuxt-shim.d.ts

@@ -1,7 +1,6 @@
 import type { Api as BaseAPI } from 'nocodb-sdk'
-import type { I18n } from 'vue-i18n'
+import type { createI18nPlugin } from 'src/plugins/i18n'
 import type { GlobalState } from './src/lib/types'
-
 import type en from './lang/en.json'
 
 type MessageSchema = typeof en
@@ -21,6 +20,6 @@ declare module '#app/nuxt' {
 
 declare module '@vue/runtime-core' {
   interface App {
-    i18n: I18n<MessageSchema, unknown, unknown, false>['global']
+    i18n: ReturnType<typeof createI18nPlugin> extends Promise<infer Return> ? Return : never
   }
 }

packages/nc-gui-v2/pages/project/index/[id].vue

@@ -41,7 +41,7 @@ const renameProject = async () => {
     await $api.project.update(route.params.id as string, formState)
 
     navigateTo(`/nc/${route.params.id}`)
-  } catch (e) {
+  } catch (e: any) {
     toast.error(await extractSdkResponseErrorMsg(e))
   }
   loading.value = false

packages/nc-gui-v2/plugins/i18n.ts

@@ -1,11 +1,6 @@
 import { defineNuxtPlugin } from 'nuxt/app'
 import { createI18n } from 'vue-i18n'
 
-// import type en from '~/lang/en.json'
-
-// todo: Type-define 'en' as the master schema for the resource
-// type MessageSchema = typeof en
-
 export const createI18nPlugin = async () =>
   createI18n({
     locale: 'en', // Set the initial locale

packages/nc-gui-v2/tsconfig.json

@@ -14,7 +14,8 @@
       "@intlify/vite-plugin-vue-i18n/client",
       "vue-i18n",
       "unplugin-icons/types/vue",
-      "nuxt-windicss"
+      "nuxt-windicss",
+      "vite/client"
     ]
   },
   "exclude": [

packages/nc-gui-v2/utils/index.ts

@@ -1,5 +1,6 @@
 export * from './colorsUtils'
 export * from './dateTimeUtils'
+export * from './deepCompare'
 export * from './durationHelper'
 export * from './errorUtils'
 export * from './fileUtils'

packages/nc-gui-v2/windi.config.ts

@@ -11,7 +11,7 @@ import animations from '@windicss/plugin-animations'
 // @ts-expect-error no types for plugin-question-mark
 import questionMark from '@windicss/plugin-question-mark'
 
-import colors, { themeColors } from './utils/colorsUtils'
+import { theme as colors, themeColors } from './utils/colorsUtils'
 
 export default defineConfig({
   extract: {