feat(editor): ✨ Restore published version button

Had to migrate webhooks into a standalone table

apps/viewer/pages/[[...publicId]].tsx

@@ -1,13 +1,14 @@
 import { NotFoundPage } from 'layouts/NotFoundPage'
 import { PublicTypebot } from 'models'
 import { GetServerSideProps, GetServerSidePropsContext } from 'next'
+import { isDefined, isNotDefined, omit } from 'utils'
 import { TypebotPage, TypebotPageProps } from '../layouts/TypebotPage'
 import prisma from '../libs/prisma'
 
 export const getServerSideProps: GetServerSideProps = async (
   context: GetServerSidePropsContext
 ) => {
-  let typebot: PublicTypebot | null
+  let typebot: Omit<PublicTypebot, 'createdAt' | 'updatedAt'> | null
   const isIE = /MSIE|Trident/.test(context.req.headers['user-agent'] ?? '')
   const pathname = context.resolvedUrl.split('?')[0]
   try {
@@ -42,17 +43,23 @@ const getTypebotFromPublicId = async (publicId?: string) => {
   const typebot = await prisma.publicTypebot.findUnique({
     where: { publicId },
   })
-  return (typebot as unknown as PublicTypebot) ?? null
+  if (isNotDefined(typebot)) return null
+  return omit(typebot as PublicTypebot, 'createdAt', 'updatedAt')
 }
 
 const getTypebotFromCustomDomain = async (customDomain: string) => {
   const typebot = await prisma.publicTypebot.findUnique({
     where: { customDomain },
   })
-  return (typebot as unknown as PublicTypebot) ?? null
+  if (isNotDefined(typebot)) return null
+  return omit(typebot as PublicTypebot, 'createdAt', 'updatedAt')
 }
 
 const App = ({ typebot, ...props }: TypebotPageProps) =>
-  typebot ? <TypebotPage typebot={typebot} {...props} /> : <NotFoundPage />
+  isDefined(typebot) ? (
+    <TypebotPage typebot={typebot} {...props} />
+  ) : (
+    <NotFoundPage />
+  )
 
 export default App

apps/viewer/pages/api/typebots/[typebotId]/blocks/[blockId]/steps/[stepId]/executeWebhook.ts

@@ -7,6 +7,7 @@ import {
   Variable,
   Webhook,
   WebhookResponse,
+  WebhookStep,
 } from 'models'
 import { parseVariables } from 'bot-engine'
 import { NextApiRequest, NextApiResponse } from 'next'
@@ -32,14 +33,16 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
     }
     const typebot = (await prisma.typebot.findUnique({
       where: { id: typebotId },
-    })) as unknown as Typebot
+      include: { webhooks: true },
+    })) as unknown as Typebot & { webhooks: Webhook[] }
     const step = typebot.blocks.find(byId(blockId))?.steps.find(byId(stepId))
-    if (!step || !('webhook' in step))
+    const webhook = typebot.webhooks.find(byId((step as WebhookStep).webhookId))
+    if (!webhook)
       return res
         .status(404)
         .send({ statusCode: 404, data: { message: `Couldn't find webhook` } })
     const result = await executeWebhook(typebot)(
-      step.webhook,
+      webhook,
       variables,
       blockId,
       resultValues
@@ -133,7 +136,7 @@ const getBodyContent =
     resultValues,
     blockId,
   }: {
-    body?: string
+    body?: string | null
     resultValues?: ResultValues
     blockId: string
   }): string | undefined => {

apps/viewer/pages/api/typebots/[typebotId]/blocks/[blockId]/steps/[stepId]/subscribeWebhook.ts

@@ -1,10 +1,9 @@
 import { withSentry } from '@sentry/nextjs'
-import { Prisma } from 'db'
 import prisma from 'libs/prisma'
-import { HttpMethod, Typebot } from 'models'
+import { Typebot, WebhookStep } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { authenticateUser } from 'services/api/utils'
-import { isWebhookStep, methodNotAllowed } from 'utils'
+import { byId, methodNotAllowed } from 'utils'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   if (req.method === 'POST') {
@@ -15,17 +14,18 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
       return res.status(403).send({ message: 'url is missing in body' })
     const { url } = body
     const typebotId = req.query.typebotId.toString()
+    const blockId = req.query.blockId.toString()
     const stepId = req.query.stepId.toString()
     const typebot = (await prisma.typebot.findUnique({
       where: { id_ownerId: { id: typebotId, ownerId: user.id } },
     })) as unknown as Typebot | undefined
     if (!typebot) return res.status(400).send({ message: 'Typebot not found' })
     try {
-      const updatedTypebot = addUrlToWebhookStep(url, typebot, stepId)
-      await prisma.typebot.update({
-        where: { id_ownerId: { id: typebotId, ownerId: user.id } },
-        data: { blocks: updatedTypebot.blocks as Prisma.JsonArray },
-      })
+      const { webhookId } = typebot.blocks
+        .find(byId(blockId))
+        ?.steps.find(byId(stepId)) as WebhookStep
+      await prisma.webhook.update({ where: { id: webhookId }, data: { url } })
+
       return res.send({ message: 'success' })
     } catch (err) {
       return res
@@ -36,30 +36,4 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   return methodNotAllowed(res)
 }
 
-const addUrlToWebhookStep = (
-  url: string,
-  typebot: Typebot,
-  stepId: string
-): Typebot => ({
-  ...typebot,
-  blocks: typebot.blocks.map((b) => ({
-    ...b,
-    steps: b.steps.map((s) => {
-      if (s.id === stepId) {
-        if (!isWebhookStep(s)) throw new Error()
-        return {
-          ...s,
-          webhook: {
-            ...s.webhook,
-            url,
-            method: HttpMethod.POST,
-            body: '{{state}}',
-          },
-        }
-      }
-      return s
-    }),
-  })),
-})
-
 export default withSentry(handler)

apps/viewer/pages/api/typebots/[typebotId]/blocks/[blockId]/steps/[stepId]/unsubscribeWebhook.ts

@@ -1,30 +1,30 @@
 import { withSentry } from '@sentry/nextjs'
-import { Prisma } from 'db'
 import prisma from 'libs/prisma'
-import { Typebot } from 'models'
+import { Typebot, WebhookStep } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { authenticateUser } from 'services/api/utils'
-import { omit } from 'services/utils'
-import { isWebhookStep, methodNotAllowed } from 'utils'
+import { byId, methodNotAllowed } from 'utils'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   if (req.method === 'POST') {
     const user = await authenticateUser(req)
     if (!user) return res.status(401).json({ message: 'Not authenticated' })
     const typebotId = req.query.typebotId.toString()
+    const blockId = req.query.blockId.toString()
     const stepId = req.query.stepId.toString()
     const typebot = (await prisma.typebot.findUnique({
       where: { id_ownerId: { id: typebotId, ownerId: user.id } },
     })) as unknown as Typebot | undefined
     if (!typebot) return res.status(400).send({ message: 'Typebot not found' })
     try {
-      const updatedTypebot = removeUrlFromWebhookStep(typebot, stepId)
-      await prisma.typebot.update({
-        where: { id_ownerId: { id: typebotId, ownerId: user.id } },
-        data: {
-          blocks: updatedTypebot.blocks as Prisma.JsonArray,
-        },
+      const { webhookId } = typebot.blocks
+        .find(byId(blockId))
+        ?.steps.find(byId(stepId)) as WebhookStep
+      await prisma.webhook.update({
+        where: { id: webhookId },
+        data: { url: null },
       })
+
       return res.send({ message: 'success' })
     } catch (err) {
       return res
@@ -35,21 +35,4 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   return methodNotAllowed(res)
 }
 
-const removeUrlFromWebhookStep = (
-  typebot: Typebot,
-  stepId: string
-): Typebot => ({
-  ...typebot,
-  blocks: typebot.blocks.map((b) => ({
-    ...b,
-    steps: b.steps.map((s) => {
-      if (s.id === stepId) {
-        if (!isWebhookStep(s)) throw new Error()
-        return { ...s, webhook: omit(s.webhook, 'url') }
-      }
-      return s
-    }),
-  })),
-})
-
 export default withSentry(handler)

apps/viewer/pages/api/typebots/[typebotId]/webhookSteps.ts

@@ -3,7 +3,7 @@ import prisma from 'libs/prisma'
 import { Block } from 'models'
 import { NextApiRequest, NextApiResponse } from 'next'
 import { authenticateUser } from 'services/api/utils'
-import { isWebhookStep, methodNotAllowed } from 'utils'
+import { byId, isNotDefined, isWebhookStep, methodNotAllowed } from 'utils'
 
 const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   if (req.method === 'GET') {
@@ -12,13 +12,15 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
     const typebotId = req.query.typebotId.toString()
     const typebot = await prisma.typebot.findUnique({
       where: { id_ownerId: { id: typebotId, ownerId: user.id } },
-      select: { blocks: true },
+      select: { blocks: true, webhooks: true },
     })
     const emptyWebhookSteps = (typebot?.blocks as Block[]).reduce<
       { blockId: string; id: string; name: string }[]
     >((emptyWebhookSteps, block) => {
       const steps = block.steps.filter(
-        (step) => isWebhookStep(step) && !step.webhook.url
+        (step) =>
+          isWebhookStep(step) &&
+          isNotDefined(typebot?.webhooks.find(byId(step.webhookId))?.url)
       )
       return [
         ...emptyWebhookSteps,