✨ (api) Add CRUD typebot endpoints

Closes #320, closes #696

apps/builder/src/features/templates/components/CreateNewTypebotButtons.tsx

@@ -15,8 +15,7 @@ import { TemplatesModal } from './TemplatesModal'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
 import { useUser } from '@/features/account/hooks/useUser'
 import { useToast } from '@/hooks/useToast'
-import { createTypebotQuery } from '@/features/dashboard/queries/createTypebotQuery'
-import { importTypebotQuery } from '@/features/dashboard/queries/importTypebotQuery'
+import { trpc } from '@/lib/trpc'
 
 export const CreateNewTypebotButtons = () => {
   const { workspace } = useWorkspace()
@@ -28,40 +27,16 @@ export const CreateNewTypebotButtons = () => {
 
   const { showToast } = useToast()
 
-  const handleCreateSubmit = async (typebot?: Typebot) => {
-    if (!user || !workspace) return
-    setIsLoading(true)
-    const folderId = router.query.folderId?.toString() ?? null
-    const { error, data } = typebot
-      ? await importTypebotQuery(
-          {
-            ...typebot,
-            folderId,
-            workspaceId: workspace.id,
-            theme: {
-              ...typebot.theme,
-              chat: {
-                ...typebot.theme.chat,
-                hostAvatar: {
-                  isEnabled: true,
-                  url:
-                    typebot.theme.chat.hostAvatar?.url ??
-                    user.image ??
-                    undefined,
-                },
-              },
-            },
-          },
-          workspace.plan
-        )
-      : await createTypebotQuery({
-          folderId,
-          workspaceId: workspace.id,
-        })
-    if (error) showToast({ description: error.message })
-    if (data)
+  const { mutate } = trpc.typebot.createTypebot.useMutation({
+    onMutate: () => {
+      setIsLoading(true)
+    },
+    onError: (error) => {
+      showToast({ description: error.message })
+    },
+    onSuccess: (data) => {
       router.push({
-        pathname: `/typebots/${data.id}/edit`,
+        pathname: `/typebots/${data.typebot.id}/edit`,
         query:
           router.query.isFirstBot === 'true'
             ? {
@@ -69,7 +44,22 @@ export const CreateNewTypebotButtons = () => {
               }
             : {},
       })
-    setIsLoading(false)
+    },
+    onSettled: () => {
+      setIsLoading(false)
+    },
+  })
+
+  const handleCreateSubmit = async (typebot?: Typebot) => {
+    if (!user || !workspace) return
+    const folderId = router.query.folderId?.toString() ?? null
+    mutate({
+      workspaceId: workspace.id,
+      typebot: {
+        ...(typebot ? { ...typebot } : {}),
+        folderId,
+      },
+    })
   }
 
   return (

apps/builder/src/features/templates/components/ImportTypebotFromFileButton.tsx

@@ -1,8 +1,8 @@
+import { parseInvalidTypebot } from '@/features/typebot/helpers/parseInvalidTypebot'
 import { useToast } from '@/hooks/useToast'
 import { Button, ButtonProps, chakra } from '@chakra-ui/react'
-import { groupSchema, Typebot } from '@typebot.io/schemas'
+import { Typebot, typebotSchema } from '@typebot.io/schemas'
 import React, { ChangeEvent } from 'react'
-import { z } from 'zod'
 
 type Props = {
   onNewTypebot: (typebot: Typebot) => void
@@ -19,8 +19,13 @@ export const ImportTypebotFromFileButton = ({
     const file = e.target.files[0]
     const fileContent = await readFile(file)
     try {
-      const typebot = JSON.parse(fileContent)
-      z.array(groupSchema).parse(typebot.groups)
+      const typebot = parseInvalidTypebot(JSON.parse(fileContent))
+      typebotSchema
+        .omit({
+          createdAt: true,
+          updatedAt: true,
+        })
+        .parse(typebot)
       onNewTypebot(typebot)
     } catch (err) {
       console.error(err)