fix: nested webhook filter related issues

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

@@ -12,6 +12,7 @@ interface Props {
   webHook?: boolean
   draftFilter?: Partial<FilterType>
 }
+
 const props = withDefaults(defineProps<Props>(), {
   nestedLevel: 0,
   autoSave: true,
@@ -21,13 +22,14 @@ const props = withDefaults(defineProps<Props>(), {
   webHook: false,
 })
 
-const emit = defineEmits(['update:filtersLength', 'update:draftFilter'])
+const emit = defineEmits(['update:filtersLength', 'update:draftFilter', 'update:modelValue'])
 
 const excludedFilterColUidt = [UITypes.QrCode, UITypes.Barcode]
 
 const draftFilter = useVModel(props, 'draftFilter', emit)
+const modelValue = useVModel(props, 'modelValue', emit)
 
-const { nestedLevel, parentId, autoSave, hookId, modelValue, showLoading, webHook } = toRefs(props)
+const { nestedLevel, parentId, autoSave, hookId, showLoading, webHook } = toRefs(props)
 
 const nested = computed(() => nestedLevel.value > 0)
 
@@ -66,7 +68,7 @@ const {
   types,
 } = useViewFilters(
   activeView,
-  parentId?.value,
+  parentId,
   computed(() => autoSave.value),
   () => reloadDataHook.trigger({ shouldShowLoading: showLoading.value, offset: 0 }),
   modelValue.value || nestedFilters.value,
@@ -204,8 +206,10 @@ const applyChanges = async (hookId?: string, nested = false, isConditionSupporte
 
   if (!localNestedFilters.value?.length) return
 
+  await nextTick()
+
   for (const nestedFilter of localNestedFilters.value) {
-    if (nestedFilter.parentId) {
+    if (nestedFilter.parentId?.value) {
       await nestedFilter.applyChanges(hookId, true)
     }
   }
@@ -250,7 +254,7 @@ const updateFilterValue = (value: string, filter: Filter, index: number) => {
 
 defineExpose({
   applyChanges,
-  parentId: parentId?.value,
+  parentId,
 })
 
 const scrollToBottom = () => {
@@ -373,6 +377,17 @@ const onLogicalOpUpdate = async (filter: Filter, index: number) => {
   }
   await saveOrUpdate(filter, index)
 }
+
+// watch for changes in filters and update the modelValue
+watch(
+  filters,
+  () => {
+    if (modelValue.value !== filters.value) modelValue.value = filters.value
+  },
+  {
+    immediate: true,
+  },
+)
 </script>
 
 <template>
@@ -436,7 +451,7 @@ const onLogicalOpUpdate = async (filter: Filter, index: number) => {
               </div>
               <div class="flex border-1 rounded-lg p-2 w-full" :class="nestedLevel % 2 !== 0 ? 'bg-white' : 'bg-gray-100'">
                 <LazySmartsheetToolbarColumnFilter
-                  v-if="filter.id || filter.children"
+                  v-if="filter.id || filter.children || !autoSave"
                   :key="filter.id ?? i"
                   ref="localNestedFilters"
                   v-model="filter.children"

packages/nc-gui/composables/useViewFilters.ts

@@ -12,7 +12,7 @@ import { UITypes, isSystemColumn } from 'nocodb-sdk'
 
 export function useViewFilters(
   view: Ref<ViewType | undefined>,
-  parentId?: string,
+  parentId: Ref<string | null>,
   autoApply?: ComputedRef<boolean>,
   reloadData?: () => void,
   _currentFilters?: Filter[],
@@ -240,14 +240,14 @@ export function useViewFilters(
 
     try {
       if (isWebhook || hookId) {
-        if (parentId) {
-          filters.value = (await $api.dbTableFilter.childrenRead(parentId)).list as Filter[]
+        if (parentId.value) {
+          filters.value = (await $api.dbTableFilter.childrenRead(parentId.value)).list as Filter[]
         } else if (hookId) {
           filters.value = (await $api.dbTableWebhookFilter.read(hookId)).list as Filter[]
         }
       } else {
-        if (parentId) {
-          filters.value = (await $api.dbTableFilter.childrenRead(parentId)).list as Filter[]
+        if (parentId.value) {
+          filters.value = (await $api.dbTableFilter.childrenRead(parentId.value)).list as Filter[]
         } else {
           filters.value = (await $api.dbTableFilter.read(view.value!.id!)).list as Filter[]
           if (loadAllFilters) {
@@ -275,21 +275,25 @@ export function useViewFilters(
         } else if (filter.status === 'update') {
           await $api.dbTableFilter.update(filter.id as string, {
             ...filter,
-            fk_parent_id: parentId,
+            fk_parent_id: parentId.value,
           })
         } else if (filter.status === 'create') {
+          // extract children value if found to restore
+          const children = filters.value[+i]?.children
           if (hookId) {
             filters.value[+i] = (await $api.dbTableWebhookFilter.create(hookId, {
               ...filter,
-              fk_parent_id: parentId,
+              fk_parent_id: parentId.value,
             })) as unknown as FilterType
           } else {
             filters.value[+i] = await $api.dbTableFilter.create(view?.value?.id as string, {
               ...filter,
-              fk_parent_id: parentId,
+              fk_parent_id: parentId.value,
             })
           }
 
+          if (children) filters.value[+i].children = children
+
           allFilters.value.push(filters.value[+i])
         }
       }
@@ -345,7 +349,7 @@ export function useViewFilters(
       } else if (filter.id && filter.status !== 'create') {
         await $api.dbTableFilter.update(filter.id, {
           ...filter,
-          fk_parent_id: parentId,
+          fk_parent_id: parentId.value,
         })
         $e('a:filter:update', {
           logical: filter.logical_op,
@@ -354,7 +358,7 @@ export function useViewFilters(
       } else {
         filters.value[i] = await $api.dbTableFilter.create(view.value.id!, {
           ...filter,
-          fk_parent_id: parentId,
+          fk_parent_id: parentId.value,
         })
 
         allFilters.value.push(filters.value[+i])
@@ -482,7 +486,7 @@ export function useViewFilters(
 
     const index = filters.value.length - 1
 
-    await saveOrUpdate(filters.value[index], index, true)
+    await saveOrUpdate(filters.value[index], index)
 
     lastFilters.value = clone(filters.value)
 

packages/nocodb/src/helpers/webhookHelpers.ts

@@ -51,9 +51,6 @@ export async function validateCondition(
   for (const _filter of filters) {
     const filter = _filter instanceof Filter ? _filter : new Filter(_filter);
     let res;
-    const column = await filter.getColumn();
-    const field = column.title;
-    let val = data[field];
     if (filter.is_group) {
       res = await validateCondition(
         filter.children || (await filter.getChildren()),
@@ -62,7 +59,11 @@ export async function validateCondition(
           client,
         },
       );
-    } else if (
+    } else {
+      const column = await filter.getColumn();
+      const field = column.title;
+      let val = data[field];
+      if (
         [
           UITypes.Date,
           UITypes.DateTime,
@@ -296,6 +297,7 @@ export async function validateCondition(
             break;
         }
       }
+    }
 
     switch (filter.logical_op) {
       case 'or':

packages/nocodb/src/models/Filter.ts

@@ -515,7 +515,9 @@ export default class Filter implements FilterType {
       });
       await NocoCache.setList(CacheScope.FILTER_EXP, [hookId], filterObjs);
     }
-    return filterObjs?.map((f) => this.castType(f));
+    return filterObjs
+      ?.filter((f) => !f.fk_parent_id)
+      ?.map((f) => this.castType(f));
   }
 
   static async parentFilterList(