From 2bcd632777b8602dd2ae41d0b9fc31b4fce9e6d3 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Mon, 19 Sep 2022 20:08:28 +0530
Subject: [PATCH 1/3] fix(gui): use index as key to avoid re-rendering

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue b/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
index 3a845b81d0..fed47eef44 100644
--- a/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
+++ b/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
@@ -137,7 +137,7 @@ defineExpose({
     :class="{ 'shadow min-w-[430px] max-w-[630px] max-h-[max(80vh,500px)] overflow-auto': !nested, 'border-1 w-full': nested }"
   >
     <div v-if="filters && filters.length" class="nc-filter-grid mb-2" @click.stop>
-      <template v-for="(filter, i) in filters" :key="filter.id || i">
+      <template v-for="(filter, i) in filters" :key="i">
         <template v-if="filter.status !== 'delete'">
           <template v-if="filter.is_group">
             <MdiCloseBox

From cc684f7c43577df06fbaf5762eb238d6d44dd346 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Mon, 19 Sep 2022 20:09:01 +0530
Subject: [PATCH 2/3] fix(gui): create new object to avoid updating same object
 ref

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 packages/nc-gui/composables/useViewFilters.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui/composables/useViewFilters.ts b/packages/nc-gui/composables/useViewFilters.ts
index 45863e1a46..f02697773d 100644
--- a/packages/nc-gui/composables/useViewFilters.ts
+++ b/packages/nc-gui/composables/useViewFilters.ts
@@ -183,12 +183,12 @@ export function useViewFilters(
   }
 
   const addFilter = () => {
-    filters.value.push(placeholderFilter)
+    filters.value.push({ ...placeholderFilter })
     $e('a:filter:add', { length: filters.value.length })
   }
 
   const addFilterGroup = async () => {
-    const child = placeholderFilter
+    const child = { ...placeholderFilter }
     const placeHolderGroupFilter: Filter = {
       is_group: true,
       status: 'create',

From d47bbd4c0bded4b4afa93894085109c9760c1799 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Mon, 19 Sep 2022 20:16:58 +0530
Subject: [PATCH 3/3] fix(gui): hide add filter group in webhook and loading
 filters if new webhook

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 .../components/smartsheet-toolbar/ColumnFilter.vue       | 9 +++++----
 packages/nc-gui/components/webhook/Editor.vue            | 1 +
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue b/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
index fed47eef44..181a0d18d3 100644
--- a/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
+++ b/packages/nc-gui/components/smartsheet-toolbar/ColumnFilter.vue
@@ -23,9 +23,10 @@ interface Props {
   hookId?: string
   showLoading?: boolean
   modelValue?: Filter[]
+  webHook?: boolean
 }
 
-const { nested = false, parentId, autoSave = true, hookId = null, modelValue, showLoading = true } = defineProps<Props>()
+const { nested = false, parentId, autoSave = true, hookId = null, modelValue, showLoading = true, webHook } = defineProps<Props>()
 
 const emit = defineEmits(['update:filtersLength'])
 
@@ -101,13 +102,13 @@ const types = computed(() => {
 watch(
   () => activeView.value?.id,
   (n, o) => {
-    if (n !== o) loadFilters(hookId as string)
+    if (n !== o && (hookId || !webHook)) loadFilters(hookId as string)
   },
   { immediate: true },
 )
 
 watch(
-  () => filters.value.length,
+  () => filters.value.length ,
   (length) => {
     emit('update:filtersLength', length ?? 0)
   },
@@ -280,7 +281,7 @@ defineExpose({
           {{ $t('activity.addFilter') }}
         </div>
       </a-button>
-      <a-button class="text-capitalize !text-gray-500" @click.stop="addFilterGroup">
+      <a-button class="text-capitalize !text-gray-500" v-if="!webHook" @click.stop="addFilterGroup">
         <div class="flex items-center gap-1">
           <!--      <v-icon small color="grey"> mdi-plus </v-icon> -->
           <!--          Add Filter Group -->
diff --git a/packages/nc-gui/components/webhook/Editor.vue b/packages/nc-gui/components/webhook/Editor.vue
index 72f277cf9f..9b9e2c7aec 100644
--- a/packages/nc-gui/components/webhook/Editor.vue
+++ b/packages/nc-gui/components/webhook/Editor.vue
@@ -619,6 +619,7 @@ onMounted(async () => {
               :auto-save="false"
               :show-loading="false"
               :hook-id="hook.id"
+              web-hook
             />
           </a-card>
         </a-col>