✨ Introduce bot v2 in builder (#328)

Also, the new engine is the default for updated typebots for viewer

Closes #211

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

@@ -12,14 +12,13 @@ import {
   Tooltip,
 } from '@chakra-ui/react'
 import { ExternalLinkIcon } from '@/components/icons'
-import { TypebotViewer } from 'bot-engine'
+import { Standard } from '@typebot.io/react'
 import { Typebot } from 'models'
 import React, { useCallback, useEffect, useState } from 'react'
-import { getViewerUrl, sendRequest } from 'utils'
 import { templates } from '../data'
 import { TemplateProps } from '../types'
 import { useToast } from '@/hooks/useToast'
-import { parseTypebotToPublicTypebot } from '@/features/publish'
+import { sendRequest } from 'utils'
 
 type Props = {
   isOpen: boolean
@@ -68,18 +67,20 @@ export const TemplatesModal = ({ isOpen, onClose, onTypebotChoose }: Props) => {
     >
       <ModalOverlay />
       <ModalContent h="85vh">
-        <ModalBody as={HStack} p="0" spacing="0">
+        <ModalBody h="full" as={HStack} p="0" spacing="0">
           <Stack w="full" h="full" spacing="4">
             <Heading pl="10" pt="4" fontSize="2xl">
               {selectedTemplate.emoji}{' '}
               <chakra.span ml="2">{selectedTemplate.name}</chakra.span>
             </Heading>
             {typebot && (
-              <TypebotViewer
-                apiHost={getViewerUrl()}
-                typebot={parseTypebotToPublicTypebot(typebot)}
+              <Standard
                 key={typebot.id}
-                style={{ borderRadius: '0.25rem' }}
+                typebot={typebot}
+                style={{
+                  borderRadius: '0.25rem',
+                  backgroundColor: '#fff',
+                }}
               />
             )}
           </Stack>

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

@@ -4,7 +4,7 @@ import { VStack } from '@chakra-ui/react'
 import { CreateNewTypebotButtons } from './CreateNewTypebotButtons'
 
 export const TemplatesPage = () => (
-  <VStack>
+  <VStack h="100vh">
     <Seo title="Templates" />
     <DashboardHeader />
     <CreateNewTypebotButtons />