✨ Add new Jump block

Also improve Select input with a clear button

Closes #186

apps/viewer/src/features/blocks/logic/jump/executeJumpBlock.ts

@@ -0,0 +1,33 @@
+import { ExecuteLogicResponse } from '@/features/chat'
+import {
+  addEdgeToTypebot,
+  createPortalEdge,
+} from '@/features/chat/api/utils/addEdgeToTypebot'
+import { TRPCError } from '@trpc/server'
+import { SessionState } from 'models'
+import { JumpBlock } from 'models/features/blocks/logic/jump'
+
+export const executeJumpBlock = (
+  state: SessionState,
+  { groupId, blockId }: JumpBlock['options']
+): ExecuteLogicResponse => {
+  const groupToJumpTo = state.typebot.groups.find(
+    (group) => group.id === groupId
+  )
+  const blockToJumpTo =
+    groupToJumpTo?.blocks.find((block) => block.id === blockId) ??
+    groupToJumpTo?.blocks[0]
+
+  if (!blockToJumpTo?.groupId)
+    throw new TRPCError({
+      code: 'INTERNAL_SERVER_ERROR',
+      message: 'Block to jump to is not found',
+    })
+
+  const portalEdge = createPortalEdge({
+    to: { groupId: blockToJumpTo?.groupId, blockId: blockToJumpTo?.id },
+  })
+  const newSessionState = addEdgeToTypebot(state, portalEdge)
+
+  return { outgoingEdgeId: portalEdge.id, newSessionState }
+}

apps/viewer/src/features/blocks/logic/typebotLink/api/utils/executeTypebotLink.ts

@@ -1,9 +1,12 @@
 import { ExecuteLogicResponse } from '@/features/chat'
+import {
+  addEdgeToTypebot,
+  createPortalEdge,
+} from '@/features/chat/api/utils/addEdgeToTypebot'
 import { saveErrorLog } from '@/features/logs/api'
 import prisma from '@/lib/prisma'
 import {
   TypebotLinkBlock,
-  Edge,
   SessionState,
   TypebotInSession,
   Variable,
@@ -48,28 +51,17 @@ export const executeTypebotLink = async (
       })
     return { outgoingEdgeId: block.outgoingEdgeId }
   }
-  const portalEdge: Edge = {
-    id: (Math.random() * 1000).toString(),
-    from: { blockId: '', groupId: '' },
-    to: {
-      groupId: nextGroupId,
-    },
-  }
+
+  const portalEdge = createPortalEdge({ to: { groupId: nextGroupId } })
+
   newSessionState = addEdgeToTypebot(newSessionState, portalEdge)
+
   return {
     outgoingEdgeId: portalEdge.id,
     newSessionState,
   }
 }
 
-const addEdgeToTypebot = (state: SessionState, edge: Edge): SessionState => ({
-  ...state,
-  typebot: {
-    ...state.typebot,
-    edges: [...state.typebot.edges, edge],
-  },
-})
-
 const addLinkedTypebotToState = (
   state: SessionState,
   block: TypebotLinkBlock,

apps/viewer/src/features/chat/api/utils/addEdgeToTypebot.ts

@@ -0,0 +1,19 @@
+import { createId } from '@paralleldrive/cuid2'
+import { SessionState, Edge } from 'models'
+
+export const addEdgeToTypebot = (
+  state: SessionState,
+  edge: Edge
+): SessionState => ({
+  ...state,
+  typebot: {
+    ...state.typebot,
+    edges: [...state.typebot.edges, edge],
+  },
+})
+
+export const createPortalEdge = ({ to }: Pick<Edge, 'to'>) => ({
+  id: createId(),
+  from: { blockId: '', groupId: '' },
+  to,
+})

apps/viewer/src/features/chat/api/utils/executeLogic.ts

@@ -6,6 +6,7 @@ import { executeWait } from '@/features/blocks/logic/wait/api/utils/executeWait'
 import { LogicBlock, LogicBlockType, SessionState } from 'models'
 import { ExecuteLogicResponse } from '../../types'
 import { executeScript } from '@/features/blocks/logic/script/executeScript'
+import { executeJumpBlock } from '@/features/blocks/logic/jump/executeJumpBlock'
 
 export const executeLogic =
   (state: SessionState, lastBubbleBlockId?: string) =>
@@ -23,5 +24,7 @@ export const executeLogic =
         return executeTypebotLink(state, block)
       case LogicBlockType.WAIT:
         return executeWait(state, block, lastBubbleBlockId)
+      case LogicBlockType.JUMP:
+        return executeJumpBlock(state, block.options)
     }
   }