blsmedia/bot
2
0
Fork 0
Code Activity

⚡ (openai) Enable setVariable function in tools

Browse Source 
Closes #1178
This commit is contained in:
Baptiste Arnaud
2024-01-22 09:22:28 +01:00
parent b438c174c4
commit 42008f8c18
24 changed files with 258 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/builder/next.config.mjs
View File

@ -50,6 +50,7 @@ const nextConfig = {
if (nextRuntime === 'edge') {
config.resolve.alias['minio'] = false
config.resolve.alias['got'] = false
config.resolve.alias['qrcode'] = false
return config
}
// These packages are imports from the integrations definition files that can be ignored for the client.

3
apps/builder/src/features/blocks/logic/script/components/ScriptNodeContent.tsx
View File

@ -1,6 +1,7 @@
import React from 'react'
import { Text } from '@chakra-ui/react'
import { ScriptBlock } from '@typebot.io/schemas'
import { defaultScriptOptions } from '@typebot.io/schemas/features/blocks/logic/script/constants'
type Props = {
options: ScriptBlock['options']
@ -10,6 +11,6 @@ export const ScriptNodeContent = ({
options: { name, content } = {},
}: Props) => (
<Text color={content ? 'currentcolor' : 'gray.500'} noOfLines={1}>
{content ? `Run ${name}` : 'Configure...'}
{content ? `Run ${name ?? defaultScriptOptions.name}` : 'Configure...'}
</Text>
)

14
apps/builder/src/features/blocks/logic/script/components/ScriptSettings.tsx
View File

@ -4,6 +4,7 @@ import React from 'react'
import { TextInput } from '@/components/inputs'
import { ScriptBlock } from '@typebot.io/schemas'
import { defaultScriptOptions } from '@typebot.io/schemas/features/blocks/logic/script/constants'
import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'
type Props = {
options: ScriptBlock['options']
@ -13,9 +14,13 @@ type Props = {
export const ScriptSettings = ({ options, onOptionsChange }: Props) => {
const handleNameChange = (name: string) =>
onOptionsChange({ ...options, name })
const handleCodeChange = (content: string) =>
onOptionsChange({ ...options, content })
const updateClientExecution = (isExecutedOnClient: boolean) =>
onOptionsChange({ ...options, isExecutedOnClient })
return (
<Stack spacing={4}>
<TextInput
@ -31,6 +36,15 @@ export const ScriptSettings = ({ options, onOptionsChange }: Props) => {
lang="javascript"
onChange={handleCodeChange}
/>
<SwitchWithLabel
label="Execute on client?"
moreInfoContent="Check this if you need access to client variables like `window` or `document`."
initialValue={
options?.isExecutedOnClient ??
defaultScriptOptions.isExecutedOnClient
}
onCheckChange={updateClientExecution}
/>
</Stack>
</Stack>
)

10
apps/builder/src/features/blocks/logic/setVariable/components/SetVariableSettings.tsx
View File

@ -137,11 +137,6 @@ const SetVariableValue = ({
case undefined:
return (
<>
<CodeEditor
defaultValue={options?.expressionToEvaluate ?? ''}
onChange={updateExpression}
lang="javascript"
/>
<SwitchWithLabel
label="Execute on client?"
moreInfoContent="Check this if you need access to client-only variables like `window` or `document`."
@ -151,6 +146,11 @@ const SetVariableValue = ({
}
onCheckChange={updateClientExecution}
/>
<CodeEditor
defaultValue={options?.expressionToEvaluate ?? ''}
onChange={updateExpression}
lang="javascript"
/>
</>
)
case 'Map item with same index': {

4
apps/docs/editor/blocks/integrations/openai.mdx
View File

@ -43,7 +43,9 @@ A more useful example would be, of course, to call an API to get the weather of
<img src="/images/blocks/integrations/openai/tools.png" alt="OpenAI tools" />
</Frame>
As you can see, the code block expects the body of the Javascript function. You can use the `return` keyword to return values.
As you can see, the code block expects the body of the Javascript function. You should use the `return` keyword to return value to give back to OpenAI as the result of the function.
If you'd like to set variables directly in this code block, you can use the [`setVariable` function](../logic/script#setvariable-function).
## Ask assistant

20
apps/docs/editor/blocks/logic/script.mdx
View File

@ -3,9 +3,9 @@ title: Script block
icon: code
---
The "Script" block allows you to execute Javascript code. If you want to set a variable value with Javascript, use the [Set variable block](./set-variable) instead. You can't set a variable with the script block.
The "Script" block allows you to execute Javascript code.
**It doesn't allow you to create a custom visual block**
<Info>This block doesn't allow you to create a custom visual block</Info>
<Frame>
<img src="/images/blocks/logic/code.png" width="600" alt="Code block" />
@ -18,6 +18,22 @@ You need to write `console.log({{My variable}})` instead of `console.log("{{My v
</Info>
## `setVariable` function
If you want to set a variable value with Javascript, the [Set variable block](./set-variable) is more appropriate for most cases.
However, if you'd like to set variables with the script blocks, you can use the `setVariable` function in your script:
```js
if({{My variable}} === 'foo') {
setVariable('My variable', 'bar')
} else {
setVariable('My variable', 'other')
}
```
The `setVariable` function is only available in script executed on the server, so it won't work if the `Execute on client?` is checked.
## Examples
### Reload page

18
apps/docs/openapi/builder.json
View File

@ -371,6 +371,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -6580,6 +6583,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -11101,6 +11107,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -24814,6 +24823,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -28073,6 +28085,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -30882,6 +30897,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}

6
apps/docs/openapi/viewer.json
View File

@ -4527,6 +4527,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}
@ -8289,6 +8292,9 @@
"content": {
"type": "string"
},
"isExecutedOnClient": {
"type": "boolean"
},
"shouldExecuteInParentContext": {
"type": "boolean"
}

1
apps/viewer/next.config.mjs
View File

@ -50,6 +50,7 @@ const nextConfig = {
if (nextRuntime === 'edge') {
config.resolve.alias['minio'] = false
config.resolve.alias['got'] = false
config.resolve.alias['qrcode'] = false
return config
}
// These packages are imports from the integrations definition files that can be ignored for the client.

1
apps/viewer/src/app/api/integrations/openai/streamer/route.ts
View File

@ -134,6 +134,7 @@ export async function POST(req: Request) {
credentials.iv
)
const variables: ReadOnlyVariableStore = {
list: () => state.typebotsQueue[0].typebot.variables,
get: (id: string) => {
const variable = state.typebotsQueue[0].typebot.variables.find(
(variable) => variable.id === id

27
packages/bot-engine/blocks/logic/script/executeScript.ts
View File

@ -3,15 +3,38 @@ import { ScriptBlock, SessionState, Variable } from '@typebot.io/schemas'
import { extractVariablesFromText } from '@typebot.io/variables/extractVariablesFromText'
import { parseGuessedValueType } from '@typebot.io/variables/parseGuessedValueType'
import { parseVariables } from '@typebot.io/variables/parseVariables'
import { defaultScriptOptions } from '@typebot.io/schemas/features/blocks/logic/script/constants'
import { executeFunction } from '@typebot.io/variables/executeFunction'
import { updateVariablesInSession } from '@typebot.io/variables/updateVariablesInSession'
export const executeScript = (
export const executeScript = async (
state: SessionState,
block: ScriptBlock
): ExecuteLogicResponse => {
): Promise<ExecuteLogicResponse> => {
const { variables } = state.typebotsQueue[0].typebot
if (!block.options?.content || state.whatsApp)
return { outgoingEdgeId: block.outgoingEdgeId }
const isExecutedOnClient =
block.options.isExecutedOnClient ?? defaultScriptOptions.isExecutedOnClient
if (!isExecutedOnClient) {
const { newVariables, error } = await executeFunction({
variables,
body: block.options.content,
})
const newSessionState = newVariables
? updateVariablesInSession(state)(newVariables)
: state
return {
outgoingEdgeId: block.outgoingEdgeId,
logs: error ? [{ status: 'error', description: error }] : [],
newSessionState,
}
}
const scriptToExecute = parseScriptToExecuteClientSideAction(
variables,
block.options.content

1
packages/bot-engine/forge/executeForgedBlock.ts
View File

@ -101,6 +101,7 @@ export const executeForgedBlock = async (
newSessionState.typebotsQueue[0].typebot.variables,
params
)(text),
list: () => newSessionState.typebotsQueue[0].typebot.variables,
}
let logs: NonNullable<ContinueChatResponse['logs']> = []
const logsStore: LogsStore = {

2
packages/embeds/js/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@typebot.io/js",
"version": "0.2.34",
"version": "0.2.35",
"description": "Javascript library to display typebots on your website",
"type": "module",
"main": "dist/index.js",

3
packages/embeds/js/src/components/ConversationContainer/ConversationContainer.tsx
View File

@ -284,8 +284,7 @@ export const ConversationContainer = (props: Props) => {
hideAvatar={
!chatChunk.input &&
((chatChunks()[index() + 1]?.messages ?? 0).length > 0 ||
chatChunks()[index() + 1]?.streamingMessageId !== undefined ||
isSending())
chatChunks()[index() + 1]?.streamingMessageId !== undefined)
}
hasError={hasError() && index() === chatChunks().length - 1}
onNewBubbleDisplayed={handleNewBubbleDisplayed}

2
packages/embeds/nextjs/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@typebot.io/nextjs",
"version": "0.2.34",
"version": "0.2.35",
"description": "Convenient library to display typebots on your Next.js website",
"main": "dist/index.js",
"types": "dist/index.d.ts",

2
packages/embeds/react/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@typebot.io/react",
"version": "0.2.34",
"version": "0.2.35",
"description": "Convenient library to display typebots on your React app",
"main": "dist/index.js",
"types": "dist/index.d.ts",

20
packages/forge/blocks/openai/actions/askAssistant.tsx
View File

@ -3,6 +3,7 @@ import { isDefined, isEmpty } from '@typebot.io/lib'
import { auth } from '../auth'
import { ClientOptions, OpenAI } from 'openai'
import { baseOptions } from '../baseOptions'
import { executeFunction } from '@typebot.io/variables/executeFunction'
export const askAssistant = createAction({
auth,
@ -206,12 +207,17 @@ export const askAssistant = createAction({
if (!functionToExecute) return
const name = toolCall.function.name
if (!name) return
const func = AsyncFunction(
...Object.keys(parameters),
functionToExecute.code
)
const output = await func(...Object.values(parameters))
if (!name || !functionToExecute.code) return
const { output, newVariables } = await executeFunction({
variables: variables.list(),
body: functionToExecute.code,
args: parameters,
})
newVariables?.forEach((variable) => {
variables.set(variable.id, variable.value)
})
return {
tool_call_id: toolCall.id,
@ -262,5 +268,3 @@ export const askAssistant = createAction({
},
},
})
const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor

44
packages/forge/blocks/openai/actions/createChatCompletion.tsx
View File

@ -8,6 +8,7 @@ import { auth } from '../auth'
import { baseOptions } from '../baseOptions'
import { ChatCompletionTool } from 'openai/resources/chat/completions'
import { parseToolParameters } from '../helpers/parseToolParameters'
import { executeFunction } from '@typebot.io/variables/executeFunction'
const nativeMessageContentSchema = {
content: option.string.layout({
@ -213,17 +214,21 @@ export const createChatCompletion = createAction({
if (!name) continue
const toolDefinition = options.tools?.find((t) => t.name === name)
if (!toolDefinition?.code || !toolDefinition.parameters) continue
const func = AsyncFunction(
...toolDefinition.parameters?.map((p) => p.name),
toolDefinition.code
)
const content = await func(
...Object.values(JSON.parse(toolCall.function.arguments))
)
const toolArgs = toolCall.function?.arguments
? JSON.parse(toolCall.function?.arguments)
: undefined
if (!toolArgs) continue
const { output, newVariables } = await executeFunction({
variables: variables.list(),
args: toolArgs,
body: toolDefinition.code,
})
newVariables?.forEach((v) => variables.set(v.id, v.value))
messages.push({
tool_call_id: toolCall.id,
role: 'tool',
content,
content: output,
})
}
@ -304,18 +309,23 @@ export const createChatCompletion = createAction({
if (!name) continue
const toolDefinition = options.tools?.find((t) => t.name === name)
if (!toolDefinition?.code || !toolDefinition.parameters) continue
const func = AsyncFunction(
...toolDefinition.parameters?.map((p) => p.name),
toolDefinition.code
)
const content = await func(
...Object.values(JSON.parse(toolCall.func.arguments as any))
)
const { output } = await executeFunction({
variables: variables.list(),
args:
typeof toolCall.func.arguments === 'string'
? JSON.parse(toolCall.func.arguments)
: toolCall.func.arguments,
body: toolDefinition.code,
})
// TO-DO: enable once we're out of edge runtime.
// newVariables?.forEach((v) => variables.set(v.id, v.value))
const newMessages = appendToolCallMessage({
tool_call_id: toolCall.id,
function_name: toolCall.func.name,
tool_call_result: content,
tool_call_result: output,
})
return openai.chat.completions.create({
@ -334,5 +344,3 @@ export const createChatCompletion = createAction({
},
},
})
const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor

3
packages/forge/blocks/openai/package.json
View File

@ -15,6 +15,7 @@
"@typebot.io/tsconfig": "workspace:*",
"@types/react": "18.2.15",
"typescript": "5.3.2",
"@typebot.io/lib": "workspace:*"
"@typebot.io/lib": "workspace:*",
"@typebot.io/variables": "workspace:*"
}
}

5
packages/forge/core/types.ts
View File

@ -6,6 +6,11 @@ export type VariableStore = {
get: (variableId: string) => string | (string | null)[] | null | undefined
set: (variableId: string, value: unknown) => void
parse: (value: string) => string
list: () => {
id: string
name: string
value?: string | (string | null)[] | null | undefined
}[]
}
export type LogsStore = {

1
packages/schemas/features/blocks/logic/script/constants.ts
View File

@ -2,4 +2,5 @@ import { ScriptBlock } from './schema'
export const defaultScriptOptions = {
name: 'Script',
isExecutedOnClient: true,
} as const satisfies ScriptBlock['options']

1
packages/schemas/features/blocks/logic/script/schema.ts
View File

@ -5,6 +5,7 @@ import { LogicBlockType } from '../constants'
export const scriptOptionsSchema = z.object({
name: z.string().optional(),
content: z.string().optional(),
isExecutedOnClient: z.boolean().optional(),
shouldExecuteInParentContext: z.boolean().optional(),
})

109
packages/variables/executeFunction.ts Normal file
View File

@ -0,0 +1,109 @@
import { Variable } from '@typebot.io/schemas'
import { parseVariables } from './parseVariables'
import { extractVariablesFromText } from './extractVariablesFromText'
import { parseGuessedValueType } from './parseGuessedValueType'
import { isDefined } from '@typebot.io/lib'
import { defaultTimeout } from '@typebot.io/schemas/features/blocks/integrations/webhook/constants'
type Props = {
variables: Variable[]
body: string
args?: Record<string, unknown>
}
export const executeFunction = async ({
variables,
body,
args: initialArgs,
}: Props) => {
const parsedBody = parseVariables(variables, { fieldToParse: 'id' })(body)
const args = (
extractVariablesFromText(variables)(body).map((variable) => ({
id: variable.id,
value: parseGuessedValueType(variable.value),
})) as { id: string; value: unknown }[]
).concat(
initialArgs
? Object.entries(initialArgs).map(([id, value]) => ({ id, value }))
: []
)
const func = AsyncFunction(
...args.map(({ id }) => id),
'setVariable',
parsedBody
)
let updatedVariables: Record<string, any> = {}
const setVariable = (key: string, value: any) => {
updatedVariables[key] = value
}
const timeout = new Timeout()
try {
const output = await timeout.wrap(
func(...args.map(({ value }) => value), setVariable),
defaultTimeout * 1000
)
timeout.clear()
return {
output,
newVariables: Object.entries(updatedVariables)
.map(([name, value]) => {
const existingVariable = variables.find((v) => v.name === name)
if (!existingVariable) return
return {
id: existingVariable.id,
name: existingVariable.name,
value,
}
})
.filter(isDefined),
}
} catch (e) {
console.log('Error while executing script')
console.error(e)
return {
error:
typeof e === 'string'
? e
: e instanceof Error
? e.message
: JSON.stringify(e),
}
}
}
const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor
class Timeout {
private ids: NodeJS.Timeout[]
constructor() {
this.ids = []
}
private set = (delay: number) =>
new Promise((_, reject) => {
const id = setTimeout(() => {
reject(`Script ${defaultTimeout}s timeout reached`)
this.clear(id)
}, delay)
this.ids.push(id)
})
wrap = (promise: Promise<any>, delay: number) =>
Promise.race([promise, this.set(delay)])
clear = (...ids: NodeJS.Timeout[]) => {
this.ids = this.ids.filter((id) => {
if (ids.includes(id)) {
clearTimeout(id)
return false
}
return true
})
}
}

3
pnpm-lock.yaml generated
View File

@ -1224,6 +1224,9 @@ importers:
'@typebot.io/tsconfig':
specifier: workspace:*
version: link:../../../tsconfig
'@typebot.io/variables':
specifier: workspace:*
version: link:../../../variables
'@types/react':
specifier: 18.2.15
version: 18.2.15