').prependTo(this.$element());
+ }
+ }
+
_renderAttachmentsElement(): void {
const { attachments, isDeleted } = this.option();
@@ -132,6 +155,19 @@ class MessageBubble extends Widget {
}
}
+ _renderToolCalls(): void {
+ const { toolCalls, toolCallOptions } = this.option();
+
+ if (!this._$toolCalls) {
+ return;
+ }
+
+ this._createComponent(this._$toolCalls, ToolCallView, {
+ toolCalls,
+ expandAll: toolCallOptions?.expandAll,
+ });
+ }
+
_renderAttachments(): void {
const {
attachments,
@@ -163,10 +199,17 @@ class MessageBubble extends Widget {
const { name, value } = args;
switch (name) {
+ case 'isDeleted':
+ this._updateMessageData(name, value);
+ this._updateContent();
+ this._renderToolCallsElement();
+ this._renderToolCalls();
+ this._renderAttachmentsElement();
+ this._renderAttachments();
+ break;
case 'text':
case 'src':
case 'alt':
- case 'isDeleted':
this._updateMessageData(name, value);
this._updateContent();
this._renderAttachmentsElement();
@@ -179,10 +222,17 @@ class MessageBubble extends Widget {
break;
case 'template':
this._updateContent();
+ this._renderToolCallsElement();
+ this._renderToolCalls();
break;
case 'isEdited':
this._updateMessageData(name, value);
break;
+ case 'toolCalls':
+ case 'toolCallOptions':
+ this._renderToolCallsElement();
+ this._renderToolCalls();
+ break;
case 'onAttachmentDownloadClick':
case 'attachments':
this._renderAttachmentsElement();
diff --git a/packages/devextreme/js/__internal/ui/chat/messagegroup.ts b/packages/devextreme/js/__internal/ui/chat/messagegroup.ts
index d4bef516f829..6bb828e278ce 100644
--- a/packages/devextreme/js/__internal/ui/chat/messagegroup.ts
+++ b/packages/devextreme/js/__internal/ui/chat/messagegroup.ts
@@ -6,7 +6,7 @@ import $ from '@js/core/renderer';
import dateSerialization from '@js/core/utils/date_serialization';
import { isDate, isDefined } from '@js/core/utils/type';
import type {
- AttachmentDownloadClickEvent, ImageMessage, Message, TextMessage,
+ AttachmentDownloadClickEvent, ImageMessage, Message, TextMessage, ToolCallOptions,
} from '@js/ui/chat';
import type { WidgetOptions } from '@js/ui/widget/ui.widget';
import type { OptionChanged } from '@ts/core/widget/types';
@@ -42,6 +42,7 @@ export interface Properties extends WidgetOptions {
showMessageTimestamp: boolean;
messageTimestampFormat?: Format;
messageTemplate?: MessageTemplate;
+ toolCallOptions?: ToolCallOptions;
onAttachmentDownloadClick?: (e: AttachmentDownloadClickEvent) => void;
}
@@ -123,14 +124,18 @@ class MessageGroup extends Widget {
}
_getMessageBubbleOptions(message: Message): MessageBubbleProperties {
- const { messageTemplate, onAttachmentDownloadClick } = this.option();
+ const { messageTemplate, toolCallOptions, onAttachmentDownloadClick } = this.option();
- const { isDeleted, type, attachments } = message;
+ const {
+ isDeleted, type, attachments, toolCalls,
+ } = message;
const options: MessageBubbleProperties = {
isDeleted,
type,
attachments,
+ toolCalls,
+ toolCallOptions,
onAttachmentDownloadClick,
};
@@ -313,6 +318,7 @@ class MessageGroup extends Widget {
case 'showMessageTimestamp':
case 'messageTemplate':
case 'messageTimestampFormat':
+ case 'toolCallOptions':
case 'onAttachmentDownloadClick':
this._invalidate();
break;
diff --git a/packages/devextreme/js/__internal/ui/chat/messagelist.ts b/packages/devextreme/js/__internal/ui/chat/messagelist.ts
index b4635624f17b..ca743849deda 100644
--- a/packages/devextreme/js/__internal/ui/chat/messagelist.ts
+++ b/packages/devextreme/js/__internal/ui/chat/messagelist.ts
@@ -14,7 +14,7 @@ import { getHeight } from '@js/core/utils/size';
import { isDate, isDefined } from '@js/core/utils/type';
import type { DxEvent } from '@js/events';
import type {
- AttachmentDownloadClickEvent, Message, TextMessage, User,
+ AttachmentDownloadClickEvent, Message, TextMessage, ToolCallOptions, User,
} from '@js/ui/chat';
import type { Item as ContextMenuItem } from '@js/ui/context_menu';
import type dxContextMenu from '@js/ui/context_menu';
@@ -104,6 +104,7 @@ export interface Properties extends WidgetOptions {
showAvatar: boolean;
showUserName: boolean;
showMessageTimestamp: boolean;
+ toolCallOptions?: ToolCallOptions;
onAttachmentDownloadClick?: (e: AttachmentDownloadClickEvent) => void;
onMessageEditingStart?: (e: MessageEditingEvent) => () => void;
onMessageDeleting?: (e: MessageDeletingEvent) => void;
@@ -278,6 +279,7 @@ class MessageList extends Widget {
showMessageTimestamp,
messageTimestampFormat,
messageTemplate,
+ toolCallOptions,
onAttachmentDownloadClick,
} = this.option();
@@ -291,6 +293,7 @@ class MessageList extends Widget {
showMessageTimestamp,
messageTimestampFormat,
messageTemplate,
+ toolCallOptions,
onAttachmentDownloadClick,
});
}
@@ -850,6 +853,7 @@ class MessageList extends Widget {
case 'emptyViewTemplate':
case 'dayHeaderFormat':
case 'messageTimestampFormat':
+ case 'toolCallOptions':
case 'onAttachmentDownloadClick':
this._invalidate();
break;
diff --git a/packages/devextreme/js/__internal/ui/chat/tool_call_view/tool_call_view.ts b/packages/devextreme/js/__internal/ui/chat/tool_call_view/tool_call_view.ts
new file mode 100644
index 000000000000..dcae6fd3aa8c
--- /dev/null
+++ b/packages/devextreme/js/__internal/ui/chat/tool_call_view/tool_call_view.ts
@@ -0,0 +1,297 @@
+import { name as clickEventName } from '@js/common/core/events/click';
+import eventsEngine from '@js/common/core/events/core/events_engine';
+import { addNamespace } from '@js/common/core/events/utils';
+import messageLocalization from '@js/common/core/localization/message';
+import type { dxElementWrapper } from '@js/core/renderer';
+import $ from '@js/core/renderer';
+import { noop } from '@js/core/utils/common';
+import { isString } from '@js/core/utils/type';
+import type { Item as AccordionItem } from '@js/ui/accordion';
+import type { ButtonType } from '@js/ui/button';
+import type { ToolCall } from '@js/ui/chat';
+import { ICON_CLASS } from '@ts/core/utils/icon';
+import type { DOMComponentProperties } from '@ts/core/widget/dom_component';
+import DOMComponent from '@ts/core/widget/dom_component';
+import type { OptionChanged } from '@ts/core/widget/types';
+import Accordion from '@ts/ui/accordion';
+import TextArea from '@ts/ui/text_area';
+
+export interface ToolCallViewProperties extends DOMComponentProperties {
+ toolCalls?: ToolCall[];
+ expandAll?: boolean;
+}
+
+interface FieldConfig {
+ label: string;
+ value: string;
+ maxHeight: number;
+ isError?: boolean;
+}
+
+interface CopyButtonState {
+ icon: string;
+ hint: string;
+ type: ButtonType;
+}
+
+export const CHAT_TOOL_CALL_VIEW_CLASS = 'dx-chat-tool-call-view';
+export const CHAT_TOOL_CALL_HEADER_CLASS = 'dx-chat-tool-call-header';
+export const CHAT_TOOL_CALL_HEADER_TEXT_CLASS = 'dx-chat-tool-call-header-text';
+export const CHAT_TOOL_CALL_TITLE_CLASS = 'dx-chat-tool-call-title';
+export const CHAT_TOOL_CALL_ICON_CLASS = `${ICON_CLASS}-toolbox`;
+export const CHAT_TOOL_CALL_NAME_CLASS = 'dx-chat-tool-call-name';
+export const CHAT_TOOL_CALL_ERROR_BADGE_CLASS = 'dx-chat-tool-call-error-badge';
+export const CHAT_TOOL_CALL_CONTENT_CLASS = 'dx-chat-tool-call-content';
+export const CHAT_TOOL_CALL_FIELD_CLASS = 'dx-chat-tool-call-field';
+export const CHAT_TOOL_CALL_FIELD_LABEL_CLASS = 'dx-chat-tool-call-field-label';
+export const CHAT_TOOL_CALL_FIELD_ERROR_CLASS = 'dx-chat-tool-call-field-error';
+
+export const COPY_BUTTON_NAME = 'copy';
+export const COPIED_STATE_DURATION = 2000;
+const ARGUMENTS_MAX_HEIGHT = 320;
+const RESULT_MAX_HEIGHT = 240;
+const FIELD_CLICK_EVENT_NAME = addNamespace(clickEventName, 'dxChatToolCallView');
+
+const formatValue = (value: unknown): string => (Array.isArray(value)
+ ? `[${value.map(formatValue).join(', ')}]`
+ : JSON.stringify(value));
+
+const formatArguments = (args: ToolCall['arguments'] = {}): string => Object.entries(args)
+ .map(([key, value]) => `${key}: ${formatValue(value)}`)
+ .join(', ');
+
+const formatResult = (result: unknown): string => {
+ if (result === undefined) {
+ return '';
+ }
+
+ return isString(result) ? result : JSON.stringify(result, null, 2);
+};
+
+const formatErrorCount = (errorCount: number): string => (errorCount === 1
+ ? messageLocalization.format('dxChat-toolCallsSingleErrorText')
+ : messageLocalization.format('dxChat-toolCallsMultipleErrorsText', errorCount));
+
+class ToolCallView extends DOMComponent {
+ _getDefaultOptions(): ToolCallViewProperties {
+ return {
+ ...super._getDefaultOptions(),
+ toolCalls: [],
+ expandAll: false,
+ };
+ }
+
+ _initMarkup(): void {
+ this.$element().addClass(CHAT_TOOL_CALL_VIEW_CLASS);
+
+ super._initMarkup();
+
+ this._renderToolCalls();
+ }
+
+ _renderToolCalls(): void {
+ const { toolCalls = [], expandAll = false } = this.option();
+
+ if (!toolCalls.length) {
+ return;
+ }
+
+ if (toolCalls.length > 1) {
+ this._renderHeader(toolCalls);
+ }
+
+ const items = toolCalls.map((toolCall): AccordionItem => ({
+ titleTemplate: (): Element => this._createTitle(toolCall),
+ template: (_data, _index, element): Element => {
+ const $content = this._createContent(element);
+
+ this._renderToolCallFields($content, toolCall);
+
+ return $content.get(0);
+ },
+ }));
+ const selectedItems = items.filter((_item, index) => toolCalls[index].expanded ?? expandAll);
+
+ this._createComponent($('
').appendTo(this.$element()), Accordion, {
+ items,
+ collapsible: true,
+ multiple: true,
+ selectedItems,
+ });
+ }
+
+ _renderHeader(toolCalls: ToolCall[]): void {
+ const $header = $('
')
+ .addClass(CHAT_TOOL_CALL_HEADER_CLASS)
+ .appendTo(this.$element());
+
+ $('
')
+ .addClass(CHAT_TOOL_CALL_HEADER_TEXT_CLASS)
+ .text(messageLocalization.format('dxChat-toolCallsTitle', toolCalls.length))
+ .appendTo($header);
+
+ const errorCount = toolCalls.filter(({ status }) => status === 'error').length;
+
+ if (errorCount) {
+ this._createErrorBadge(formatErrorCount(errorCount)).appendTo($header);
+ }
+ }
+
+ _createTitle(toolCall: ToolCall): Element {
+ const { name, status } = toolCall;
+ const $title = $('
').addClass(CHAT_TOOL_CALL_TITLE_CLASS);
+
+ $('
')
+ .addClass(ICON_CLASS)
+ .addClass(CHAT_TOOL_CALL_ICON_CLASS)
+ .appendTo($title);
+
+ $('
')
+ .addClass(CHAT_TOOL_CALL_NAME_CLASS)
+ .text(name)
+ .attr('title', name)
+ .appendTo($title);
+
+ if (status === 'error') {
+ this._createErrorBadge(messageLocalization.format('dxChat-toolCallErrorText')).appendTo($title);
+ }
+
+ return $title.get(0);
+ }
+
+ _createErrorBadge(text: string): dxElementWrapper {
+ return $('
')
+ .addClass(CHAT_TOOL_CALL_ERROR_BADGE_CLASS)
+ .text(text);
+ }
+
+ _createContent(container: Element): dxElementWrapper {
+ return $('
')
+ .addClass(CHAT_TOOL_CALL_CONTENT_CLASS)
+ .appendTo(container);
+ }
+
+ _renderToolCallFields($container: dxElementWrapper, toolCall: ToolCall): void {
+ const argumentsText = formatArguments(toolCall.arguments);
+ const resultText = formatResult(toolCall.result);
+
+ if (argumentsText) {
+ this._renderField($container, {
+ label: messageLocalization.format('dxChat-toolCallArgumentsLabel'),
+ value: argumentsText,
+ maxHeight: ARGUMENTS_MAX_HEIGHT,
+ });
+ }
+
+ if (resultText) {
+ this._renderField($container, {
+ label: messageLocalization.format('dxChat-toolCallResultLabel'),
+ value: resultText,
+ maxHeight: RESULT_MAX_HEIGHT,
+ isError: toolCall.status === 'error',
+ });
+ }
+ }
+
+ _renderField($container: dxElementWrapper, config: FieldConfig): void {
+ const {
+ label, value, maxHeight, isError = false,
+ } = config;
+
+ const $field = $('
')
+ .addClass(CHAT_TOOL_CALL_FIELD_CLASS)
+ .toggleClass(CHAT_TOOL_CALL_FIELD_ERROR_CLASS, isError)
+ .appendTo($container);
+
+ $('
')
+ .addClass(CHAT_TOOL_CALL_FIELD_LABEL_CLASS)
+ .text(label)
+ .appendTo($field);
+
+ const $editor = $('
').appendTo($field);
+
+ const copyState: CopyButtonState = {
+ icon: 'copy',
+ hint: messageLocalization.format('dxChat-copyButtonLabel'),
+ type: 'normal',
+ };
+ const copiedState: CopyButtonState = {
+ icon: 'check',
+ hint: messageLocalization.format('dxChat-copiedButtonLabel'),
+ type: 'success',
+ };
+
+ const textArea = this._createComponent($editor, TextArea, {
+ value,
+ readOnly: true,
+ stylingMode: 'outlined',
+ autoResizeEnabled: true,
+ maxHeight,
+ hoverStateEnabled: false,
+ focusStateEnabled: false,
+ inputAttr: { 'aria-label': label },
+ buttons: [{
+ name: COPY_BUTTON_NAME,
+ location: 'after',
+ options: {
+ ...copyState,
+ elementAttr: { 'aria-label': copyState.hint },
+ stylingMode: 'text',
+ disabled: false,
+ },
+ }],
+ });
+ const copyButton = textArea.getButton(COPY_BUTTON_NAME);
+ const copiedStateTimer: { id?: ReturnType } = {};
+
+ const setCopyButtonState = (state: CopyButtonState): void => {
+ copyButton?.option({
+ ...state,
+ elementAttr: { 'aria-label': state.hint },
+ });
+ };
+
+ const copyValue = (): void => {
+ navigator.clipboard?.writeText(value)
+ .then(() => {
+ setCopyButtonState(copiedState);
+
+ clearTimeout(copiedStateTimer.id);
+ // eslint-disable-next-line no-restricted-globals
+ copiedStateTimer.id = setTimeout(() => {
+ setCopyButtonState(copyState);
+ }, COPIED_STATE_DURATION);
+ })
+ .catch(noop);
+ };
+
+ copyButton?.option('onClick', copyValue);
+
+ textArea.on('disposing', () => {
+ clearTimeout(copiedStateTimer.id);
+ });
+
+ eventsEngine.on($editor, FIELD_CLICK_EVENT_NAME, copyValue);
+ }
+
+ _clean(): void {
+ this.$element().empty();
+
+ super._clean();
+ }
+
+ _optionChanged(args: OptionChanged): void {
+ const { name } = args;
+
+ switch (name) {
+ case 'toolCalls':
+ case 'expandAll':
+ this._invalidate();
+ break;
+ default:
+ super._optionChanged(args);
+ }
+ }
+}
+
+export default ToolCallView;
diff --git a/packages/devextreme/js/localization/messages/ar.json b/packages/devextreme/js/localization/messages/ar.json
index 85e543638afd..f7b11a7c87e6 100644
--- a/packages/devextreme/js/localization/messages/ar.json
+++ b/packages/devextreme/js/localization/messages/ar.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "قائمة الملفات",
"dxChat-downloadButtonLabel": "تنزيل الملف {0}",
"dxChat-fileLimitReachedWarning": "لقد حددت عددًا كبيرًا جدًا من الملفات. حدد {0} ملفات كحد أقصى وأعد المحاولة.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "أحمر",
"dxColorView-ariaGreen": "أخضر",
diff --git a/packages/devextreme/js/localization/messages/bg.json b/packages/devextreme/js/localization/messages/bg.json
index 2c592eb99684..28dfbb1cf166 100644
--- a/packages/devextreme/js/localization/messages/bg.json
+++ b/packages/devextreme/js/localization/messages/bg.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Списък с файлове",
"dxChat-downloadButtonLabel": "Изтегляне на файл {0}",
"dxChat-fileLimitReachedWarning": "Избрахте прекалено много файлове. Изберете не повече от {0} файла и опитайте отново.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Червен",
"dxColorView-ariaGreen": "Зелен",
diff --git a/packages/devextreme/js/localization/messages/ca.json b/packages/devextreme/js/localization/messages/ca.json
index eab201bbff3c..a4bdadcc5396 100644
--- a/packages/devextreme/js/localization/messages/ca.json
+++ b/packages/devextreme/js/localization/messages/ca.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Llista de fitxers",
"dxChat-downloadButtonLabel": "Descarrega el fitxer {0}",
"dxChat-fileLimitReachedWarning": "Heu seleccionat massa fitxers. Seleccioneu-ne com a màxim {0} i torneu-ho a provar.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Vermell",
"dxColorView-ariaGreen": "Verd",
diff --git a/packages/devextreme/js/localization/messages/cs.json b/packages/devextreme/js/localization/messages/cs.json
index ca19654c7b24..5609e565f558 100644
--- a/packages/devextreme/js/localization/messages/cs.json
+++ b/packages/devextreme/js/localization/messages/cs.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Seznam souborů",
"dxChat-downloadButtonLabel": "Stáhnout soubor {0}",
"dxChat-fileLimitReachedWarning": "Vybrali jste příliš mnoho souborů. Vyberte nejvýše {0} souborů a opakujte akci.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Červená",
"dxColorView-ariaGreen": "Zelená",
diff --git a/packages/devextreme/js/localization/messages/da.json b/packages/devextreme/js/localization/messages/da.json
index c5989fb232c1..1465f4e61ec6 100644
--- a/packages/devextreme/js/localization/messages/da.json
+++ b/packages/devextreme/js/localization/messages/da.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Filliste",
"dxChat-downloadButtonLabel": "Download fil {0}",
"dxChat-fileLimitReachedWarning": "Du valgte for mange filer. Vælg højst {0} filer og prøv igen.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rød",
"dxColorView-ariaGreen": "Grøn",
diff --git a/packages/devextreme/js/localization/messages/de.json b/packages/devextreme/js/localization/messages/de.json
index c83c12789c94..d8756e0bb903 100644
--- a/packages/devextreme/js/localization/messages/de.json
+++ b/packages/devextreme/js/localization/messages/de.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Dateiliste",
"dxChat-downloadButtonLabel": "Datei {0} herunterladen",
"dxChat-fileLimitReachedWarning": "Sie haben zu viele Dateien ausgewählt. Wählen Sie höchstens {0} Dateien aus und versuchen Sie es erneut.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rot",
"dxColorView-ariaGreen": "Grün",
diff --git a/packages/devextreme/js/localization/messages/el.json b/packages/devextreme/js/localization/messages/el.json
index f3f3352632cc..9cb5ccf81f12 100644
--- a/packages/devextreme/js/localization/messages/el.json
+++ b/packages/devextreme/js/localization/messages/el.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Λίστα αρχείων",
"dxChat-downloadButtonLabel": "Λήψη αρχείου {0}",
"dxChat-fileLimitReachedWarning": "Επιλέξατε πολλά αρχεία. Επιλέξτε έως {0} αρχεία και δοκιμάστε ξανά.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Κόκκινο",
"dxColorView-ariaGreen": "Πράσινο",
diff --git a/packages/devextreme/js/localization/messages/en.json b/packages/devextreme/js/localization/messages/en.json
index 2c52bead08c9..7cf8fb5d46f3 100644
--- a/packages/devextreme/js/localization/messages/en.json
+++ b/packages/devextreme/js/localization/messages/en.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "File list",
"dxChat-downloadButtonLabel": "Download file {0}",
"dxChat-fileLimitReachedWarning": "You selected too many files. Select no more than {0} files and retry.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Red",
"dxColorView-ariaGreen": "Green",
diff --git a/packages/devextreme/js/localization/messages/es.json b/packages/devextreme/js/localization/messages/es.json
index c2afe3faaebd..5db135a98051 100644
--- a/packages/devextreme/js/localization/messages/es.json
+++ b/packages/devextreme/js/localization/messages/es.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista de archivos",
"dxChat-downloadButtonLabel": "Descargar archivo {0}",
"dxChat-fileLimitReachedWarning": "Ha seleccionado demasiados archivos. Seleccione no más de {0} archivos y reintente.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rojo",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/fa.json b/packages/devextreme/js/localization/messages/fa.json
index 707b01fa7fbe..ff817e3fdb89 100644
--- a/packages/devextreme/js/localization/messages/fa.json
+++ b/packages/devextreme/js/localization/messages/fa.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "لیست فایل",
"dxChat-downloadButtonLabel": "دانلود فایل {0}",
"dxChat-fileLimitReachedWarning": "تعداد فایلهای انتخاب شده زیاد است. حداکثر {0} فایل انتخاب کنید و دوباره امتحان کنید.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "قرمز",
"dxColorView-ariaGreen": "سبز",
diff --git a/packages/devextreme/js/localization/messages/fi.json b/packages/devextreme/js/localization/messages/fi.json
index c06a696c0653..2a8482466c27 100644
--- a/packages/devextreme/js/localization/messages/fi.json
+++ b/packages/devextreme/js/localization/messages/fi.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Tiedostoluettelo",
"dxChat-downloadButtonLabel": "Lataa tiedosto {0}",
"dxChat-fileLimitReachedWarning": "Valitsit liian monta tiedostoa. Valitse enintään {0} tiedostoa ja yritä uudelleen.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Punainen",
"dxColorView-ariaGreen": "Vihreä",
diff --git a/packages/devextreme/js/localization/messages/fr.json b/packages/devextreme/js/localization/messages/fr.json
index 333c53c5f317..9eacdca362f2 100644
--- a/packages/devextreme/js/localization/messages/fr.json
+++ b/packages/devextreme/js/localization/messages/fr.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Liste des fichiers",
"dxChat-downloadButtonLabel": "Télécharger le fichier {0}",
"dxChat-fileLimitReachedWarning": "Vous avez sélectionné trop de fichiers. Sélectionnez au maximum {0} fichiers et réessayez.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rouge",
"dxColorView-ariaGreen": "Vert",
diff --git a/packages/devextreme/js/localization/messages/hi.json b/packages/devextreme/js/localization/messages/hi.json
index 7e6d68262c36..daa25df60f0b 100644
--- a/packages/devextreme/js/localization/messages/hi.json
+++ b/packages/devextreme/js/localization/messages/hi.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "फ़ाइल सूची",
"dxChat-downloadButtonLabel": "फ़ाइल डाउनलोड करें {0}",
"dxChat-fileLimitReachedWarning": "आपने बहुत सारी फ़ाइलें चुनीं. {0} से अधिक फ़ाइलें न चुनें और पुनः प्रयास करें।",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "लाल",
"dxColorView-ariaGreen": "हरा",
diff --git a/packages/devextreme/js/localization/messages/hu.json b/packages/devextreme/js/localization/messages/hu.json
index d02011086aff..7c5a2400a290 100644
--- a/packages/devextreme/js/localization/messages/hu.json
+++ b/packages/devextreme/js/localization/messages/hu.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Fájllista",
"dxChat-downloadButtonLabel": "{0} fájl letöltése",
"dxChat-fileLimitReachedWarning": "Túl sok fájlt választott. Válasszon legfeljebb {0} fájlt, és próbálja újra.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Piros",
"dxColorView-ariaGreen": "Zöld",
diff --git a/packages/devextreme/js/localization/messages/it.json b/packages/devextreme/js/localization/messages/it.json
index 71f471dd89c5..945844973fb3 100644
--- a/packages/devextreme/js/localization/messages/it.json
+++ b/packages/devextreme/js/localization/messages/it.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista file",
"dxChat-downloadButtonLabel": "Scarica file {0}",
"dxChat-fileLimitReachedWarning": "Hai selezionato troppi file. Seleziona al massimo {0} file e riprova.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rosso",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/ja.json b/packages/devextreme/js/localization/messages/ja.json
index 2ea88450230a..33a84e3f8a61 100644
--- a/packages/devextreme/js/localization/messages/ja.json
+++ b/packages/devextreme/js/localization/messages/ja.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "ファイル リスト",
"dxChat-downloadButtonLabel": "ファイル {0} をダウンロード",
"dxChat-fileLimitReachedWarning": "ファイルが多すぎます。{0} 件以下のファイルを選択してやり直してください。",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "赤",
"dxColorView-ariaGreen": "緑",
diff --git a/packages/devextreme/js/localization/messages/ko.json b/packages/devextreme/js/localization/messages/ko.json
index daa2bbfa3c8a..4df01a3dcdad 100644
--- a/packages/devextreme/js/localization/messages/ko.json
+++ b/packages/devextreme/js/localization/messages/ko.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "파일 목록",
"dxChat-downloadButtonLabel": "파일 {0} 다운로드",
"dxChat-fileLimitReachedWarning": "파일을 너무 많이 선택했습니다. {0}개 이하의 파일을 선택하고 다시 시도하세요.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "빨강",
"dxColorView-ariaGreen": "초록",
diff --git a/packages/devextreme/js/localization/messages/lt.json b/packages/devextreme/js/localization/messages/lt.json
index 8e87c3a3e888..c99ed4b9504e 100644
--- a/packages/devextreme/js/localization/messages/lt.json
+++ b/packages/devextreme/js/localization/messages/lt.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Failų sąrašas",
"dxChat-downloadButtonLabel": "Atsisiųsti failą {0}",
"dxChat-fileLimitReachedWarning": "Pasirinkote per daug failų. Pasirinkite ne daugiau kaip {0} failų ir bandykite dar kartą.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Raudona",
"dxColorView-ariaGreen": "Žalia",
diff --git a/packages/devextreme/js/localization/messages/lv.json b/packages/devextreme/js/localization/messages/lv.json
index ed7ee7f7fb79..3b7796b6ab9b 100644
--- a/packages/devextreme/js/localization/messages/lv.json
+++ b/packages/devextreme/js/localization/messages/lv.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Failu saraksts",
"dxChat-downloadButtonLabel": "Lejupielādēt failu {0}",
"dxChat-fileLimitReachedWarning": "Jūs izvēlējāties pārāk daudz failu. Izvēlieties ne vairāk kā {0} failus un mēģinājiet vēlreiz.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Sarkans",
"dxColorView-ariaGreen": "Zaļš",
diff --git a/packages/devextreme/js/localization/messages/nb.json b/packages/devextreme/js/localization/messages/nb.json
index 1d44b60b895d..a263b05a2f93 100644
--- a/packages/devextreme/js/localization/messages/nb.json
+++ b/packages/devextreme/js/localization/messages/nb.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Filliste",
"dxChat-downloadButtonLabel": "Last ned fil {0}",
"dxChat-fileLimitReachedWarning": "Du valgte for mange filer. Velg ikke mer enn {0} filer og prøv igjen.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rød",
"dxColorView-ariaGreen": "Grønn",
diff --git a/packages/devextreme/js/localization/messages/nl.json b/packages/devextreme/js/localization/messages/nl.json
index 705874ff0bb7..f0eafc332f4d 100644
--- a/packages/devextreme/js/localization/messages/nl.json
+++ b/packages/devextreme/js/localization/messages/nl.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Bestandslijst",
"dxChat-downloadButtonLabel": "Bestand {0} downloaden",
"dxChat-fileLimitReachedWarning": "U heeft te veel bestanden geselecteerd. Selecteer maximaal {0} bestanden en probeer opnieuw.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rood",
"dxColorView-ariaGreen": "Groen",
diff --git a/packages/devextreme/js/localization/messages/pl.json b/packages/devextreme/js/localization/messages/pl.json
index a84c0ad03c99..922e64fa7a18 100644
--- a/packages/devextreme/js/localization/messages/pl.json
+++ b/packages/devextreme/js/localization/messages/pl.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista plików",
"dxChat-downloadButtonLabel": "Pobierz plik {0}",
"dxChat-fileLimitReachedWarning": "Wybrano zbyt wiele plików. Wybierz maksymalnie {0} plików i spróbuj ponownie.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "czerwony",
"dxColorView-ariaGreen": "zielony",
diff --git a/packages/devextreme/js/localization/messages/pt-BR.json b/packages/devextreme/js/localization/messages/pt-BR.json
index 2133cf60263e..536fa2531499 100644
--- a/packages/devextreme/js/localization/messages/pt-BR.json
+++ b/packages/devextreme/js/localization/messages/pt-BR.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista de arquivos",
"dxChat-downloadButtonLabel": "Baixar arquivo {0}",
"dxChat-fileLimitReachedWarning": "Você selecionou arquivos demais. Selecione no máximo {0} arquivos e tente novamente.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Vermelho",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/pt-PT.json b/packages/devextreme/js/localization/messages/pt-PT.json
index 5eb4b0c08b7b..bcaf434c3a7d 100644
--- a/packages/devextreme/js/localization/messages/pt-PT.json
+++ b/packages/devextreme/js/localization/messages/pt-PT.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista de ficheiros",
"dxChat-downloadButtonLabel": "Transferir ficheiro {0}",
"dxChat-fileLimitReachedWarning": "Selecionou demasiados ficheiros. Selecione, no máximo, {0} ficheiros e tente novamente.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Vermelho",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/pt.json b/packages/devextreme/js/localization/messages/pt.json
index 061f5c59aea5..b5fe5be240fb 100644
--- a/packages/devextreme/js/localization/messages/pt.json
+++ b/packages/devextreme/js/localization/messages/pt.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Lista de arquivos",
"dxChat-downloadButtonLabel": "Baixar arquivo {0}",
"dxChat-fileLimitReachedWarning": "Você selecionou arquivos demais. Selecione no máximo {0} arquivos e tente novamente.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Vermelho",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/ro.json b/packages/devextreme/js/localization/messages/ro.json
index bca83c34a9b6..4dd6fe0084de 100644
--- a/packages/devextreme/js/localization/messages/ro.json
+++ b/packages/devextreme/js/localization/messages/ro.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Listă fișiere",
"dxChat-downloadButtonLabel": "Descărcați fișierul {0}",
"dxChat-fileLimitReachedWarning": "Ați selectat prea multe fișiere. Selectați cel mult {0} fișiere și încercați din nou.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Roșu",
"dxColorView-ariaGreen": "Verde",
diff --git a/packages/devextreme/js/localization/messages/ru.json b/packages/devextreme/js/localization/messages/ru.json
index 6405bc5e41ab..26636a92e373 100644
--- a/packages/devextreme/js/localization/messages/ru.json
+++ b/packages/devextreme/js/localization/messages/ru.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Список файлов",
"dxChat-downloadButtonLabel": "Скачать файл {0}",
"dxChat-fileLimitReachedWarning": "Выбрано слишком много файлов. Выберите не более {0} файлов и повторите попытку.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Красный",
"dxColorView-ariaGreen": "Зеленый",
diff --git a/packages/devextreme/js/localization/messages/sl.json b/packages/devextreme/js/localization/messages/sl.json
index 8ea1c40a8026..ea78aad1ee25 100644
--- a/packages/devextreme/js/localization/messages/sl.json
+++ b/packages/devextreme/js/localization/messages/sl.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Seznam datotek",
"dxChat-downloadButtonLabel": "Prenesi datoteko {0}",
"dxChat-fileLimitReachedWarning": "Izbrali ste preveč datotek. Izberite največ {0} datotek in poskusite znova.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Rdeča",
"dxColorView-ariaGreen": "Zelena",
diff --git a/packages/devextreme/js/localization/messages/sv.json b/packages/devextreme/js/localization/messages/sv.json
index 5aafe586fbe7..8313feb00f67 100644
--- a/packages/devextreme/js/localization/messages/sv.json
+++ b/packages/devextreme/js/localization/messages/sv.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Fillista",
"dxChat-downloadButtonLabel": "Ladda ner fil {0}",
"dxChat-fileLimitReachedWarning": "Du valde för många filer. Välj högst {0} filer och försök igen.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Röd",
"dxColorView-ariaGreen": "Grön",
diff --git a/packages/devextreme/js/localization/messages/tr.json b/packages/devextreme/js/localization/messages/tr.json
index c7f6be4d4d2b..12c94e300b84 100644
--- a/packages/devextreme/js/localization/messages/tr.json
+++ b/packages/devextreme/js/localization/messages/tr.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Dosya listesi",
"dxChat-downloadButtonLabel": "{0} dosyasını indir",
"dxChat-fileLimitReachedWarning": "Çok fazla dosya seçtiniz. En fazla {0} dosya seçip tekrar deneyin.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Kırmızı",
"dxColorView-ariaGreen": "Yeşil",
diff --git a/packages/devextreme/js/localization/messages/uk.json b/packages/devextreme/js/localization/messages/uk.json
index 1c665ab796a9..73f1ae2023ae 100644
--- a/packages/devextreme/js/localization/messages/uk.json
+++ b/packages/devextreme/js/localization/messages/uk.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Список файлів",
"dxChat-downloadButtonLabel": "Завантажити файл {0}",
"dxChat-fileLimitReachedWarning": "Ви вибрали забагато файлів. Виберіть не більше {0} файлів і повторіть спробу.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Червоний",
"dxColorView-ariaGreen": "Зелений",
diff --git a/packages/devextreme/js/localization/messages/vi.json b/packages/devextreme/js/localization/messages/vi.json
index 9ee7e755fcad..2faa7f6e5eba 100644
--- a/packages/devextreme/js/localization/messages/vi.json
+++ b/packages/devextreme/js/localization/messages/vi.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "Danh sách tập tin",
"dxChat-downloadButtonLabel": "Tải xuống tập tin {0}",
"dxChat-fileLimitReachedWarning": "Bạn đã chọn quá nhiều tập tin. Chọn không quá {0} tập tin và thử lại.",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "Đỏ",
"dxColorView-ariaGreen": "Xanh lá",
diff --git a/packages/devextreme/js/localization/messages/zh-CN.json b/packages/devextreme/js/localization/messages/zh-CN.json
index ebafca4e1d3e..7822d2210c22 100644
--- a/packages/devextreme/js/localization/messages/zh-CN.json
+++ b/packages/devextreme/js/localization/messages/zh-CN.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "文件列表",
"dxChat-downloadButtonLabel": "下载文件 {0}",
"dxChat-fileLimitReachedWarning": "您选择的文件太多。请选择不超过 {0} 个文件后重试。",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "红色",
"dxColorView-ariaGreen": "绿色",
diff --git a/packages/devextreme/js/localization/messages/zh-Hans.json b/packages/devextreme/js/localization/messages/zh-Hans.json
index 4bc731c5ee5a..8f8f1e5ef8c0 100644
--- a/packages/devextreme/js/localization/messages/zh-Hans.json
+++ b/packages/devextreme/js/localization/messages/zh-Hans.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "文件列表",
"dxChat-downloadButtonLabel": "下载文件 {0}",
"dxChat-fileLimitReachedWarning": "您选择的文件太多。请选择不超过 {0} 个文件后重试。",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "红色",
"dxColorView-ariaGreen": "绿色",
diff --git a/packages/devextreme/js/localization/messages/zh-tw.json b/packages/devextreme/js/localization/messages/zh-tw.json
index d5377dd10953..076e53eb5c3c 100644
--- a/packages/devextreme/js/localization/messages/zh-tw.json
+++ b/packages/devextreme/js/localization/messages/zh-tw.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "檔案清單",
"dxChat-downloadButtonLabel": "下載檔案 {0}",
"dxChat-fileLimitReachedWarning": "您選擇的檔案過多。請選擇不超過 {0} 個檔案後重試。",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "紅色",
"dxColorView-ariaGreen": "綠色",
diff --git a/packages/devextreme/js/localization/messages/zh.json b/packages/devextreme/js/localization/messages/zh.json
index 18e073177317..716acabcf9f2 100644
--- a/packages/devextreme/js/localization/messages/zh.json
+++ b/packages/devextreme/js/localization/messages/zh.json
@@ -448,6 +448,14 @@
"dxChat-fileViewLabel": "文件列表",
"dxChat-downloadButtonLabel": "下载文件 {0}",
"dxChat-fileLimitReachedWarning": "您选择的文件太多。请选择不超过 {0} 个文件后重试。",
+ "dxChat-toolCallsTitle": "{0} tools",
+ "dxChat-toolCallsSingleErrorText": "1 Error",
+ "dxChat-toolCallsMultipleErrorsText": "{0} Errors",
+ "dxChat-toolCallArgumentsLabel": "Arguments",
+ "dxChat-toolCallResultLabel": "Result",
+ "dxChat-toolCallErrorText": "Error",
+ "dxChat-copyButtonLabel": "Copy",
+ "dxChat-copiedButtonLabel": "Copied",
"dxColorView-ariaRed": "红色",
"dxColorView-ariaGreen": "绿色",
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js
index f1374c9cfdf8..40ad637d2bb7 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.markup.tests.js
@@ -21,3 +21,4 @@ import './chatParts/editingPreview.markup.tests.js';
import './chatParts/chatTextArea.markup.tests.js';
import './chatParts/chat.markup.tests.js';
import './chatParts/fileView.markup.tests.js';
+import './chatParts/toolCallView.markup.tests.js';
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js
index 3f1520ae2c8c..fc4d630a1888 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chat.tests.js
@@ -21,3 +21,4 @@ import './chatParts/editingPreview.tests.js';
import './chatParts/chatTextArea.tests.js';
import './chatParts/chat.tests.js';
import './chatParts/fileView.tests.js';
+import './chatParts/toolCallView.tests.js';
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js
index 5a3cc0f7e316..326df5652b02 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.markup.tests.js
@@ -8,6 +8,14 @@ const CHAT_MESSAGELIST_CLASS = 'dx-chat-messagelist';
const CHAT_ALERTLIST_CLASS = 'dx-chat-alertlist';
const CHAT_MESSAGELIST_EMPTY_VIEW_CLASS = 'dx-chat-messagelist-empty-view';
const CHAT_TYPINGINDICATOR_CLASS = 'dx-chat-typingindicator';
+const CHAT_MESSAGEBUBBLE_CLASS = 'dx-chat-messagebubble';
+const CHAT_MESSAGEBUBBLE_CONTENT_CLASS = 'dx-chat-messagebubble-content';
+const CHAT_FILE_VIEW_CLASS = 'dx-chat-file-view';
+const CHAT_TOOL_CALL_VIEW_CLASS = 'dx-chat-tool-call-view';
+const CHAT_TOOL_CALL_HEADER_CLASS = 'dx-chat-tool-call-header';
+const CHAT_TOOL_CALL_NAME_CLASS = 'dx-chat-tool-call-name';
+const ACCORDION_CLASS = 'dx-accordion';
+const ACCORDION_ITEM_CLASS = 'dx-accordion-item';
const TEXTEDITOR_INPUT_CLASS = 'dx-texteditor-input';
const moduleConfig = {
@@ -60,6 +68,84 @@ QUnit.module('Chat', moduleConfig, () => {
});
});
+ QUnit.module('Tool calls', {
+ beforeEach() {
+ this.getBubbleChildren = () => this.$element.find(`.${CHAT_MESSAGEBUBBLE_CLASS}`).children();
+ this.getToolCallView = () => this.$element.find(`.${CHAT_TOOL_CALL_VIEW_CLASS}`);
+ this.getToolCallNames = () => this.$element
+ .find(`.${CHAT_TOOL_CALL_NAME_CLASS}`)
+ .map((_, element) => $(element).text())
+ .get();
+ },
+ }, () => {
+ QUnit.test('bubble of a message without tool calls should contain only the content element', function(assert) {
+ this.reinit({ items: [{ text: 'answer' }] });
+
+ const $children = this.getBubbleChildren();
+
+ assert.strictEqual($children.length, 1, 'bubble has one child');
+ assert.strictEqual($children.eq(0).hasClass(CHAT_MESSAGEBUBBLE_CONTENT_CLASS), true, 'the child is the content');
+ });
+
+ QUnit.test('bubble should contain the tool calls, the content and the attachments in this order', function(assert) {
+ this.reinit({
+ items: [{
+ text: 'answer',
+ toolCalls: [{ name: 'getWeather' }],
+ attachments: [{ name: 'report.pdf', size: 1024 }],
+ }],
+ });
+
+ const $children = this.getBubbleChildren();
+
+ assert.strictEqual($children.eq(0).hasClass(CHAT_TOOL_CALL_VIEW_CLASS), true, 'tool calls are first');
+ assert.strictEqual($children.eq(1).hasClass(CHAT_MESSAGEBUBBLE_CONTENT_CLASS), true, 'content is second');
+ assert.strictEqual($children.eq(2).hasClass(CHAT_FILE_VIEW_CLASS), true, 'attachments are third');
+ });
+
+ QUnit.test('should render one accordion without the header for a single tool call', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name: 'getWeather' }] }] });
+
+ const $view = this.getToolCallView();
+
+ assert.strictEqual($view.children(`.${ACCORDION_CLASS}`).length, 1, 'one accordion is rendered');
+ assert.deepEqual(this.getToolCallNames(), ['getWeather'], 'accordion has an item for the tool call');
+ assert.strictEqual($view.children(`.${CHAT_TOOL_CALL_HEADER_CLASS}`).length, 0, 'header is not rendered');
+ });
+
+ QUnit.test('should render the header above one accordion with an item for every tool call for several tool calls', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name: 'getWeather' }, { name: 'getCurrentTime' }] }] });
+
+ const $children = this.getToolCallView().children();
+
+ assert.strictEqual($children.length, 2, 'block has two children');
+ assert.strictEqual($children.eq(0).hasClass(CHAT_TOOL_CALL_HEADER_CLASS), true, 'header is first');
+ assert.strictEqual($children.eq(0).text(), '2 tools', 'header contains the count');
+ assert.strictEqual($children.eq(1).hasClass(ACCORDION_CLASS), true, 'accordion is second');
+ assert.strictEqual($children.eq(1).find(`.${ACCORDION_ITEM_CLASS}`).length, 2, 'accordion has an item for every tool call');
+ assert.deepEqual(this.getToolCallNames(), ['getWeather', 'getCurrentTime'], 'items are titled with the tool names');
+ });
+
+ QUnit.test('bubble of a message with tool calls and without text should contain the tool calls and the empty content', function(assert) {
+ this.reinit({ items: [{ toolCalls: [{ name: 'getWeather' }] }] });
+
+ const $children = this.getBubbleChildren();
+
+ assert.strictEqual($children.eq(0).hasClass(CHAT_TOOL_CALL_VIEW_CLASS), true, 'tool calls are rendered');
+ assert.strictEqual($children.eq(1).hasClass(CHAT_MESSAGEBUBBLE_CONTENT_CLASS), true, 'content follows the tool calls');
+ assert.strictEqual($children.eq(1).text(), '', 'content is empty');
+ });
+
+ QUnit.test('should render a tool call name as text', function(assert) {
+ const name = 'getWeather';
+
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name }] }] });
+
+ assert.deepEqual(this.getToolCallNames(), [name], 'name is rendered as text');
+ assert.strictEqual(this.getToolCallView().find('b').length, 0, 'name is not parsed as markup');
+ });
+ });
+
QUnit.module('Accessibility', () => {
[
{
diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js
index b778eccb8a15..41b4f38fddd2 100644
--- a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js
+++ b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/chat.tests.js
@@ -41,6 +41,16 @@ import { CHAT_CONFIRMATION_POPUP_WRAPPER_CLASS } from '__internal/ui/chat/confir
import { POPUP_CLASS } from '__internal/ui/popup/popup';
import { BUTTON_CLASS } from '__internal/ui/button/button';
import { CHAT_FILE_CLASS } from '__internal/ui/chat/file_view/file';
+import {
+ CHAT_TOOL_CALL_ERROR_BADGE_CLASS,
+ CHAT_TOOL_CALL_FIELD_CLASS,
+ CHAT_TOOL_CALL_FIELD_ERROR_CLASS,
+ CHAT_TOOL_CALL_FIELD_LABEL_CLASS,
+ CHAT_TOOL_CALL_HEADER_CLASS,
+ CHAT_TOOL_CALL_HEADER_TEXT_CLASS,
+ CHAT_TOOL_CALL_NAME_CLASS,
+ CHAT_TOOL_CALL_VIEW_CLASS,
+} from '__internal/ui/chat/tool_call_view/tool_call_view';
import MessageBubble from '__internal/ui/chat/messagebubble';
import ChatTextArea, {
@@ -67,6 +77,10 @@ const CHAT_LAST_MESSAGEGROUP_ALIGNMENT_START_CLASS = 'dx-chat-last-messagegroup-
const CHAT_LAST_MESSAGEGROUP_ALIGNMENT_END_CLASS = 'dx-chat-last-messagegroup-alignment-end';
const TEXTEDITOR_INPUT_CLASS = 'dx-texteditor-input';
+const ACCORDION_CLASS = 'dx-accordion';
+const ACCORDION_ITEM_CLASS = 'dx-accordion-item';
+const ACCORDION_ITEM_OPENED_CLASS = 'dx-accordion-item-opened';
+const ACCORDION_ITEM_TITLE_CLASS = 'dx-accordion-item-title';
const RTL_CLASS = 'dx-rtl';
const ANIMATION_TIMEOUT = 250;
@@ -157,6 +171,26 @@ const moduleConfig = {
this.getSuggestionsElement = () => this.instance._suggestions._$element;
this.getSuggestionItems = () => this.$element.find(`.${BUTTON_GROUP_ITEM_CLASS}`);
this.getSuggestionButtonGroup = () => this.instance._suggestions._buttonGroup;
+ this.getToolCallView = () => this.$element.find(`.${CHAT_TOOL_CALL_VIEW_CLASS}`);
+ this.getToolCallNames = () => this.$element
+ .find(`.${CHAT_TOOL_CALL_NAME_CLASS}`)
+ .map((_, element) => $(element).text())
+ .get();
+ this.getToolCallTitles = () => this.$element.find(`.${CHAT_TOOL_CALL_VIEW_CLASS} .${ACCORDION_ITEM_TITLE_CLASS}`);
+ this.getOpenedToolCallIndexes = () => this.$element
+ .find(`.${CHAT_TOOL_CALL_VIEW_CLASS} .${ACCORDION_ITEM_CLASS}`)
+ .map((index, element) => ($(element).hasClass(ACCORDION_ITEM_OPENED_CLASS) ? index : null))
+ .get();
+ this.getToolCallHeaderText = () => this.$element.find(`.${CHAT_TOOL_CALL_HEADER_TEXT_CLASS}`).text();
+ this.getToolCallHeaderBadgeText = () => this.$element.find(`.${CHAT_TOOL_CALL_HEADER_CLASS} .${CHAT_TOOL_CALL_ERROR_BADGE_CLASS}`).text();
+ this.getToolCallFields = () => this.$element.find(`.${CHAT_TOOL_CALL_FIELD_CLASS}`);
+ this.getToolCallFieldLabels = () => this.getToolCallFields()
+ .find(`.${CHAT_TOOL_CALL_FIELD_LABEL_CLASS}`)
+ .map((_, element) => $(element).text())
+ .get();
+ this.getToolCallField = (label) => this.getToolCallFields()
+ .filter((_, element) => $(element).find(`.${CHAT_TOOL_CALL_FIELD_LABEL_CLASS}`).text() === label);
+ this.getToolCallFieldValue = (label) => this.getToolCallField(label).find(`.${TEXTEDITOR_INPUT_CLASS}`).val();
init();
},
@@ -663,6 +697,300 @@ QUnit.module('Chat', () => {
});
});
+ QUnit.module('Tool calls', () => {
+ const weatherCall = { name: 'getWeather', arguments: { city: 'London' }, result: '15°C', status: 'success' };
+ const currentTimeCall = { name: 'getCurrentTime', arguments: { locations: ['Barcelona'] }, result: '10:18' };
+ const stockPriceCall = { name: 'getStockPrice', arguments: { symbol: 'CNTS' }, result: 'Failed to execute the tool', status: 'error' };
+ const renderTemplate = (data, container) => {
+ $('').text(`text: ${data.message.text}`).appendTo(container);
+ };
+
+ QUnit.module('Rendering', () => {
+ QUnit.test('should render tool calls of messages passed in items', function(assert) {
+ this.reinit({
+ items: [
+ { text: 'question' },
+ { text: 'answer', toolCalls: [weatherCall, currentTimeCall] },
+ ],
+ });
+
+ const $bubbles = this.getBubbles();
+
+ assert.strictEqual($bubbles.eq(0).find(`.${CHAT_TOOL_CALL_VIEW_CLASS}`).length, 0, 'message without tool calls has none');
+ assert.deepEqual(this.getToolCallNames(), ['getWeather', 'getCurrentTime'], 'message with tool calls renders them');
+ });
+
+ QUnit.test('should render tool calls of a message added with renderMessage', function(assert) {
+ this.reinit({ items: [{ text: 'question' }] });
+
+ this.instance.renderMessage({ text: 'answer', toolCalls: [weatherCall] });
+
+ assert.deepEqual(this.getToolCallNames(), ['getWeather']);
+ });
+
+ QUnit.test('should render the header with the tool call count for several tool calls', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [weatherCall, currentTimeCall, stockPriceCall] }] });
+
+ assert.strictEqual(this.getToolCallHeaderText(), '3 tools');
+ });
+
+ QUnit.test('should not render tool calls for an empty toolCalls array', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [] }] });
+
+ assert.strictEqual(this.getBubblesContents().text(), 'answer', 'message is rendered');
+ assert.strictEqual(this.getToolCallView().length, 0, 'tool calls are not rendered');
+ });
+
+ QUnit.test('should not render tool calls of a deleted message', function(assert) {
+ this.reinit({ items: [{ text: 'answer', isDeleted: true, toolCalls: [weatherCall] }] });
+
+ assert.strictEqual(this.getBubblesContents().text(), 'This message was deleted', 'deleted message is rendered');
+ assert.strictEqual(this.getToolCallView().length, 0, 'tool calls are not rendered');
+ });
+ });
+
+ QUnit.module('Content', () => {
+ QUnit.test('should render the arguments and the result of a tool call', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ ...weatherCall, expanded: true }] }] });
+
+ assert.strictEqual(this.getToolCallFieldValue('Arguments'), 'city: "London"', 'arguments are rendered');
+ assert.strictEqual(this.getToolCallFieldValue('Result'), '15°C', 'result is rendered');
+ });
+
+ QUnit.test('should render only the result of a tool call without arguments', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name: 'getCurrentUtcTime', result: '09:18', expanded: true }] }] });
+
+ assert.deepEqual(this.getToolCallFieldLabels(), ['Result']);
+ });
+
+ QUnit.test('should render only the arguments of a tool call without a result', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name: 'getWeather', arguments: { city: 'London' }, expanded: true }] }] });
+
+ assert.deepEqual(this.getToolCallFieldLabels(), ['Arguments']);
+ });
+
+ QUnit.test('should render an object result as indented JSON', function(assert) {
+ this.reinit({ items: [{ text: 'answer', toolCalls: [{ name: 'getExchangeRate', result: { base: 'USD', rate: 0.92 }, expanded: true }] }] });
+
+ assert.strictEqual(this.getToolCallFieldValue('Result'), '{\n "base": "USD",\n "rate": 0.92\n}');
+ });
+
+ QUnit.test('should render the name, the arguments and the result as text', function(assert) {
+ const name = '