✨ Add webhook blocks API public endpoints

apps/builder/src/features/billing/components/BillingContent/BillingContent.tsx

@@ -12,6 +12,7 @@ import { ChangePlanForm } from '../ChangePlanForm'
 export const BillingContent = () => {
   const { workspace, refreshWorkspace } = useWorkspace()
 
+  console.log(workspace)
   if (!workspace) return null
   return (
     <Stack spacing="10" w="full">
@@ -20,13 +21,7 @@ export const BillingContent = () => {
         <CurrentSubscriptionContent
           plan={workspace.plan}
           stripeId={workspace.stripeId}
-          onCancelSuccess={() =>
-            refreshWorkspace({
-              plan: Plan.FREE,
-              additionalChatsIndex: 0,
-              additionalStorageIndex: 0,
-            })
-          }
+          onCancelSuccess={refreshWorkspace}
         />
         <HStack maxW="500px">
           <StripeClimateLogo />

apps/builder/src/features/billing/components/ChangePlanForm/ChangePlanForm.tsx

@@ -52,11 +52,7 @@ export const ChangePlanForm = () => {
       additionalChatsIndex: selectedChatsLimitIndex,
       additionalStorageIndex: selectedStorageLimitIndex,
     })
-    refreshWorkspace({
-      plan,
-      additionalChatsIndex: selectedChatsLimitIndex,
-      additionalStorageIndex: selectedStorageLimitIndex,
-    })
+    refreshWorkspace()
     showToast({
       status: 'success',
       description: `Workspace ${plan} plan successfully updated 🎉`,

apps/builder/src/features/blocks/integrations/webhook/api/index.ts

@@ -0,0 +1 @@
+export * from './router'

apps/builder/src/features/blocks/integrations/webhook/api/procedures/getResultExampleProcedure.ts

@@ -0,0 +1,74 @@
+import { getLinkedTypebots } from '@/features/blocks/logic/typebotLink/api'
+import prisma from '@/lib/prisma'
+import { canReadTypebot } from '@/utils/api/dbRules'
+import { authenticatedProcedure } from '@/utils/server/trpc'
+import { TRPCError } from '@trpc/server'
+import { Typebot, Webhook } from 'models'
+import { z } from 'zod'
+import { parseResultExample } from '../utils'
+
+export const getResultExampleProcedure = authenticatedProcedure
+  .meta({
+    openapi: {
+      method: 'GET',
+      path: '/typebots/{typebotId}/webhookBlocks/{blockId}/getResultExample',
+      protect: true,
+      summary: 'Get result example',
+      description:
+        'Returns "fake" result for webhook block to help you anticipate how the webhook will behave.',
+      tags: ['Webhook'],
+    },
+  })
+  .input(
+    z.object({
+      typebotId: z.string(),
+      blockId: z.string(),
+    })
+  )
+  .output(
+    z.object({
+      resultExample: z
+        .object({
+          message: z.literal(
+            'This is a sample result, it has been generated ⬇️'
+          ),
+          'Submitted at': z.string(),
+        })
+        .and(z.record(z.string().optional()))
+        .describe('Can contain any fields.'),
+    })
+  )
+  .query(async ({ input: { typebotId, blockId }, ctx: { user } }) => {
+    const typebot = (await prisma.typebot.findFirst({
+      where: canReadTypebot(typebotId, user),
+      select: {
+        groups: true,
+        edges: true,
+        variables: true,
+        webhooks: true,
+      },
+    })) as
+      | (Pick<Typebot, 'groups' | 'edges' | 'variables'> & {
+          webhooks: Webhook[]
+        })
+      | null
+
+    if (!typebot)
+      throw new TRPCError({ code: 'NOT_FOUND', message: 'Typebot not found' })
+
+    const block = typebot.groups
+      .flatMap((g) => g.blocks)
+      .find((s) => s.id === blockId)
+
+    if (!block)
+      throw new TRPCError({ code: 'NOT_FOUND', message: 'Block not found' })
+
+    const linkedTypebots = await getLinkedTypebots(typebot, user)
+
+    return {
+      resultExample: await parseResultExample(
+        typebot,
+        linkedTypebots
+      )(block.groupId),
+    }
+  })

apps/builder/src/features/blocks/integrations/webhook/api/procedures/index.ts

@@ -0,0 +1,4 @@
+export * from './getResultExampleProcedure'
+export * from './listWebhookBlocksProcedure'
+export * from './subscribeWebhookProcedure'
+export * from './unsubscribeWebhookProcedure'

apps/builder/src/features/blocks/integrations/webhook/api/procedures/listWebhookBlocksProcedure.ts

@@ -0,0 +1,65 @@
+import prisma from '@/lib/prisma'
+import { canReadTypebot } from '@/utils/api/dbRules'
+import { authenticatedProcedure } from '@/utils/server/trpc'
+import { TRPCError } from '@trpc/server'
+import { Group, Typebot, Webhook, WebhookBlock } from 'models'
+import { byId, isWebhookBlock } from 'utils'
+import { z } from 'zod'
+
+export const listWebhookBlocksProcedure = authenticatedProcedure
+  .meta({
+    openapi: {
+      method: 'GET',
+      path: '/typebots/{typebotId}/webhookBlocks',
+      protect: true,
+      summary: 'List webhook blocks',
+      description:
+        'Returns a list of all the webhook blocks that you can subscribe to.',
+      tags: ['Webhook'],
+    },
+  })
+  .input(
+    z.object({
+      typebotId: z.string(),
+    })
+  )
+  .output(
+    z.object({
+      webhookBlocks: z.array(
+        z.object({
+          id: z.string(),
+          label: z.string(),
+          url: z.string().optional(),
+        })
+      ),
+    })
+  )
+  .query(async ({ input: { typebotId }, ctx: { user } }) => {
+    const typebot = (await prisma.typebot.findFirst({
+      where: canReadTypebot(typebotId, user),
+      select: {
+        groups: true,
+        webhooks: true,
+      },
+    })) as (Pick<Typebot, 'groups'> & { webhooks: Webhook[] }) | null
+    if (!typebot)
+      throw new TRPCError({ code: 'NOT_FOUND', message: 'Typebot not found' })
+
+    const webhookBlocks = (typebot?.groups as Group[]).reduce<
+      { id: string; label: string; url: string | undefined }[]
+    >((webhookBlocks, group) => {
+      const blocks = group.blocks.filter((block) =>
+        isWebhookBlock(block)
+      ) as WebhookBlock[]
+      return [
+        ...webhookBlocks,
+        ...blocks.map((b) => ({
+          id: b.id,
+          label: `${group.title} > ${b.id}`,
+          url: typebot?.webhooks.find(byId(b.webhookId))?.url ?? undefined,
+        })),
+      ]
+    }, [])
+
+    return { webhookBlocks }
+  })

apps/builder/src/features/blocks/integrations/webhook/api/procedures/subscribeWebhookProcedure.ts

@@ -0,0 +1,64 @@
+import prisma from '@/lib/prisma'
+import { canWriteTypebot } from '@/utils/api/dbRules'
+import { authenticatedProcedure } from '@/utils/server/trpc'
+import { TRPCError } from '@trpc/server'
+import { Typebot, Webhook, WebhookBlock } from 'models'
+import { byId, isWebhookBlock } from 'utils'
+import { z } from 'zod'
+
+export const subscribeWebhookProcedure = authenticatedProcedure
+  .meta({
+    openapi: {
+      method: 'POST',
+      path: '/typebots/{typebotId}/webhookBlocks/{blockId}/subscribe',
+      protect: true,
+      summary: 'Subscribe to webhook block',
+      tags: ['Webhook'],
+    },
+  })
+  .input(
+    z.object({
+      typebotId: z.string(),
+      blockId: z.string(),
+      url: z.string(),
+    })
+  )
+  .output(
+    z.object({
+      id: z.string(),
+      url: z.string().nullable(),
+    })
+  )
+  .query(async ({ input: { typebotId, blockId, url }, ctx: { user } }) => {
+    const typebot = (await prisma.typebot.findFirst({
+      where: canWriteTypebot(typebotId, user),
+      select: {
+        groups: true,
+        webhooks: true,
+      },
+    })) as (Pick<Typebot, 'groups'> & { webhooks: Webhook[] }) | null
+
+    if (!typebot)
+      throw new TRPCError({ code: 'NOT_FOUND', message: 'Typebot not found' })
+
+    const webhookBlock = typebot.groups
+      .flatMap((g) => g.blocks)
+      .find(byId(blockId)) as WebhookBlock | null
+
+    if (!webhookBlock || !isWebhookBlock(webhookBlock))
+      throw new TRPCError({
+        code: 'NOT_FOUND',
+        message: 'Webhook block not found',
+      })
+
+    await prisma.webhook.upsert({
+      where: { id: webhookBlock.webhookId },
+      update: { url, body: '{{state}}', method: 'POST' },
+      create: { url, body: '{{state}}', method: 'POST', typebotId },
+    })
+
+    return {
+      id: blockId,
+      url,
+    }
+  })

apps/builder/src/features/blocks/integrations/webhook/api/procedures/unsubscribeWebhookProcedure.ts

@@ -0,0 +1,62 @@
+import prisma from '@/lib/prisma'
+import { canWriteTypebot } from '@/utils/api/dbRules'
+import { authenticatedProcedure } from '@/utils/server/trpc'
+import { TRPCError } from '@trpc/server'
+import { Typebot, Webhook, WebhookBlock } from 'models'
+import { byId, isWebhookBlock } from 'utils'
+import { z } from 'zod'
+
+export const unsubscribeWebhookProcedure = authenticatedProcedure
+  .meta({
+    openapi: {
+      method: 'POST',
+      path: '/typebots/{typebotId}/webhookBlocks/{blockId}/unsubscribe',
+      protect: true,
+      summary: 'Unsubscribe from webhook block',
+      tags: ['Webhook'],
+    },
+  })
+  .input(
+    z.object({
+      typebotId: z.string(),
+      blockId: z.string(),
+    })
+  )
+  .output(
+    z.object({
+      id: z.string(),
+      url: z.string().nullable(),
+    })
+  )
+  .query(async ({ input: { typebotId, blockId }, ctx: { user } }) => {
+    const typebot = (await prisma.typebot.findFirst({
+      where: canWriteTypebot(typebotId, user),
+      select: {
+        groups: true,
+        webhooks: true,
+      },
+    })) as (Pick<Typebot, 'groups'> & { webhooks: Webhook[] }) | null
+
+    if (!typebot)
+      throw new TRPCError({ code: 'NOT_FOUND', message: 'Typebot not found' })
+
+    const webhookBlock = typebot.groups
+      .flatMap((g) => g.blocks)
+      .find(byId(blockId)) as WebhookBlock | null
+
+    if (!webhookBlock || !isWebhookBlock(webhookBlock))
+      throw new TRPCError({
+        code: 'NOT_FOUND',
+        message: 'Webhook block not found',
+      })
+
+    await prisma.webhook.update({
+      where: { id: webhookBlock.webhookId },
+      data: { url: null },
+    })
+
+    return {
+      id: blockId,
+      url: null,
+    }
+  })

apps/builder/src/features/blocks/integrations/webhook/api/router.ts

@@ -0,0 +1,14 @@
+import { router } from '@/utils/server/trpc'
+import {
+  listWebhookBlocksProcedure,
+  subscribeWebhookProcedure,
+  unsubscribeWebhookProcedure,
+  getResultExampleProcedure,
+} from './procedures'
+
+export const webhookRouter = router({
+  listWebhookBlocks: listWebhookBlocksProcedure,
+  getResultExample: getResultExampleProcedure,
+  subscribeWebhook: subscribeWebhookProcedure,
+  unsubscribeWebhook: unsubscribeWebhookProcedure,
+})

apps/builder/src/features/blocks/integrations/webhook/api/utils/index.ts

@@ -0,0 +1 @@
+export * from './parseResultExample'