blsmedia/bot
2
0
Fork 0
Code Activity

⚡ (openai) Add Messages sequence type

Browse Source 
To make it easy to just plug a sequence of user / assistant messages to Chat completion task

Closes #387
This commit is contained in:
Baptiste Arnaud
2023-03-13 16:28:08 +01:00
parent 48db171c1b
commit c4db2f42a6
27 changed files with 468 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/builder/src/components/inputs/VariableSearchInput.tsx
View File

@ -24,7 +24,7 @@ import { useOutsideClick } from '@/hooks/useOutsideClick'
import { useParentModal } from '@/features/graph/providers/ParentModalProvider'
type Props = {
initialVariableId?: string
initialVariableId: string | undefined
autoFocus?: boolean
onSelectVariable: (
variable: Pick<Variable, 'id' | 'name'> | undefined

1
apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor/TextBubbleEditor.tsx
View File

@ -164,6 +164,7 @@ const TextBubbleEditorContent = ({
zIndex={10}
>
<VariableSearchInput
initialVariableId={undefined}
onSelectVariable={handleVariableSelected}
placeholder="Search for a variable"
autoFocus

13
apps/builder/src/features/blocks/inputs/date/components/DateNodeContent.tsx
View File

@ -1,6 +1,13 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
export const DateNodeContent = () => (
<Text color={'gray.500'}>Pick a date...</Text>
)
type Props = {
variableId?: string
}
export const DateNodeContent = ({ variableId }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text color={'gray.500'}>Pick a date...</Text>
)

11
apps/builder/src/features/blocks/inputs/emailInput/components/EmailInputNodeContent.tsx
View File

@ -1,11 +1,16 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { EmailInputBlock } from 'models'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
type Props = {
variableId?: string
placeholder: EmailInputBlock['options']['labels']['placeholder']
}
export const EmailInputNodeContent = ({ placeholder }: Props) => (
<Text color={'gray.500'}>{placeholder}</Text>
)
export const EmailInputNodeContent = ({ variableId, placeholder }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text color={'gray.500'}>{placeholder}</Text>
)

16
apps/builder/src/features/blocks/inputs/fileUpload/components/FileInputContent.tsx
View File

@ -1,3 +1,4 @@
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
import { Text } from '@chakra-ui/react'
import { FileInputOptions } from 'models'
@ -5,8 +6,13 @@ type Props = {
options: FileInputOptions
}
export const FileInputContent = ({ options: { isMultipleAllowed } }: Props) => (
<Text noOfLines={1} pr="6">
Collect {isMultipleAllowed ? 'files' : 'file'}
</Text>
)
export const FileInputContent = ({
options: { isMultipleAllowed, variableId },
}: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text noOfLines={1} pr="6">
Collect {isMultipleAllowed ? 'files' : 'file'}
</Text>
)

11
apps/builder/src/features/blocks/inputs/number/components/NumberNodeContent.tsx
View File

@ -1,11 +1,16 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { NumberInputBlock } from 'models'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
type Props = {
variableId?: string
placeholder: NumberInputBlock['options']['labels']['placeholder']
}
export const NumberNodeContent = ({ placeholder }: Props) => (
<Text color={'gray.500'}>{placeholder}</Text>
)
export const NumberNodeContent = ({ variableId, placeholder }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text color={'gray.500'}>{placeholder}</Text>
)

11
apps/builder/src/features/blocks/inputs/phone/components/PhoneNodeContent.tsx
View File

@ -1,11 +1,16 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { PhoneNumberInputOptions } from 'models'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
type Props = {
variableId?: string
placeholder: PhoneNumberInputOptions['labels']['placeholder']
}
export const PhoneNodeContent = ({ placeholder }: Props) => (
<Text color={'gray.500'}>{placeholder}</Text>
)
export const PhoneNodeContent = ({ variableId, placeholder }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text color={'gray.500'}>{placeholder}</Text>
)

17
apps/builder/src/features/blocks/inputs/rating/components/RatingInputContent.tsx
View File

@ -1,13 +1,18 @@
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
import { Text } from '@chakra-ui/react'
import { RatingInputBlock } from 'models'
type Props = {
variableId?: string
block: RatingInputBlock
}
export const RatingInputContent = ({ block }: Props) => (
<Text noOfLines={1} pr="6">
Rate from {block.options.buttonType === 'Icons' ? 1 : 0} to{' '}
{block.options.length}
</Text>
)
export const RatingInputContent = ({ variableId, block }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text noOfLines={1} pr="6">
Rate from {block.options.buttonType === 'Icons' ? 1 : 0} to{' '}
{block.options.length}
</Text>
)

10
apps/builder/src/features/blocks/inputs/rating/rating.spec.ts
View File

@ -33,9 +33,9 @@ test('options should work', async ({ page }) => {
await page.click('text=Preview')
await expect(page.locator(`text=Send`)).toBeHidden()
await page.locator(`text=8`).click()
await page.getByRole('button', { name: '8' }).click()
await page.locator(`text=Send`).click()
await expect(page.locator(`text=8`)).toBeVisible()
await expect(page.getByTestId('guest-bubble')).toHaveText('8')
await page.click('text=Rate from 0 to 10')
await page.click('text="10"')
await page.click('text="5"')
@ -47,10 +47,8 @@ test('options should work', async ({ page }) => {
await page.fill('[placeholder="Not likely at all"]', 'Not likely at all')
await page.fill('[placeholder="Extremely likely"]', 'Extremely likely')
await page.click('text="Restart"')
await expect(page.locator(`text=8`)).toBeHidden()
await expect(page.locator(`text=4`)).toBeHidden()
await expect(page.locator(`text=Not likely at all`)).toBeVisible()
await expect(page.locator(`text=Extremely likely`)).toBeVisible()
await page.locator(`svg >> nth=4`).click()
await expect(page.locator(`text=5`)).toBeVisible()
await page.locator('typebot-standard').locator(`svg >> nth=4`).click()
await expect(page.locator('typebot-standard').locator(`text=5`)).toBeVisible()
})

25
apps/builder/src/features/blocks/inputs/textInput/components/TextInputNodeContent.tsx
View File

@ -1,14 +1,29 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { TextInputOptions } from 'models'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
type Props = {
placeholder: TextInputOptions['labels']['placeholder']
isLong: TextInputOptions['isLong']
variableId?: string
}
export const TextInputNodeContent = ({ placeholder, isLong }: Props) => (
<Text color={'gray.500'} h={isLong ? '100px' : 'auto'}>
{placeholder}
</Text>
)
export const TextInputNodeContent = ({
placeholder,
isLong,
variableId,
}: Props) => {
if (variableId)
return (
<WithVariableContent
variableId={variableId}
h={isLong ? '100px' : 'auto'}
/>
)
return (
<Text color={'gray.500'} h={isLong ? '100px' : 'auto'}>
{placeholder}
</Text>
)
}

11
apps/builder/src/features/blocks/inputs/url/components/UrlNodeContent.tsx
View File

@ -1,11 +1,16 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { UrlInputOptions } from 'models'
import { WithVariableContent } from '@/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent'
type Props = {
variableId?: string
placeholder: UrlInputOptions['labels']['placeholder']
}
export const UrlNodeContent = ({ placeholder }: Props) => (
<Text color={'gray.500'}>{placeholder}</Text>
)
export const UrlNodeContent = ({ placeholder, variableId }: Props) =>
variableId ? (
<WithVariableContent variableId={variableId} />
) : (
<Text color={'gray.500'}>{placeholder}</Text>
)

72
apps/builder/src/features/blocks/integrations/openai/components/createChatCompletion/ChatCompletionMessageItem.tsx
View File

@ -1,36 +1,88 @@
import { DropdownList } from '@/components/DropdownList'
import { TextInput } from '@/components/inputs'
import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'
import { TableListItemProps } from '@/components/TableList'
import { Stack } from '@chakra-ui/react'
import { Variable } from 'models'
import {
chatCompletionMessageCustomRoles,
chatCompletionMessageRoles,
ChatCompletionOpenAIOptions,
} from 'models/features/blocks/integrations/openai'
type Props = TableListItemProps<ChatCompletionOpenAIOptions['messages'][number]>
const roles = [
...chatCompletionMessageCustomRoles,
...chatCompletionMessageRoles,
]
export const ChatCompletionMessageItem = ({ item, onItemChange }: Props) => {
const changeRole = (role: (typeof chatCompletionMessageRoles)[number]) => {
onItemChange({ ...item, role })
const changeRole = (role: (typeof roles)[number]) => {
onItemChange({
...item,
role,
content: undefined,
})
}
const changeContent = (content: string) => {
const changeSingleMessageContent = (content: string) => {
if (item.role === 'Messages sequence ✨') return
onItemChange({ ...item, content })
}
const changeAssistantVariableId = (
variable: Pick<Variable, 'id'> | undefined
) => {
if (item.role !== 'Messages sequence ✨') return
onItemChange({
...item,
content: {
...item.content,
assistantMessagesVariableId: variable?.id,
},
})
}
const changeUserVariableId = (variable: Pick<Variable, 'id'> | undefined) => {
if (item.role !== 'Messages sequence ✨') return
onItemChange({
...item,
content: {
...item.content,
userMessagesVariableId: variable?.id,
},
})
}
return (
<Stack p="4" rounded="md" flex="1" borderWidth="1px">
<DropdownList
currentItem={item.role}
items={chatCompletionMessageRoles}
items={roles}
onItemSelect={changeRole}
placeholder="Select role"
/>
<TextInput
defaultValue={item.content}
onChange={changeContent}
placeholder="Content"
placeholder="Select type"
/>
{item.role === 'Messages sequence ✨' ? (
<>
<VariableSearchInput
initialVariableId={item.content?.assistantMessagesVariableId}
onSelectVariable={changeAssistantVariableId}
placeholder="Assistant messages variable"
/>
<VariableSearchInput
initialVariableId={item.content?.userMessagesVariableId}
onSelectVariable={changeUserVariableId}
placeholder="User messages variable"
/>
</>
) : (
<TextInput
defaultValue={item.content}
onChange={changeSingleMessageContent}
placeholder="Content"
/>
)}
</Stack>
)
}

20
apps/builder/src/features/blocks/integrations/openai/components/createChatCompletion/OpenAIChatCompletionSettings.tsx
View File

@ -61,11 +61,6 @@ export const OpenAIChatCompletionSettings = ({
</TextLink>{' '}
to better understand the available options.
</Text>
<DropdownList
currentItem={options.model}
items={chatCompletionModels}
onItemSelect={updateModel}
/>
<Accordion allowToggle allowMultiple>
<AccordionItem>
<AccordionButton>
@ -85,6 +80,21 @@ export const OpenAIChatCompletionSettings = ({
/>
</AccordionPanel>
</AccordionItem>
<AccordionItem>
<AccordionButton>
<Text w="full" textAlign="left">
Advanced settings
</Text>
<AccordionIcon />
</AccordionButton>
<AccordionPanel>
<DropdownList
currentItem={options.model}
items={chatCompletionModels}
onItemSelect={updateModel}
/>
</AccordionPanel>
</AccordionItem>
<AccordionItem>
<AccordionButton>
<Text w="full" textAlign="left">

4
apps/builder/src/features/blocks/integrations/openai/openai.spec.ts
View File

@ -27,11 +27,11 @@ test('should be configurable', async ({ page }) => {
await page.getByRole('button', { name: 'Select task' }).click()
await page.getByRole('menuitem', { name: 'Create chat completion' }).click()
await page.getByRole('button', { name: 'Messages' }).click()
await page.getByRole('button', { name: 'Select role' }).click()
await page.getByRole('button', { name: 'Select type' }).click()
await page.getByRole('menuitem', { name: 'system' }).click()
await page.getByPlaceholder('Content').first().fill('You are a helpful bot')
await page.getByRole('button', { name: 'Add message' }).nth(1).click()
await page.getByRole('button', { name: 'Select role' }).click()
await page.getByRole('button', { name: 'Select type' }).click()
await page.getByRole('menuitem', { name: 'assistant' }).click()
await page.getByPlaceholder('Content').nth(1).fill('Hi there!')
await page.getByRole('button', { name: 'Save answer' }).click()

44
apps/builder/src/features/graph/components/Nodes/BlockNode/BlockNodeContent/BlockNodeContent.tsx
View File

@ -24,7 +24,6 @@ import { WebhookContent } from '@/features/blocks/integrations/webhook'
import { ChatwootBlockNodeLabel } from '@/features/blocks/integrations/chatwoot'
import { RedirectNodeContent } from '@/features/blocks/logic/redirect'
import { PabblyConnectContent } from '@/features/blocks/integrations/pabbly'
import { WithVariableContent } from './WithVariableContent'
import { PaymentInputContent } from '@/features/blocks/inputs/payment'
import { RatingInputContent } from '@/features/blocks/inputs/rating'
import { FileInputContent } from '@/features/blocks/inputs/fileUpload'
@ -33,7 +32,6 @@ import { GoogleSheetsNodeContent } from '@/features/blocks/integrations/googleSh
import { GoogleAnalyticsNodeContent } from '@/features/blocks/integrations/googleAnalytics/components/GoogleAnalyticsNodeContent'
import { ZapierContent } from '@/features/blocks/integrations/zapier'
import { SendEmailContent } from '@/features/blocks/integrations/sendEmail'
import { isInputBlock, isChoiceInput } from 'utils'
import { MakeComContent } from '@/features/blocks/integrations/makeCom'
import { AudioBubbleNode } from '@/features/blocks/bubbles/audio'
import { WaitNodeContent } from '@/features/blocks/logic/wait/components/WaitNodeContent'
@ -47,14 +45,6 @@ type Props = {
indices: BlockIndices
}
export const BlockNodeContent = ({ block, indices }: Props): JSX.Element => {
if (
isInputBlock(block) &&
!isChoiceInput(block) &&
block.options.variableId
) {
return <WithVariableContent block={block} />
}
switch (block.type) {
case BubbleBlockType.TEXT: {
return <TextBubbleContent block={block} />
@ -74,6 +64,7 @@ export const BlockNodeContent = ({ block, indices }: Props): JSX.Element => {
case InputBlockType.TEXT: {
return (
<TextInputNodeContent
variableId={block.options.variableId}
placeholder={block.options.labels.placeholder}
isLong={block.options.isLong}
/>
@ -81,31 +72,52 @@ export const BlockNodeContent = ({ block, indices }: Props): JSX.Element => {
}
case InputBlockType.NUMBER: {
return (
<NumberNodeContent placeholder={block.options.labels.placeholder} />
<NumberNodeContent
placeholder={block.options.labels.placeholder}
variableId={block.options.variableId}
/>
)
}
case InputBlockType.EMAIL: {
return (
<EmailInputNodeContent placeholder={block.options.labels.placeholder} />
<EmailInputNodeContent
placeholder={block.options.labels.placeholder}
variableId={block.options.variableId}
/>
)
}
case InputBlockType.URL: {
return <UrlNodeContent placeholder={block.options.labels.placeholder} />
return (
<UrlNodeContent
placeholder={block.options.labels.placeholder}
variableId={block.options.variableId}
/>
)
}
case InputBlockType.CHOICE: {
return <ButtonsBlockNode block={block} indices={indices} />
}
case InputBlockType.PHONE: {
return <PhoneNodeContent placeholder={block.options.labels.placeholder} />
return (
<PhoneNodeContent
placeholder={block.options.labels.placeholder}
variableId={block.options.variableId}
/>
)
}
case InputBlockType.DATE: {
return <DateNodeContent />
return <DateNodeContent variableId={block.options.variableId} />
}
case InputBlockType.PAYMENT: {
return <PaymentInputContent block={block} />
}
case InputBlockType.RATING: {
return <RatingInputContent block={block} />
return (
<RatingInputContent
block={block}
variableId={block.options.variableId}
/>
)
}
case InputBlockType.FILE: {
return <FileInputContent options={block.options} />

15
apps/builder/src/features/graph/components/Nodes/BlockNode/BlockNodeContent/WithVariableContent.tsx
View File

@ -1,21 +1,18 @@
import { InputBlock } from 'models'
import { chakra, Text } from '@chakra-ui/react'
import { chakra, Text, TextProps } from '@chakra-ui/react'
import React from 'react'
import { useTypebot } from '@/features/editor'
import { byId } from 'utils'
type Props = {
block: InputBlock
}
variableId: string
} & TextProps
export const WithVariableContent = ({ block }: Props) => {
export const WithVariableContent = ({ variableId, ...props }: Props) => {
const { typebot } = useTypebot()
const variableName = typebot?.variables.find(
byId(block.options.variableId)
)?.name
const variableName = typebot?.variables.find(byId(variableId))?.name
return (
<Text w="calc(100% - 25px)">
<Text w="calc(100% - 25px)" {...props}>
Collect{' '}
<chakra.span
bgColor="orange.400"

2
apps/builder/src/features/graph/components/Nodes/GroupNode/GroupNode.tsx
View File

@ -233,7 +233,7 @@ const NonMemoizedDraggableGroupNode = ({
display: 'block',
position: 'absolute',
top: '10px',
width: '100px',
width: '50px',
}
: undefined
}

1
apps/builder/src/features/variables/components/VariablesButton.tsx
View File

@ -48,6 +48,7 @@ export const VariablesButton = ({ onSelectVariable, ...props }: Props) => {
<Portal containerRef={parentModalRef}>
<PopoverContent w="full" ref={popoverRef}>
<VariableSearchInput
initialVariableId={undefined}
onSelectVariable={(variable) => {
onClose()
if (variable) onSelectVariable(variable)

10
apps/docs/docs/editor/blocks/integrations/openai.md
View File

@ -3,7 +3,15 @@
With the OpenAI block, you can create a chat completion based on your user queries and display the answer back to your typebot.
<img
src="/img/blocks/integrations/openai.png"
src="/img/blocks/integrations/openai/overview.png"
width="600"
alt="OpenAI block"
/>
This integration comes with a convenient message type called **Messages sequence ✨**. It allows you to directly pass a sequence of saved assistant / user messages:
<img
src="/img/blocks/integrations/openai/messages-sequence.png"
width="600"
alt="OpenAI messages sequence"
/>

73
apps/docs/openapi/chat/_spec_.json
View File

@ -2957,27 +2957,62 @@
"messages": {
"type": "array",
"items": {
"type": "object",
"properties": {
"id": {
"type": "string"
"anyOf": [
{
"type": "object",
"properties": {
"id": {
"type": "string"
},
"role": {
"type": "string",
"enum": [
"system",
"user",
"assistant"
]
},
"content": {
"type": "string"
}
},
"required": [
"id"
],
"additionalProperties": false
},
"role": {
"type": "string",
"enum": [
"system",
"user",
"assistant"
]
},
"content": {
"type": "string"
{
"type": "object",
"properties": {
"id": {
"type": "string"
},
"role": {
"type": "string",
"enum": [
"Messages sequence ✨"
]
},
"content": {
"type": "object",
"properties": {
"assistantMessagesVariableId": {
"type": "string"
},
"userMessagesVariableId": {
"type": "string"
}
},
"additionalProperties": false
}
},
"required": [
"id",
"role"
],
"additionalProperties": false
}
},
"required": [
"id"
],
"additionalProperties": false
]
}
},
"responseMapping": {

BIN
apps/docs/static/img/blocks/integrations/openai/messages-sequence.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 181 KiB

0
apps/docs/static/img/blocks/integrations/openai.png → apps/docs/static/img/blocks/integrations/openai/overview.png vendored
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 108 KiB

After

Width:  |  Height:  |  Size: 108 KiB

185
apps/viewer/src/features/blocks/integrations/openai/createChatCompletionOpenAI.ts
View File

@ -1,7 +1,14 @@
import { ExecuteIntegrationResponse } from '@/features/chat/types'
import { saveErrorLog } from '@/features/logs/api'
import { transformStringVariablesToList } from '@/features/variables/transformVariablesToList'
import { parseVariables, updateVariables } from '@/features/variables/utils'
import prisma from '@/lib/prisma'
import { SessionState, VariableWithUnknowValue } from 'models'
import {
SessionState,
Variable,
VariableWithUnknowValue,
VariableWithValue,
} from 'models'
import {
ChatCompletionOpenAIOptions,
OpenAICredentials,
@ -20,6 +27,7 @@ export const createChatCompletionOpenAI = async (
const {
typebot: { variables },
} = state
let newSessionState = state
if (!options.credentialsId) return { outgoingEdgeId }
const credentials = await prisma.credentials.findUnique({
where: {
@ -34,52 +42,147 @@ export const createChatCompletionOpenAI = async (
const configuration = new Configuration({
apiKey,
})
const { variablesTransformedToList, messages } = parseMessages(variables)(
options.messages
)
if (variablesTransformedToList.length > 0)
newSessionState = await updateVariables(state)(variablesTransformedToList)
const openai = new OpenAIApi(configuration)
const {
data: { choices, usage },
} = await openai.createChatCompletion({
model: options.model,
messages: options.messages
.map((message) => ({
role: message.role,
content: parseVariables(variables)(message.content),
}))
.filter(
(message) => isNotEmpty(message.role) && isNotEmpty(message.content)
) as ChatCompletionRequestMessage[],
})
const messageContent = choices[0].message?.content
const totalTokens = usage?.total_tokens
if (!messageContent) {
return { outgoingEdgeId }
}
const newVariables = options.responseMapping.reduce<
VariableWithUnknowValue[]
>((newVariables, mapping) => {
const existingVariable = variables.find(byId(mapping.variableId))
if (!existingVariable) return newVariables
if (mapping.valueToExtract === 'Message content') {
newVariables.push({
...existingVariable,
value: messageContent,
})
try {
const {
data: { choices, usage },
} = await openai.createChatCompletion({
model: options.model,
messages,
})
const messageContent = choices[0].message?.content
const totalTokens = usage?.total_tokens
if (!messageContent) {
return { outgoingEdgeId, newSessionState }
}
if (mapping.valueToExtract === 'Total tokens' && isDefined(totalTokens)) {
newVariables.push({
...existingVariable,
value: totalTokens,
})
const newVariables = options.responseMapping.reduce<
VariableWithUnknowValue[]
>((newVariables, mapping) => {
const existingVariable = variables.find(byId(mapping.variableId))
if (!existingVariable) return newVariables
if (mapping.valueToExtract === 'Message content') {
newVariables.push({
...existingVariable,
value: Array.isArray(existingVariable.value)
? existingVariable.value.concat(messageContent)
: messageContent,
})
}
if (mapping.valueToExtract === 'Total tokens' && isDefined(totalTokens)) {
newVariables.push({
...existingVariable,
value: totalTokens,
})
}
return newVariables
}, [])
if (newVariables.length > 0) {
newSessionState = await updateVariables(newSessionState)(newVariables)
return {
outgoingEdgeId,
newSessionState,
}
}
return newVariables
}, [])
if (newVariables.length > 0) {
const newSessionState = await updateVariables(state)(newVariables)
return {
outgoingEdgeId,
newSessionState,
}
}
return {
outgoingEdgeId,
} catch (err) {
const log = {
status: 'error',
description: 'OpenAI block returned error',
details: JSON.stringify(err, null, 2).substring(0, 1000),
}
state.result &&
(await saveErrorLog({
resultId: state.result.id,
message: log.description,
details: log.details,
}))
return {
outgoingEdgeId,
logs: [log],
newSessionState,
}
}
}
const parseMessages =
(variables: Variable[]) =>
(
messages: ChatCompletionOpenAIOptions['messages']
): {
variablesTransformedToList: VariableWithValue[]
messages: ChatCompletionRequestMessage[]
} => {
const variablesTransformedToList: VariableWithValue[] = []
const parsedMessages = messages
.flatMap((message) => {
if (!message.role) return
if (message.role === 'Messages sequence ✨') {
if (
!message.content?.assistantMessagesVariableId ||
!message.content?.userMessagesVariableId
)
return
variablesTransformedToList.push(
...transformStringVariablesToList(variables)([
message.content.assistantMessagesVariableId,
message.content.userMessagesVariableId,
])
)
const updatedVariables = variables.map((variable) => {
const variableTransformedToList = variablesTransformedToList.find(
byId(variable.id)
)
if (variableTransformedToList) return variableTransformedToList
return variable
})
const userMessages = (updatedVariables.find(
(variable) =>
variable.id === message.content?.userMessagesVariableId
)?.value ?? []) as string[]
const assistantMessages = (updatedVariables.find(
(variable) =>
variable.id === message.content?.assistantMessagesVariableId
)?.value ?? []) as string[]
if (userMessages.length > assistantMessages.length)
return userMessages.flatMap((userMessage, index) => [
{
role: 'user',
content: userMessage,
},
{ role: 'assistant', content: assistantMessages[index] },
]) satisfies ChatCompletionRequestMessage[]
else {
return assistantMessages.flatMap((assistantMessage, index) => [
{ role: 'assistant', content: assistantMessage },
{
role: 'user',
content: userMessages[index],
},
]) satisfies ChatCompletionRequestMessage[]
}
}
return {
role: message.role,
content: parseVariables(variables)(message.content),
} satisfies ChatCompletionRequestMessage
})
.filter(
(message) => isNotEmpty(message?.role) && isNotEmpty(message?.content)
) as ChatCompletionRequestMessage[]
return {
variablesTransformedToList,
messages: parsedMessages,
}
}

7
apps/viewer/src/features/chat/api/utils/continueBotFlow.ts
View File

@ -103,7 +103,12 @@ const saveVariableValueIfAny =
if (!foundVariable) return state
const newSessionState = await updateVariables(state)([
{ ...foundVariable, value: reply },
{
...foundVariable,
value: Array.isArray(foundVariable.value)
? foundVariable.value.concat(reply)
: reply,
},
])
return newSessionState

15
apps/viewer/src/features/chat/api/utils/executeGroup.ts
View File

@ -124,15 +124,12 @@ const computeRuntimeOptions =
const getPrefilledInputValue =
(variables: SessionState['typebot']['variables']) => (block: InputBlock) => {
return (
variables
.find(
(variable) =>
variable.id === block.options.variableId &&
isDefined(variable.value)
)
?.value?.toString() ?? undefined
)
const variableValue = variables.find(
(variable) =>
variable.id === block.options.variableId && isDefined(variable.value)
)?.value
if (!variableValue || Array.isArray(variableValue)) return
return variableValue
}
const parseBubbleBlock =

26
apps/viewer/src/features/variables/transformVariablesToList.ts Normal file
View File

@ -0,0 +1,26 @@
import { Variable, VariableWithValue } from 'models'
import { isNotDefined } from 'utils'
export const transformStringVariablesToList =
(variables: Variable[]) =>
(variableIds: string[]): VariableWithValue[] => {
const newVariables = variables.reduce<VariableWithValue[]>(
(variables, variable) => {
if (
!variableIds.includes(variable.id) ||
isNotDefined(variable.value) ||
typeof variable.value !== 'string'
)
return variables
return [
...variables,
{
...variable,
value: [variable.value],
},
]
},
[]
)
return newVariables
}

19
packages/models/features/blocks/integrations/openai.ts
View File

@ -15,6 +15,10 @@ export const chatCompletionMessageRoles = [
'assistant',
] as const
export const chatCompletionMessageCustomRoles = [
'Messages sequence ✨',
] as const
export const chatCompletionResponseValues = [
'Message content',
'Total tokens',
@ -36,11 +40,24 @@ const chatCompletionMessageSchema = z.object({
content: z.string().optional(),
})
const chatCompletionCustomMessageSchema = z.object({
id: z.string(),
role: z.enum(chatCompletionMessageCustomRoles),
content: z
.object({
assistantMessagesVariableId: z.string().optional(),
userMessagesVariableId: z.string().optional(),
})
.optional(),
})
const chatCompletionOptionsSchema = z
.object({
task: z.literal(openAITasks[0]),
model: z.enum(chatCompletionModels),
messages: z.array(chatCompletionMessageSchema),
messages: z.array(
z.union([chatCompletionMessageSchema, chatCompletionCustomMessageSchema])
),
responseMapping: z.array(
z.object({
id: z.string(),