Introduce webhook v2 (#17456)

Migrate webhook to v2 entity

packages/twenty-front/src/modules/settings/developers/graphql/mutations/deleteWebhook.ts

@@ -1,7 +1,11 @@
 import gql from 'graphql-tag';
+import { WEBHOOK_FRAGMENT } from '@/settings/developers/graphql/fragments/webhookFragment';
 
 export const DELETE_WEBHOOK = gql`
-  mutation DeleteWebhook($input: DeleteWebhookInput!) {
-    deleteWebhook(input: $input)
+  mutation DeleteWebhook($id: UUID!) {
+    deleteWebhook(id: $id) {
+      ...WebhookFragment
+    }
   }
+  ${WEBHOOK_FRAGMENT}
 `;

packages/twenty-front/src/modules/settings/developers/graphql/queries/getWebhook.ts

@@ -2,8 +2,8 @@ import gql from 'graphql-tag';
 import { WEBHOOK_FRAGMENT } from '@/settings/developers/graphql/fragments/webhookFragment';
 
 export const GET_WEBHOOK = gql`
-  query GetWebhook($input: GetWebhookInput!) {
-    webhook(input: $input) {
+  query GetWebhook($id: UUID!) {
+    webhook(id: $id) {
       ...WebhookFragment
     }
   }

packages/twenty-front/src/modules/settings/developers/hooks/__tests__/useWebhookForm.test.tsx

@@ -61,11 +61,13 @@ const createSuccessfulUpdateMock = (webhookId: string, webhookData = {}) => ({
     variables: {
       input: {
         id: webhookId,
-        targetUrl: 'https://updated.com/webhook',
-        operations: ['person.updated'],
-        description: 'Updated webhook',
-        secret: 'updated-secret',
-        ...webhookData,
+        update: {
+          targetUrl: 'https://updated.com/webhook',
+          operations: ['person.updated'],
+          description: 'Updated webhook',
+          secret: 'updated-secret',
+          ...webhookData,
+        },
       },
     },
   },
@@ -87,16 +89,12 @@ const createSuccessfulDeleteMock = (webhookId: string) => ({
   request: {
     query: DELETE_WEBHOOK,
     variables: {
-      input: {
-        id: webhookId,
-      },
+      id: webhookId,
     },
   },
   result: {
     data: {
-      deleteWebhook: {
-        id: webhookId,
-      },
+      deleteWebhook: createMockWebhookData({ id: webhookId }),
     },
   },
 });
@@ -105,9 +103,7 @@ const createGetWebhookMock = (webhookId: string, webhookData = {}) => ({
   request: {
     query: GET_WEBHOOK,
     variables: {
-      input: {
-        id: webhookId,
-      },
+      id: webhookId,
     },
   },
   result: {
@@ -329,10 +325,12 @@ describe('useWebhookForm', () => {
           variables: {
             input: {
               id: webhookId,
-              targetUrl: 'https://test.com/webhook',
-              operations: ['person.created'],
-              description: 'Test webhook',
-              secret: 'test-secret',
+              update: {
+                targetUrl: 'https://test.com/webhook',
+                operations: ['person.created'],
+                description: 'Test webhook',
+                secret: 'test-secret',
+              },
             },
           },
         },
@@ -464,9 +462,7 @@ describe('useWebhookForm', () => {
         request: {
           query: DELETE_WEBHOOK,
           variables: {
-            input: {
-              id: webhookId,
-            },
+            id: webhookId,
           },
         },
         error: new Error('Deletion failed'),

packages/twenty-front/src/modules/settings/developers/hooks/useWebhookForm.ts

@@ -55,7 +55,7 @@ export const useWebhookForm = ({ webhookId, mode }: UseWebhookFormProps) => {
   const { loading, error } = useGetWebhookQuery({
     skip: isCreationMode || !webhookId,
     variables: {
-      input: { id: webhookId || '' },
+      id: webhookId || '',
     },
     onCompleted: (data) => {
       const webhook = data.webhook;
@@ -119,8 +119,10 @@ export const useWebhookForm = ({ webhookId, mode }: UseWebhookFormProps) => {
     }
 
     try {
-      const input = createWebhookUpdateInput(formValues, webhookId);
-      const { data } = await updateWebhook({ variables: { input } });
+      const input = createWebhookUpdateInput(formValues);
+      const { data } = await updateWebhook({
+        variables: { input: { id: webhookId, update: input } },
+      });
       const updatedWebhook = data?.updateWebhook;
 
       formConfig.reset(formValues);
@@ -182,7 +184,7 @@ export const useWebhookForm = ({ webhookId, mode }: UseWebhookFormProps) => {
 
     try {
       await deleteWebhook({
-        variables: { input: { id: webhookId } },
+        variables: { id: webhookId },
       });
       enqueueSuccessSnackBar({
         message: t`Webhook deleted successfully`,

packages/twenty-front/src/modules/settings/developers/utils/__tests__/createWebhookInput.test.ts

@@ -1,8 +1,8 @@
-import { type WebhookFormValues } from '@/settings/developers/validation-schemas/webhookFormSchema';
 import {
   createWebhookCreateInput,
   createWebhookUpdateInput,
 } from '@/settings/developers/utils/createWebhookInput';
+import { type WebhookFormValues } from '@/settings/developers/validation-schemas/webhookFormSchema';
 
 describe('createWebhookInput', () => {
   const mockFormValues: WebhookFormValues = {
@@ -43,11 +43,9 @@ describe('createWebhookInput', () => {
 
   describe('createWebhookUpdateInput', () => {
     it('should create input for webhook update with id', () => {
-      const webhookId = 'test-webhook-id';
-      const result = createWebhookUpdateInput(mockFormValues, webhookId);
+      const result = createWebhookUpdateInput(mockFormValues);
 
       expect(result).toEqual({
-        id: 'test-webhook-id',
         targetUrl: 'https://test.com/webhook',
         operations: ['person.created', 'company.updated'],
         description: 'Test webhook',
@@ -60,12 +58,10 @@ describe('createWebhookInput', () => {
         ...mockFormValues,
         targetUrl: '   https://example.com   ',
       };
-      const webhookId = 'test-webhook-id';
 
-      const result = createWebhookUpdateInput(formValues, webhookId);
+      const result = createWebhookUpdateInput(formValues);
 
       expect(result.targetUrl).toBe('https://example.com');
-      expect(result.id).toBe('test-webhook-id');
     });
   });
 });

packages/twenty-front/src/modules/settings/developers/utils/createWebhookInput.ts

@@ -12,14 +12,10 @@ export const createWebhookCreateInput = (formValues: WebhookFormValues) => {
   };
 };
 
-export const createWebhookUpdateInput = (
-  formValues: WebhookFormValues,
-  webhookId: string,
-) => {
+export const createWebhookUpdateInput = (formValues: WebhookFormValues) => {
   const cleanedOperations = cleanAndFormatOperations(formValues.operations);
 
   return {
-    id: webhookId,
     targetUrl: formValues.targetUrl.trim(),
     operations: cleanedOperations,
     description: formValues.description,