diff --git a/packages/nc-gui-v2/components/webhook/Drawer.vue b/packages/nc-gui-v2/components/webhook/Drawer.vue
index 4b5de4745a..393c9b40c2 100644
--- a/packages/nc-gui-v2/components/webhook/Drawer.vue
+++ b/packages/nc-gui-v2/components/webhook/Drawer.vue
@@ -16,12 +16,17 @@ const dialogShow = computed({
     emit('update:modelValue', v)
   },
 })
+
+function editHook(hook: Record<string, any>) {
+  editOrAdd.value = true
+  // TODO: update editor ref hook
+}
 </script>
 
 <template>
   <a-drawer v-model:visible="dialogShow" :closable="false" placement="right" width="700px" @keydown.esc="dialogShow = false">
     <WebhookEditor v-if="editOrAdd" />
-    <WebhookList v-else @edit-or-add="editOrAdd = true" />
+    <WebhookList v-else @edit="editHook" @add="editOrAdd = true" />
     <div class="self-center flex flex-column flex-wrap gap-4 items-center mt-4 md:mx-8 md:justify-between justify-center w-full">
       <a-button v-t="['e:hiring']" href="https://angel.co/company/nocodb" target="_blank" size="large">
         🚀 We are Hiring! 🚀