chore(gui-v2): fix types in Currency, Rating & SingleSelect cells

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

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { VNodeRef } from '@vue/runtime-core'
 import { computed, inject, ref, useVModel } from '#imports'
 import { ColumnInj, EditModeInj } from '~/context'
 
@@ -10,22 +11,23 @@ const props = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-const column = inject(ColumnInj)
+const column = inject(ColumnInj)!
 
 const editEnabled = inject(EditModeInj, ref(false))
 
-const root = ref<HTMLInputElement>()
-
 const vModel = useVModel(props, 'modelValue', emit)
 
 const currencyMeta = computed(() => {
   return {
     currency_locale: 'en-US',
     currency_code: 'USD',
-    ...(column?.value?.meta ? column?.value?.meta : {}),
+    ...(column.value.meta ? column.value.meta : {}),
   }
 })
+
 const currency = computed(() => {
+  if (!vModel.value) return null
+
   try {
     return isNaN(vModel.value)
       ? vModel.value
@@ -38,7 +40,7 @@ const currency = computed(() => {
   }
 })
 
-const focus = (el: HTMLInputElement) => el?.focus()
+const focus: VNodeRef = (el) => (el as HTMLInputElement)?.focus()
 </script>
 
 <template>

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

@@ -1,18 +1,15 @@
 <script setup lang="ts">
-import { computed, inject } from '#imports'
+import { computed, inject, useVModel } from '#imports'
 import { ColumnInj } from '~/context'
-import MdiStarIcon from '~icons/mdi/star'
-import MdiHeartIcon from '~icons/mdi/heart'
-import MdiMoonFullIcon from '~icons/mdi/moon-full'
-import MdiThumbUpIcon from '~icons/mdi/thumb-up'
-import MdiFlagIcon from '~icons/mdi/flag'
 
 interface Props {
   modelValue?: number | null
   readOnly?: boolean
 }
 
-const props = defineProps<Props>()
+const props = withDefaults(defineProps<Props>(), {
+  modelValue: NaN,
+})
 
 const emits = defineEmits(['update:modelValue'])
 
@@ -36,11 +33,11 @@ const vModel = useVModel(props, 'modelValue', emits)
 <template>
   <a-rate v-model:value="vModel" :count="ratingMeta.max" :style="`color: ${ratingMeta.color}`" :disabled="props.readOnly">
     <template #character>
-      <MdiStarIcon v-if="ratingMeta.icon.full === 'mdi-star'" class="text-sm" />
-      <MdiHeartIcon v-if="ratingMeta.icon.full === 'mdi-heart'" class="text-sm" />
-      <MdiMoonFullIcon v-if="ratingMeta.icon.full === 'mdi-moon-full'" class="text-sm" />
-      <MdiThumbUpIcon v-if="ratingMeta.icon.full === 'mdi-thumb-up'" class="text-sm" />
-      <MdiFlagIcon v-if="ratingMeta.icon.full === 'mdi-flag'" class="text-sm" />
+      <MdiStar v-if="ratingMeta.icon.full === 'mdi-star'" class="text-sm" />
+      <MdiHeart v-if="ratingMeta.icon.full === 'mdi-heart'" class="text-sm" />
+      <MdiMoonFull v-if="ratingMeta.icon.full === 'mdi-moon-full'" class="text-sm" />
+      <MdiThumbUp v-if="ratingMeta.icon.full === 'mdi-thumb-up'" class="text-sm" />
+      <MdiFlag v-if="ratingMeta.icon.full === 'mdi-flag'" class="text-sm" />
     </template>
   </a-rate>
 </template>

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

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { computed, inject } from '#imports'
-import { ColumnInj, EditModeInj } from '~/context'
+import { ColumnInj } from '~/context'
 
 interface Props {
   modelValue: string | null
@@ -10,16 +10,14 @@ const { modelValue } = defineProps<Props>()
 
 const emit = defineEmits(['update:modelValue'])
 
-const column = inject(ColumnInj)
-const isForm = inject<boolean>('isForm', false)
-const editEnabled = inject(EditModeInj, ref(false))
+const column = inject(ColumnInj)!
 
 const vModel = computed({
   get: () => modelValue?.replace(/\\'/g, "'").replace(/^'|'$/g, ''),
   set: (val) => emit('update:modelValue', val),
 })
 
-const options = computed(() => column?.value?.dtxp?.split(',').map((v) => v.replace(/\\'/g, "'").replace(/^'|'$/g, '')) || [])
+const options = computed(() => column.value.dtxp?.split(',').map((v) => v.replace(/\\'/g, "'").replace(/^'|'$/g, '')) || [])
 </script>
 
 <template>