barcode: fix all the issues from PR review

packages/nc-gui/components.d.ts

@@ -201,7 +201,6 @@ declare module '@vue/runtime-core' {
     MdiLogin: typeof import('~icons/mdi/login')['default']
     MdiLogout: typeof import('~icons/mdi/logout')['default']
     MdiMagnify: typeof import('~icons/mdi/magnify')['default']
-    MdiMapMarker: typeof import('~icons/mdi/map-marker')['default']
     MdiMenu: typeof import('~icons/mdi/menu')['default']
     MdiMenuDown: typeof import('~icons/mdi/menu-down')['default']
     MdiMenuIcon: typeof import('~icons/mdi/menu-icon')['default']

packages/nc-gui/components/smartsheet/column/BarcodeOptions.vue

@@ -72,8 +72,6 @@ setAdditionalValidations({
 })
 
 const showBarcodeValueColumnInfoIcon = computed(() => !columnsAllowedAsBarcodeValue.value?.length)
-
-// set default meta value
 </script>
 
 <template>

packages/nc-gui/components/virtual-cell/barcode/Barcode.vue

@@ -7,9 +7,14 @@ const cellValue = inject(CellValueInj)
 
 const column = inject(ColumnInj)
 
-const barcodeValue = computed(() => String(cellValue?.value))
+const barcodeValue = computed(() => {
+  if (cellValue?.value === undefined) {
+    return undefined
+  }
+  return String(cellValue.value)
+})
 
-const tooManyCharsForBarcode = computed(() => barcodeValue?.value.length > maxNumberOfAllowedCharsForBarcodeValue)
+const tooManyCharsForBarcode = computed(() => barcodeValue?.value?.length > maxNumberOfAllowedCharsForBarcodeValue)
 
 const modalVisible = ref(false)
 
@@ -27,7 +32,7 @@ const barcodeMeta = $computed(() => {
 const handleModalOkClick = () => (modalVisible.value = false)
 
 const showBarcode = computed(() => {
-  return cellValue?.value?.length > 0 && !tooManyCharsForBarcode.value
+  return barcodeValue && barcodeValue?.value?.length > 0 && !tooManyCharsForBarcode.value
 })
 
 const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning } = useShowNotEditableWarning()

packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import JsBarcode from 'jsbarcode'
+import { onMounted } from '#imports'
 
 const props = defineProps({
   barcodeValue: { type: String, required: true },
@@ -7,6 +8,7 @@ const props = defineProps({
 })
 
 const emit = defineEmits(['onClickBarcode'])
+
 const barcodeSvgRef = ref(null)
 const errorForCurrentInput = ref(false)
 
@@ -27,8 +29,7 @@ const onBarcodeClick = (ev: MouseEvent) => {
   emit('onClickBarcode')
 }
 
-watch(() => props.barcodeValue, generate)
-watch(() => props.barcodeFormat, generate)
+watch([() => props.barcodeValue, () => props.barcodeFormat], generate)
 onMounted(generate)
 </script>
 

packages/nc-gui/plugins/ant.ts

@@ -1,9 +1,7 @@
 import { Menu as AntMenu, Modal as AntModal, message } from 'ant-design-vue'
-// import VueBarcode from '@chenfengyuan/vue-barcode'
 import { defineNuxtPlugin } from '#imports'
 
 export default defineNuxtPlugin((nuxtApp) => {
-  // nuxtApp.vueApp.component(VueBarcode.name, VueBarcode)
   nuxtApp.vueApp.component(AntMenu.name, AntMenu)
   nuxtApp.vueApp.component(AntModal.name, AntModal)
   message.config({