fix(nc-gui): infinite import validation errors

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

@@ -123,12 +123,16 @@ const validators = computed(() =>
 
 const { validate, validateInfos } = useForm(data, validators)
 
-// TODO(import): show error message once
-const isValid = computed(() => {
+const isValid = ref(false)
+
+watch(
+  () => srcDestMapping.value,
+  () => {
+    let res = true
     if (importDataOnly) {
       for (const tn of Object.keys(srcDestMapping.value)) {
         if (!atLeastOneEnabledValidation(tn)) {
-        return false
+          res = false
         }
         for (const record of srcDestMapping.value[tn]) {
           if (!fieldsValidation(record, tn)) {
@@ -140,13 +144,15 @@ const isValid = computed(() => {
       for (const [_, o] of Object.entries(validateInfos)) {
         if (o?.validateStatus) {
           if (o.validateStatus === 'error') {
-          return false
+            res = false
           }
         }
       }
     }
-  return true
-})
+    isValid.value = res
+  },
+  { deep: true },
+)
 
 const prevEditableTn = ref<string[]>([])
 
@@ -158,6 +164,10 @@ onMounted(() => {
   // and updating the key in importData
   prevEditableTn.value = data.tables.map((t) => t.table_name)
 
+  if (importDataOnly) {
+    mapDefaultColumns()
+  }
+
   nextTick(() => {
     inputRefs.value[0]?.focus()
   })
@@ -569,12 +579,6 @@ defineExpose({
   isValid,
 })
 
-onMounted(() => {
-  if (importDataOnly) {
-    mapDefaultColumns()
-  }
-})
-
 function handleEditableTnChange(idx: number) {
   const oldValue = prevEditableTn.value[idx]
   const newValue = data.tables[idx].table_name