quickblox-react-ui-kit 0.1.8 → 0.2.0

package/dist/Presentation/Views/Base/BaseViewModel.d.ts

@@ -28,4 +28,5 @@ export type FunctionTypeDialogEntityToDialogEntity = (entity: GroupDialogEntity)
 export type FunctionTypeDialogEntityToBoolean = (entity: GroupDialogEntity) => Promise<boolean>;
 export type FunctionTypeFileToFileEntity = (file: File) => Promise<FileEntity>;
 export type FunctionTypeJSXElement = () => JSX.Element;
-export type FunctionTypeChatMessagesToVoid = (lastMessage: string, messages: IChatMessage) => void;
+export type FunctionTypeFileWithContextToToVoid = (file: File, context: IChatMessage[]) => void;
+export type FunctionTypeStringWithContextToVoid = (value: string, context: IChatMessage[]) => void;

package/dist/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/AIWidget.d.ts

@@ -0,0 +1,8 @@
+import { FunctionTypeFileWithContextToToVoid, FunctionTypeJSXElement, FunctionTypeStringWithContextToVoid } from '../../../../../Views/Base/BaseViewModel';
+export interface AIWidget {
+    renderWidget: FunctionTypeJSXElement;
+    textToWidget: FunctionTypeStringWithContextToVoid;
+    fileToWidget: FunctionTypeFileWithContextToToVoid;
+    textToContent: string | undefined;
+    fileToContent: File | undefined;
+}

package/dist/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/ErrorMessageIcon.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+type ErrorDescription = {
+    title: string;
+    action: () => void;
+};
+type ErrorMessageIconProps = {
+    errorMessageText: string;
+    errorsDescriptions?: ErrorDescription[];
+};
+declare function ErrorMessageIcon({ errorMessageText, errorsDescriptions, }: ErrorMessageIconProps): JSX.Element;
+export default ErrorMessageIcon;

package/dist/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.d.ts

@@ -0,0 +1,9 @@
+import { AIWidget } from './AIWidget';
+interface MessageWidgetProps {
+    servername: string;
+    api: string;
+    port: string;
+    sessionToken: string;
+}
+export default function UseDefaultAIAssistAnswerWidgetWithProxy({ servername, api, port, sessionToken, }: MessageWidgetProps): AIWidget;
+export {};

package/dist/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultTextInputWidget.d.ts

@@ -0,0 +1,2 @@
+import { AIWidget } from './AIWidget';
+export default function useDefaultTextInputWidget(): AIWidget;

package/dist/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/useDefaultVoiceInputWidget.d.ts

@@ -0,0 +1,2 @@
+import { AIWidget } from './AIWidget';
+export default function useDefaultVoiceInputWidget(): AIWidget;

package/dist/Presentation/components/UI/Dialogs/MessagesView/ContextMenu.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type MenuItem = {
+    title: string;
+    action: () => void;
+};
+type ContextMenuProps = {
+    items?: MenuItem[];
+};
+declare function ContextMenu({ items }: ContextMenuProps): JSX.Element;
+export default ContextMenu;

package/dist/Presentation/components/UI/Dialogs/MessagesView/MessagesView.d.ts

@@ -2,8 +2,12 @@ import React from 'react';
 import './MessagesView.scss';
 import { FunctionTypeVoidToVoid } from '../../../../Views/Base/BaseViewModel';
 import UiKitTheme from '../../../../assets/UiKitTheme';
+import { AIWidget } from './AIWidgets/AIWidget';
 import { DialogsViewModel } from '../../../../Views/Dialogs/DialogViewModel';
 type HeaderDialogsMessagesProps = {
+    AIEditMessage?: AIWidget;
+    AITranslation?: AIWidget;
+    AIAnswerToMessage?: AIWidget;
     dialogsViewModel: DialogsViewModel;
     onDialogInformationHandler?: FunctionTypeVoidToVoid;
     maxWidthToResize?: string;

package/dist/Presentation/components/layouts/Desktop/QuickBloxUIKitDesktopLayout.d.ts

@@ -1,7 +1,16 @@
 import React from 'react';
 import UiKitTheme from '../../../assets/UiKitTheme';
+import { AIWidget } from '../../UI/Dialogs/MessagesView/AIWidgets/AIWidget';
+type AIWidgetPlaceHolder = {
+    enabled: boolean;
+    default: boolean;
+    AIWidget?: AIWidget;
+};
 type QuickBloxUIKitDesktopLayoutProps = {
     theme?: UiKitTheme;
+    AIEditMessage?: AIWidgetPlaceHolder;
+    AITranslation?: AIWidgetPlaceHolder;
+    AIAnswerToMessage?: AIWidgetPlaceHolder;
 };
 declare const QuickBloxUIKitDesktopLayout: React.FC<QuickBloxUIKitDesktopLayoutProps>;
 export default QuickBloxUIKitDesktopLayout;

package/dist/index-ui.js

@@ -1811,6 +1811,28 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 
 /***/ }),
 
+/***/ "./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/ErrorMessageIcon.tsx":
+/*!********************************************************************************************!*\
+  !*** ./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/ErrorMessageIcon.tsx ***!
+  \********************************************************************************************/
+/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\n\n\nvar errorMessageIconStyles = {\n    errorIcon: {\n        display: 'inline-block',\n        position: 'relative',\n        width: '21px',\n        height: '21px',\n        cursor: 'pointer',\n    },\n    circle: {\n        width: '21px',\n        height: '21px',\n        backgroundColor: 'red',\n        borderRadius: '50%',\n        display: 'flex',\n        justifyContent: 'center',\n        alignItems: 'center',\n    },\n    exclamationMark: {\n        color: 'white',\n        fontSize: '12px', // Уменьшен размер восклицательного знака\n    },\n    errorMessage: {\n        position: 'absolute',\n        bottom: '100%',\n        left: '50%',\n        transform: 'translateX(-50%)',\n        backgroundColor: 'lightgray',\n        border: '1px solid gray',\n        padding: '6px',\n        borderRadius: '8px',\n        whiteSpace: 'nowrap',\n        display: 'inline-block',\n        zIndex: 1, // Установлен zIndex, чтобы текст был выше других элементов\n    },\n};\nfunction ErrorMessageIcon(_a) {\n    var errorMessageText = _a.errorMessageText, errorsDescriptions = _a.errorsDescriptions;\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), isHovered = _b[0], setIsHovered = _b[1];\n    var handleMouseEnter = function () {\n        setIsHovered(true);\n    };\n    var handleMouseLeave = function () {\n        setIsHovered(false);\n    };\n    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: __assign(__assign({}, errorMessageIconStyles.errorIcon), (isHovered ? { backgroundColor: 'yellow' } : {})), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: errorMessageIconStyles.circle }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"span\", __assign({ style: errorMessageIconStyles.exclamationMark }, { children: \"!\" })) })), isHovered && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: errorMessageIconStyles.errorMessage }, { children: [errorMessageText, errorsDescriptions === null || errorsDescriptions === void 0 ? void 0 : errorsDescriptions.map(function (item, index) { return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: {\n                            padding: '4px',\n                            cursor: 'pointer',\n                        }, onClick: function () {\n                            item.action();\n                        } }, { children: item.title }), index)); })] })))] })));\n}\n/* harmony default export */ __webpack_exports__[\"default\"] = (ErrorMessageIcon);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/ErrorMessageIcon.tsx?");
+
+/***/ }),
+
+/***/ "./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.tsx":
+/*!*******************************************************************************************************************!*\
+  !*** ./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.tsx ***!
+  \*******************************************************************************************************************/
+/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": function() { return /* binding */ UseDefaultAIAssistAnswerWidgetWithProxy; }\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _svgs_Icons_Media_AIWidget__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../svgs/Icons/Media/AIWidget */ \"./src/Presentation/components/UI/svgs/Icons/Media/AIWidget/index.tsx\");\n/* harmony import */ var _utils_parse__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../utils/parse */ \"./src/utils/parse.ts\");\n/* harmony import */ var _ErrorMessageIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ErrorMessageIcon */ \"./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/ErrorMessageIcon.tsx\");\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n    function verb(n) { return function (v) { return step([n, v]); }; }\n    function step(op) {\n        if (f) throw new TypeError(\"Generator is already executing.\");\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n            if (y = 0, t) op = [op[0] & 2, t.value];\n            switch (op[0]) {\n                case 0: case 1: t = op; break;\n                case 4: _.label++; return { value: op[1], done: false };\n                case 5: _.label++; y = op[1]; op = [0]; continue;\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\n                default:\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n                    if (t[2]) _.ops.pop();\n                    _.trys.pop(); continue;\n            }\n            op = body.call(thisArg, _);\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n    }\n};\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\n\n\n\n\n\nfunction UseDefaultAIAssistAnswerWidgetWithProxy(_a) {\n    var servername = _a.servername, api = _a.api, port = _a.port, sessionToken = _a.sessionToken;\n    var _b = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), errorMessage = _b[0], setErrorMessage = _b[1];\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars,@typescript-eslint/no-empty-function\n    var fileToWidget = function (file, context) { };\n    var renderWidget = function () {\n        if (errorMessage && errorMessage.length > 0) {\n            var errorsDescriptions = [];\n            return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ErrorMessageIcon__WEBPACK_IMPORTED_MODULE_4__[\"default\"], { errorMessageText: errorMessage, errorsDescriptions: errorsDescriptions }));\n        }\n        return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_AIWidget__WEBPACK_IMPORTED_MODULE_2__[\"default\"], { applyZoom: true, color: \"green\" });\n    };\n    // async function getData(\n    //   textToSend: string,\n    //   dialogMessages: ChatCompletionRequestMessage[],\n    // ): Promise<string> {\n    //   //\n    //   const apiEndpoint = 'https://api.openai.com/v1/chat/completions';\n    //   const { apiKey } = QBConfig.configAIApi.AIAnswerAssistWidgetConfig; // Замените на ваш реальный ключ API\n    //   const model = 'gpt-3.5-turbo';\n    //   const requestOptions = {\n    //     method: 'POST',\n    //     headers: {\n    //       'Content-Type': 'application/json',\n    //       Authorization: `Bearer ${apiKey}`,\n    //     },\n    //     body: JSON.stringify({\n    //       messages: [...dialogMessages, { role: 'user', content: textToSend }],\n    //       model,\n    //       temperature: 0.5,\n    //     }),\n    //   };\n    //\n    function getData(textToSend, dialogMessages) {\n        var _a;\n        return __awaiter(this, void 0, void 0, function () {\n            var outputMessage, apiEndpoint, apiKey, model, prompt, requestOptions, response, data, err_1;\n            return __generator(this, function (_b) {\n                switch (_b.label) {\n                    case 0:\n                        outputMessage = '';\n                        apiEndpoint = \"\".concat(servername).concat(port).concat(api);\n                        apiKey = sessionToken;\n                        model = 'gpt-3.5-turbo';\n                        prompt = \"Respond as a knowledgeable customer support specialist with access to ChatGPT features, and provide a simple and informative response to the inquiry :\\\"\".concat(textToSend, \"\\\"\");\n                        requestOptions = {\n                            method: 'POST',\n                            headers: {\n                                'Content-Type': 'application/json',\n                                Authorization: \"Bearer \".concat(apiKey),\n                            },\n                            body: JSON.stringify({\n                                messages: __spreadArray(__spreadArray([], dialogMessages, true), [{ role: 'user', content: prompt }], false),\n                                model: model,\n                                temperature: 0.5,\n                            }),\n                        };\n                        _b.label = 1;\n                    case 1:\n                        _b.trys.push([1, 4, , 5]);\n                        return [4 /*yield*/, fetch(apiEndpoint, requestOptions)];\n                    case 2:\n                        response = _b.sent();\n                        return [4 /*yield*/, response.json()];\n                    case 3:\n                        data = _b.sent();\n                        outputMessage = ((_a = data.choices[0].message) === null || _a === void 0 ? void 0 : _a.content) || '';\n                        return [3 /*break*/, 5];\n                    case 4:\n                        err_1 = _b.sent();\n                        outputMessage = (0,_utils_parse__WEBPACK_IMPORTED_MODULE_3__.stringifyError)(err_1);\n                        setErrorMessage(outputMessage);\n                        return [3 /*break*/, 5];\n                    case 5: return [2 /*return*/, outputMessage];\n                }\n            });\n        });\n    }\n    var _c = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), textFromWidgetToContent = _c[0], setTextFromWidgetToContent = _c[1];\n    // const textToWidget = (value: string, context: IChatMessage[]): void => {\n    //   if (value && value.length > 0) {\n    //     // eslint-disable-next-line promise/catch-or-return\n    //     getOpenAIApiData(value, context as ChatCompletionRequestMessage[]).then(\n    //       // eslint-disable-next-line promise/always-return\n    //       (data) => {\n    //         setTextFromWidgetToContent(data);\n    //       },\n    //     );\n    //   }\n    // };\n    var textToWidget = function (value, context) {\n        if (value && value.length > 0) {\n            // eslint-disable-next-line promise/catch-or-return\n            getData(value, context).then(\n            // eslint-disable-next-line promise/always-return\n            function (data) {\n                setTextFromWidgetToContent(data);\n            });\n        }\n    };\n    return {\n        fileToContent: undefined,\n        textToContent: textFromWidgetToContent,\n        fileToWidget: fileToWidget,\n        renderWidget: renderWidget,\n        textToWidget: textToWidget,\n    };\n}\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.tsx?");
+
+/***/ }),
+
 /***/ "./src/Presentation/components/UI/Dialogs/MessagesView/AudioAttachmentComponent/AudioAttachmentComponent.tsx":
 /*!*******************************************************************************************************************!*\
   !*** ./src/Presentation/components/UI/Dialogs/MessagesView/AudioAttachmentComponent/AudioAttachmentComponent.tsx ***!
@@ -1862,7 +1884,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _MessagesView_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./MessagesView.scss */ \"./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.scss\");\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQBConnection__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../providers/QuickBloxUIKitProvider/useQBConnection */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQBConnection.ts\");\n/* harmony import */ var _containers_ScrollableContainer_ScrollableContainer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../containers/ScrollableContainer/ScrollableContainer */ \"./src/Presentation/components/containers/ScrollableContainer/ScrollableContainer.tsx\");\n/* harmony import */ var _Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../Domain/entity/FileTypes */ \"./src/Domain/entity/FileTypes.ts\");\n/* harmony import */ var _svgs_Icons_Media_ImageEmpty__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../svgs/Icons/Media/ImageEmpty */ \"./src/Presentation/components/UI/svgs/Icons/Media/ImageEmpty/index.tsx\");\n/* harmony import */ var _svgs_Icons_Toggle_ImagePlay__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../svgs/Icons/Toggle/ImagePlay */ \"./src/Presentation/components/UI/svgs/Icons/Toggle/ImagePlay/index.tsx\");\n/* harmony import */ var _containers_ColumnContainer_ColumnContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../containers/ColumnContainer/ColumnContainer */ \"./src/Presentation/components/containers/ColumnContainer/ColumnContainer.tsx\");\n/* harmony import */ var _svgs_Icons_Media_ImageFile__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../svgs/Icons/Media/ImageFile */ \"./src/Presentation/components/UI/svgs/Icons/Media/ImageFile/index.tsx\");\n/* harmony import */ var _useMessagesViewModel__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./useMessagesViewModel */ \"./src/Presentation/components/UI/Dialogs/MessagesView/useMessagesViewModel.ts\");\n/* harmony import */ var _Placeholders_LoaderComponent_LoaderComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../Placeholders/LoaderComponent/LoaderComponent */ \"./src/Presentation/components/UI/Placeholders/LoaderComponent/LoaderComponent.tsx\");\n/* harmony import */ var _Placeholders_ErrorComponent_ErrorComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../Placeholders/ErrorComponent/ErrorComponent */ \"./src/Presentation/components/UI/Placeholders/ErrorComponent/ErrorComponent.tsx\");\n/* harmony import */ var _HeaderMessages_HeaderMessages__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./HeaderMessages/HeaderMessages */ \"./src/Presentation/components/UI/Dialogs/MessagesView/HeaderMessages/HeaderMessages.tsx\");\n/* harmony import */ var _VideoAttachmentComponent_VideoAttachmentComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./VideoAttachmentComponent/VideoAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/VideoAttachmentComponent/VideoAttachmentComponent.tsx\");\n/* harmony import */ var _ImageAttachmentComponent_ImageAttachmentComponent__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./ImageAttachmentComponent/ImageAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/ImageAttachmentComponent/ImageAttachmentComponent.tsx\");\n/* harmony import */ var _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../../../../Domain/entity/DialogTypes */ \"./src/Domain/entity/DialogTypes.ts\");\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQbInitializedDataContext.ts\");\n/* harmony import */ var _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../../../../Domain/repository/Pagination */ \"./src/Domain/repository/Pagination.ts\");\n/* harmony import */ var _utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../../../../utils/DateTimeFormatter */ \"./src/utils/DateTimeFormatter.ts\");\n/* harmony import */ var _svgs_Icons_Contents_User__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../svgs/Icons/Contents/User */ \"./src/Presentation/components/UI/svgs/Icons/Contents/User/index.tsx\");\n/* harmony import */ var _svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../svgs/ActiveSvg/ActiveSvg */ \"./src/Presentation/components/UI/svgs/ActiveSvg/ActiveSvg.tsx\");\n/* harmony import */ var _svgs_Icons_Media_Attachment__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../svgs/Icons/Media/Attachment */ \"./src/Presentation/components/UI/svgs/Icons/Media/Attachment/index.tsx\");\n/* harmony import */ var _svgs_Icons_Actions_Send__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../svgs/Icons/Actions/Send */ \"./src/Presentation/components/UI/svgs/Icons/Actions/Send/index.tsx\");\n/* harmony import */ var _AudioAttachmentComponent_AudioAttachmentComponent__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./AudioAttachmentComponent/AudioAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/AudioAttachmentComponent/AudioAttachmentComponent.tsx\");\n/* harmony import */ var _svgs_Icons_Media_AudioFile__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../svgs/Icons/Media/AudioFile */ \"./src/Presentation/components/UI/svgs/Icons/Media/AudioFile/index.tsx\");\n/* harmony import */ var _svgs_Icons_Actions_Voice__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../svgs/Icons/Actions/Voice */ \"./src/Presentation/components/UI/svgs/Icons/Actions/Voice/index.tsx\");\n/* harmony import */ var _svgs_Icons_Status_Sent__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../../svgs/Icons/Status/Sent */ \"./src/Presentation/components/UI/svgs/Icons/Status/Sent/index.tsx\");\n/* harmony import */ var _svgs_Icons_Status_ViewedDelivered__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../../svgs/Icons/Status/ViewedDelivered */ \"./src/Presentation/components/UI/svgs/Icons/Status/ViewedDelivered/index.tsx\");\n/* harmony import */ var _utils_parse__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../../../../../utils/parse */ \"./src/utils/parse.ts\");\n/* harmony import */ var _VoiceRecordingProgress_VoiceRecordingProgress__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./VoiceRecordingProgress/VoiceRecordingProgress */ \"./src/Presentation/components/UI/Dialogs/MessagesView/VoiceRecordingProgress/VoiceRecordingProgress.tsx\");\n/* harmony import */ var _HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./HighLightLink/HighLightLink */ \"./src/Presentation/components/UI/Dialogs/MessagesView/HighLightLink/HighLightLink.tsx\");\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n    function verb(n) { return function (v) { return step([n, v]); }; }\n    function step(op) {\n        if (f) throw new TypeError(\"Generator is already executing.\");\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n            if (y = 0, t) op = [op[0] & 2, t.value];\n            switch (op[0]) {\n                case 0: case 1: t = op; break;\n                case 4: _.label++; return { value: op[1], done: false };\n                case 5: _.label++; y = op[1]; op = [0]; continue;\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\n                default:\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n                    if (t[2]) _.ops.pop();\n                    _.trys.pop(); continue;\n            }\n            op = body.call(thisArg, _);\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n    }\n};\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n// eslint-disable-next-line react/function-component-definition\nvar MessagesView = function (_a) {\n    var _b, _c, _d;\n    var \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    // InputWidgetToLeftPlaceHolder,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    // InputWidgetToRightPlaceHolder,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    // IncomingMessageWidgetToRightPlaceHolder,\n    dialogsViewModel = _a.dialogsViewModel, onDialogInformationHandler = _a.onDialogInformationHandler, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _e = _a.maxWidthToResize, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    maxWidthToResize = _e === void 0 ? undefined : _e, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _f = _a.theme, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    theme = _f === void 0 ? undefined : _f, _g = _a.subHeaderContent, subHeaderContent = _g === void 0 ? undefined : _g, _h = _a.upHeaderContent, upHeaderContent = _h === void 0 ? undefined : _h;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var maxWidthToResizing = maxWidthToResize || '$message-view-container-wrapper-min-width';\n    // const maxWidthToResizing = '720px'; // $message-view-container-wrapper-min-width:\n    var currentContext = (0,_providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_17__[\"default\"])();\n    var currentUserId = (_b = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _b === void 0 ? void 0 : _b.userId;\n    var currentUserName = (_c = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _c === void 0 ? void 0 : _c.userName;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var _j = (0,_providers_QuickBloxUIKitProvider_useQBConnection__WEBPACK_IMPORTED_MODULE_3__[\"default\"])(), connectionRepository = _j.connectionRepository, browserOnline = _j.browserOnline;\n    var _k = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(100), dialogMessagesCount = _k[0], setDialogMessageCount = _k[1];\n    var _l = react__WEBPACK_IMPORTED_MODULE_1___default().useState(true), hasMore = _l[0], setHasMore = _l[1];\n    var _m = react__WEBPACK_IMPORTED_MODULE_1___default().useState(false), scrollUpToDown = _m[0], setScrollUpToDown = _m[1];\n    var _o = react__WEBPACK_IMPORTED_MODULE_1___default().useState([]), messagesToView = _o[0], setMessagesToView = _o[1];\n    var messagesViewModel = (0,_useMessagesViewModel__WEBPACK_IMPORTED_MODULE_10__[\"default\"])((_d = dialogsViewModel.entity) === null || _d === void 0 ? void 0 : _d.type, dialogsViewModel.entity);\n    var maxFileSize = currentContext.InitParams.maxFileSize;\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW DIALOG');\n        // messagesViewModel.getMessages(new Pagination());\n        messagesViewModel.entity = dialogsViewModel.entity;\n        setMessagesToView([]);\n    }, [dialogsViewModel.entity]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW ENTITY');\n        messagesViewModel.getMessages(new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_18__.Pagination());\n    }, [messagesViewModel.entity]);\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW ENTITY');\n        dialogsViewModel.setWaitLoadingStatus(messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading);\n    }, [messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading]);\n    //\n    function prepareFirstPage(initData) {\n        var firstPageSize = messagesViewModel.messages.length < 47\n            ? messagesViewModel.messages.length\n            : 47;\n        // for (let i = 0; i < firstPageSize; i += 1) {\n        for (var i = firstPageSize - 1; i >= 0; i -= 1) {\n            initData.push(messagesViewModel.messages[i]);\n        }\n    }\n    var fetchMoreData = function () {\n        if (messagesToView.length >= dialogMessagesCount) {\n            setHasMore(false);\n            return;\n        }\n        if (hasMore &&\n            messagesToView.length > 0 &&\n            messagesToView.length < dialogMessagesCount) {\n            setMessagesToView(function (prevState) {\n                var newState = __spreadArray([], prevState, true);\n                var newMessageEntity = messagesViewModel.messages[prevState.length];\n                newState.push(newMessageEntity);\n                return newState;\n            });\n        }\n    };\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log('Messages have changed');\n        setDialogMessageCount(((_a = messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.messages) === null || _a === void 0 ? void 0 : _a.length) || 0);\n        if ((messagesToView === null || messagesToView === void 0 ? void 0 : messagesToView.length) === 0 && messagesViewModel.messages.length > 0) {\n            // setDialogMessageCount(messagesViewModel.messages.length);\n            var initData = [];\n            console.log(JSON.stringify(messagesViewModel.messages));\n            prepareFirstPage(initData);\n            setMessagesToView(initData);\n        }\n        else if (messagesViewModel.messages.length - messagesToView.length >= 1) {\n            setHasMore(true);\n            setScrollUpToDown(true);\n        }\n    }, [messagesViewModel.messages]);\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('dialogMessagesCount have changed');\n        if (messagesViewModel.messages.length - messagesToView.length >= 1) {\n            fetchMoreData();\n        }\n    }, [dialogMessagesCount]);\n    //\n    var getSenderName = function (sender) {\n        if (!sender)\n            return undefined;\n        return (sender.full_name || sender.login || sender.email || sender.id.toString());\n    };\n    var renderMessage = function (message, index) {\n        var SystemMessage = 'SystemMessage';\n        var IncomingMessage = 'IncomingMessage';\n        var OutgoingMessage = 'OutgoingMessage';\n        console.log('render message: ', JSON.stringify(message), ' index: ', index);\n        var messageView;\n        var checkMessageType = function (m) {\n            if (m.notification_type && m.notification_type.length > 0) {\n                return SystemMessage;\n            }\n            if ((m.sender && m.sender.id.toString() !== (currentUserId === null || currentUserId === void 0 ? void 0 : currentUserId.toString())) ||\n                m.sender_id.toString() !== (currentUserId === null || currentUserId === void 0 ? void 0 : currentUserId.toString())) {\n                return IncomingMessage;\n            }\n            return OutgoingMessage;\n        };\n        var messageTypes = checkMessageType(message);\n        var messageContentRender = function (mc) {\n            var messageText = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: mc.message });\n            var messageContent = messageText;\n            var attachmentContentRender = function (att) {\n                var contentPlaceHolder = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: att.type.toString() });\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.video)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_VideoAttachmentComponent_VideoAttachmentComponent__WEBPACK_IMPORTED_MODULE_14__[\"default\"], { videoFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Toggle_ImagePlay__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.audio)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_AudioAttachmentComponent_AudioAttachmentComponent__WEBPACK_IMPORTED_MODULE_24__[\"default\"], { audioFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_AudioFile__WEBPACK_IMPORTED_MODULE_25__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.image)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ImageAttachmentComponent_ImageAttachmentComponent__WEBPACK_IMPORTED_MODULE_15__[\"default\"], { imageFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_ImageEmpty__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.text)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: \"TEXT\" })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_ImageFile__WEBPACK_IMPORTED_MODULE_9__[\"default\"], { applyZoom: true }));\n                }\n                var contentResult = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container--message-content-wrapper\" }, { children: contentPlaceHolder })));\n                if (att.type === _Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.text) {\n                    contentResult = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--file-message-content-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.caption() } : {}, className: \"message-view-container__file-message-icon\" }, { children: contentPlaceHolder })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: att.name || 'file' })] })));\n                }\n                return contentResult;\n            };\n            if (mc.attachments && mc.attachments.length > 0) {\n                messageContent = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_containers_ColumnContainer_ColumnContainer__WEBPACK_IMPORTED_MODULE_8__[\"default\"], __assign({ maxWidth: \"100%\" }, { children: [mc.attachments.map(function (attachment) {\n                            return attachmentContentRender(attachment);\n                        }), messageText] })));\n            }\n            if ((0,_HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__.messageHasUrls)(mc.message) &&\n                !(mc.attachments && mc.attachments.length > 0)) {\n                return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__.HighLightLink, { messageText: mc.message });\n            }\n            return messageContent;\n        };\n        if (messageTypes === SystemMessage) {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--system-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.disabledElements() } : {}, className: \"message-view-container--system-message-wrapper__date_container\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", { children: [(0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getDateShortFormatEU)(message.date_sent), \",\"] }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: message.message })] }), message.id));\n        }\n        else if (messageTypes === IncomingMessage) {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--incoming-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container--incoming-message-wrapper__avatar\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.disabledElements() } : {}, className: \"message-view-container__sender-avatar\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Contents_User__WEBPACK_IMPORTED_MODULE_20__[\"default\"], { width: \"24\", height: \"24\", applyZoom: true, color: \"var(--secondary-text)\" }) })) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--incoming-message-container\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.secondaryText() } : {}, className: \"message-view-container__sender-name\" }, { children: getSenderName(message.sender) || message.sender_id.toString() })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme\n                                    ? {\n                                        color: theme.mainText(),\n                                        backgroundColor: theme.incomingBackground(),\n                                    }\n                                    : {}, className: \"message-view-container__sender-message\" }, { children: messageContentRender(message) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainText() } : {}, className: \"message-view-container__incoming-time\" }, { children: (0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getTimeShort24hFormat)(message.date_sent) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { className: \"message-view-container__incoming-time\", onClick: function () {\n                            // IncomingMessageWidgetToRightPlaceHolder?.textToWidget(\n                            //   message.message,\n                            // );\n                        } })] }), message.id));\n        }\n        else {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--outgoing-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container__status-message\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container__incoming-time\" }, { children: message.delivered_ids && message.delivered_ids.length > 0 ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Status_ViewedDelivered__WEBPACK_IMPORTED_MODULE_28__[\"default\"], { width: \"13\", height: \"13\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Status_Sent__WEBPACK_IMPORTED_MODULE_27__[\"default\"], { width: \"13\", height: \"13\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' })) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainText() } : {}, className: \"message-view-container__incoming-time\" }, { children: (0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getTimeShort24hFormat)(message.date_sent) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme\n                            ? {\n                                color: theme.mainText(),\n                                backgroundColor: theme.outgoingBackground(),\n                            }\n                            : {}, className: \"message-view-container__outgoing-message\" }, { children: messageContentRender(message) }))] }), message.id));\n        }\n        return messageView;\n    };\n    var getCountDialogMembers = function (dialogEntity) {\n        var participants = [];\n        if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType.group) {\n            participants = dialogEntity.participantIds;\n        }\n        else if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType[\"private\"]) {\n            participants = [dialogEntity.participantId];\n        }\n        else if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType[\"public\"]) {\n            participants = [];\n        }\n        return participants.length;\n    };\n    var _p = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null), fileToSend = _p[0], setFileToSend = _p[1];\n    var _q = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), messageText = _q[0], setMessageText = _q[1];\n    var _r = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), warningErrorText = _r[0], setWarningErrorText = _r[1];\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var _s = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), widgetTextContent = _s[0], setWidgetTextContent = _s[1];\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        setWarningErrorText(messagesViewModel.typingText);\n    }, [messagesViewModel.typingText]);\n    var ChangeFileHandler = function (event) {\n        var reader = new FileReader();\n        var file = event.currentTarget.files\n            ? event.currentTarget.files[0]\n            : null;\n        reader.onloadend = function () {\n            setFileToSend(file);\n        };\n        if (file !== null)\n            reader.readAsDataURL(file);\n    };\n    var showErrorMessage = function (errorMessage) {\n        setWarningErrorText(errorMessage);\n        setTimeout(function () {\n            setWarningErrorText('');\n        }, 3000);\n    };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('have Attachments');\n        var MAXSIZE = maxFileSize || 90 * 1000000;\n        var MAXSIZE_FOR_MESSAGE = MAXSIZE / (1024 * 1024);\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        var flag = (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) && (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) < MAXSIZE;\n        if ((fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) && (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) < MAXSIZE) {\n            messagesViewModel.sendAttachmentMessage(fileToSend);\n        }\n        else if (fileToSend) {\n            showErrorMessage(\"file size \".concat(fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size, \" must be less then \").concat(MAXSIZE_FOR_MESSAGE, \" mb.\"));\n        }\n    }, [fileToSend]);\n    var _t = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(true), isVoiceMessage = _t[0], setVoiceMessage = _t[1];\n    var _u = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), isRecording = _u[0], setIsRecording = _u[1];\n    //\n    var _v = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), permission = _v[0], setPermission = _v[1];\n    // const [recordingStatus, setRecordingStatus] = useState('inactive');\n    var _w = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(), stream = _w[0], setStream = _w[1];\n    // const [mediaRecorder, setMediaRecorder] = useState<MediaRecorder>();\n    var mediaRecorder = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();\n    var _x = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(), resultAudioBlob = _x[0], setResultAudioBlob = _x[1];\n    var _y = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)([]), audioChunks = _y[0], setAudioChunks = _y[1];\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var mimeType = 'audio/webm;codecs=opus'; // audio/ogg audio/mpeg audio/webm audio/x-wav audio/mp4\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var getMicrophonePermission = function () { return __awaiter(void 0, void 0, void 0, function () {\n        var mediaStream, err_1;\n        return __generator(this, function (_a) {\n            switch (_a.label) {\n                case 0:\n                    if (!window) return [3 /*break*/, 5];\n                    _a.label = 1;\n                case 1:\n                    _a.trys.push([1, 3, , 4]);\n                    return [4 /*yield*/, navigator.mediaDevices.getUserMedia({\n                            audio: true,\n                            video: false,\n                        })];\n                case 2:\n                    mediaStream = _a.sent();\n                    setPermission(true);\n                    setStream(mediaStream);\n                    return [3 /*break*/, 4];\n                case 3:\n                    err_1 = _a.sent();\n                    // setWarningErrorText(\n                    //   'The MediaRecorder API is not supported in your browser.',\n                    // );\n                    showErrorMessage(\"The MediaRecorder API throws exception \".concat((0,_utils_parse__WEBPACK_IMPORTED_MODULE_29__.stringifyError)(err_1), \" .\"));\n                    return [3 /*break*/, 4];\n                case 4: return [3 /*break*/, 6];\n                case 5:\n                    // setWarningErrorText(\n                    //   'The MediaRecorder API is not supported in your browser.',\n                    // );\n                    showErrorMessage('The MediaRecorder API is not supported in your browser.');\n                    _a.label = 6;\n                case 6: return [2 /*return*/];\n            }\n        });\n    }); };\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars,@typescript-eslint/require-await\n    var startRecording = function () { return __awaiter(void 0, void 0, void 0, function () {\n        var mimeContent, media, localAudioChunks;\n        return __generator(this, function (_a) {\n            if (!stream)\n                return [2 /*return*/];\n            mimeContent = window.MediaRecorder.isTypeSupported('audio/mp4;codecs=mp4a')\n                ? 'audio/mp4;codecs=mp4a'\n                : 'audio/webm;codecs=opus';\n            media = new MediaRecorder(stream, { mimeType: mimeContent });\n            mediaRecorder.current = media;\n            mediaRecorder.current.start();\n            localAudioChunks = [];\n            mediaRecorder.current.ondataavailable = function (event) {\n                // const localAudioChunks: any[] = [];\n                if (typeof event.data === 'undefined')\n                    return;\n                if (event.data.size === 0)\n                    return;\n                localAudioChunks.push(event.data);\n                console.log('voice data');\n                // setAudioChunks(localAudioChunks);\n            };\n            setAudioChunks(localAudioChunks);\n            return [2 /*return*/];\n        });\n    }); };\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var stopRecording = function () {\n        if (!mediaRecorder.current)\n            return;\n        // setRecordingStatus('inactive');\n        mediaRecorder.current.stop();\n        mediaRecorder.current.onstop = function () {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            var mimeContent = window.MediaRecorder.isTypeSupported('audio/mp4;codecs=mp4a')\n                ? 'audio/mp4;codecs=mp4a'\n                : 'audio/webm;codecs=opus';\n            // const audioBlob = new Blob(audioChunks, { type: mimeContent }); // mimeType\n            // const mp4Blob = new Blob(recordedChunks, { type: 'video/mp4' });\n            // const audioBlob = new Blob(audioChunks, { type: 'video/mp4' }); // mimeType\n            var audioBlob = new Blob(audioChunks, { type: 'audio/mp4' }); // mimeType\n            setResultAudioBlob(audioBlob);\n            setAudioChunks([]);\n            //\n            stream === null || stream === void 0 ? void 0 : stream.getAudioTracks().forEach(function (track) {\n                track.stop();\n            });\n            setPermission(false);\n            //\n        };\n    };\n    //\n    var blobToFile = function (theBlob, fileName) {\n        var b = theBlob;\n        // A Blob() is almost a File() - it's just missing the two properties below which we will add\n        b.lastModifiedDate = new Date();\n        b.name = fileName;\n        // Cast to a File() type\n        var resultFile = theBlob;\n        return resultFile;\n    };\n    var _z = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), useAudioWidget = _z[0], setUseAudioWidget = _z[1];\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var fileExt = 'mp4';\n        if (resultAudioBlob) {\n            var voiceMessage = blobToFile(resultAudioBlob, \"\".concat(currentUserName || '', \"_voice_message.\").concat(fileExt));\n            setFileToSend(voiceMessage);\n            if (useAudioWidget) {\n                setUseAudioWidget(false);\n                // InputWidgetToRightPlaceHolder?.fileToWidget(voiceMessage);\n            }\n            //\n        }\n    }, [resultAudioBlob]);\n    // test component version\n    // useEffect(() => {\n    //   if (isRecording) {\n    //     setWarningErrorText(`Your voice is recording during for 1 minute`);\n    //   } else {\n    //     setWarningErrorText('');\n    //   }\n    // }, [isRecording]);\n    // work version below:\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        // setFileToSend(null);\n        if (isRecording) {\n            if (!permission) {\n                // eslint-disable-next-line promise/catch-or-return,promise/always-return\n                getMicrophonePermission().catch(function () {\n                    // setWarningErrorText(`Have no audio.`);\n                    showErrorMessage(\"Have no audio.\");\n                });\n            }\n            else {\n                // eslint-disable-next-line promise/catch-or-return,promise/always-return\n                startRecording().then(function () {\n                    setWarningErrorText(\"Your voice is recording during for 1 minutes\");\n                });\n            }\n        }\n        else {\n            if (permission && mediaRecorder.current) {\n                stopRecording();\n            }\n            setWarningErrorText('');\n        }\n    }, [isRecording]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        if (isRecording && permission) {\n            // eslint-disable-next-line promise/always-return,promise/catch-or-return\n            startRecording().then(function () {\n                setWarningErrorText(\"Your voice is recording during for 1 minutes\");\n            });\n        }\n    }, [permission]);\n    function sendTextMessageActions() {\n        if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n            return;\n        setVoiceMessage(true);\n        if (messageText.length > 0 && messageText.length <= 1000) {\n            var messageTextToSend = messageText;\n            setMessageText('');\n            messagesViewModel.sendTextMessage(messageTextToSend);\n            setMessageText('');\n        }\n        else {\n            setWarningErrorText('length of text message must be less then 1000 chars.');\n            setTimeout(function () {\n                setWarningErrorText('');\n            }, 3000);\n        }\n    }\n    // useEffect(() => {\n    //   if (\n    //     InputWidgetToLeftPlaceHolder?.textToInput &&\n    //     InputWidgetToLeftPlaceHolder?.textToInput.length > 0\n    //   ) {\n    //     setMessageText(InputWidgetToLeftPlaceHolder?.textToInput);\n    //     setWidgetTextContent(InputWidgetToLeftPlaceHolder?.textToInput);\n    //     setTimeout(() => {\n    //       setWidgetTextContent('');\n    //     }, 45 * 1000);\n    //   }\n    // }, [InputWidgetToLeftPlaceHolder?.textToInput]);\n    //\n    // useEffect(() => {\n    //   if (\n    //     InputWidgetToRightPlaceHolder?.textToInput &&\n    //     InputWidgetToRightPlaceHolder?.textToInput.length > 0\n    //   ) {\n    //     setMessageText(InputWidgetToRightPlaceHolder?.textToInput);\n    //     setWidgetTextContent(InputWidgetToRightPlaceHolder?.textToInput);\n    //     setTimeout(() => {\n    //       setWidgetTextContent('');\n    //     }, 45 * 1000);\n    //   }\n    // }, [InputWidgetToRightPlaceHolder?.textToInput]);\n    //\n    // useEffect(() => {\n    //   if (\n    //     IncomingMessageWidgetToRightPlaceHolder?.textToInput &&\n    //     IncomingMessageWidgetToRightPlaceHolder?.textToInput.length > 0\n    //   ) {\n    //     setWidgetTextContent(\n    //       IncomingMessageWidgetToRightPlaceHolder?.textToInput,\n    //     );\n    //     setTimeout(() => {\n    //       setWidgetTextContent('');\n    //     }, 45 * 1000);\n    //   }\n    // }, [IncomingMessageWidgetToRightPlaceHolder?.textToInput]);\n    var useSubContent = subHeaderContent || false;\n    var useUpContent = upHeaderContent || false;\n    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: maxWidthToResize\n            ? {\n                maxWidth: \"\".concat(maxWidthToResizing),\n                minWidth: \"$message-view-container-wrapper-min-width\",\n                // width: `${maxWidthToResizing}`,\n                width: '100%',\n            }\n            : {}, className: \"message-view-container\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                    flexGrow: \"1\",\n                    flexShrink: \"1\",\n                    flexBasis: \"\".concat(maxWidthToResizing),\n                }, className: \"message-view-container--header\" }, { children: [useUpContent && upHeaderContent, (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_HeaderMessages_HeaderMessages__WEBPACK_IMPORTED_MODULE_13__[\"default\"], { dialog: messagesViewModel.entity, InformationHandler: onDialogInformationHandler, countMembers: getCountDialogMembers(dialogsViewModel.entity) }), useSubContent && subHeaderContent] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: theme\n                    ? {\n                        flexGrow: \"1\",\n                        flexShrink: \"1\",\n                        flexBasis: \"\".concat(maxWidthToResizing),\n                        backgroundColor: theme.secondaryBackground(), // var(--secondary-background);\n                    }\n                    : {\n                        flexGrow: \"1\",\n                        flexShrink: \"1\",\n                        flexBasis: \"\".concat(maxWidthToResizing),\n                    }, className: \"message-view-container--messages\" }, { children: [(messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.error) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Placeholders_ErrorComponent_ErrorComponent__WEBPACK_IMPORTED_MODULE_12__[\"default\"], { title: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.error, ClickActionHandler: function () {\n                            alert('call click retry');\n                        } })), messagesViewModel &&\n                        messagesViewModel.messages &&\n                        messagesViewModel.messages.length > 0 &&\n                        messagesToView &&\n                        messagesToView.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containers_ScrollableContainer_ScrollableContainer__WEBPACK_IMPORTED_MODULE_4__[\"default\"], { data: messagesToView, renderItem: renderMessage, onEndReached: fetchMoreData, onEndReachedThreshold: 0.8, refreshing: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading, autoScrollToBottom: scrollUpToDown })), (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: {\n                            height: '44px',\n                            width: '44px',\n                        } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Placeholders_LoaderComponent_LoaderComponent__WEBPACK_IMPORTED_MODULE_11__[\"default\"], { width: \"44\", height: \"44\", color: \"var(--color-background-info)\" }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainElements() } : {}, className: \"message-view-container--warning-error\" }, { children: warningErrorText }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                    flex: \"flex: 1 1 \".concat(maxWidthToResizing),\n                }, onBlur: function () {\n                    if (!(messageText && messageText.length > 0)) {\n                        setVoiceMessage(true);\n                    }\n                }, className: \"message-view-container--chat-input\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"label\", __assign({ htmlFor: \"btnUploadAttachment\", style: {\n                            cursor: 'pointer',\n                        } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_Attachment__WEBPACK_IMPORTED_MODULE_22__[\"default\"], { width: \"32\", height: \"32\", applyZoom: true, color: theme ? theme.inputElements() : 'var(--input-elements)' }), clickAction: function () {\n                                        console.log('click send message');\n                                    }, touchAction: function () {\n                                        console.log('touch send message');\n                                    } }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", { id: \"btnUploadAttachment\", type: \"file\", accept: \"image/*, audio/*, video/*, .pdf, .txt,\", style: { display: 'none' }, onChange: function (event) {\n                                    ChangeFileHandler(event);\n                                } })] })), !isRecording && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"textarea\", { style: theme ? { backgroundColor: theme.chatInput() } : {}, disabled: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading, value: messageText, onFocus: function () {\n                            setVoiceMessage(false);\n                        }, onChange: function (event) {\n                            setMessageText(event.target.value);\n                        }, onInput: function () {\n                            messagesViewModel.sendTypingTextMessage();\n                        }, onKeyDown: function (e) {\n                            console.log(\"onKeyDown: \".concat(e.key, \" shift \").concat(e.shiftKey ? 'true' : 'false', \" ctrl \").concat(e.ctrlKey ? 'true' : 'false'));\n                            if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey) {\n                                sendTextMessageActions();\n                            }\n                        }, placeholder: \"enter text to send\" })), isRecording && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_VoiceRecordingProgress_VoiceRecordingProgress__WEBPACK_IMPORTED_MODULE_30__[\"default\"], { startStatus: isRecording, longRecInSec: 60, ClickActionHandler: function () {\n                            console.log('click send voice message');\n                            if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                return;\n                            setIsRecording(!isRecording);\n                        }, TouchActionHandler: function () {\n                            console.log('touch send voice message');\n                            if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                return;\n                            setIsRecording(!isRecording);\n                        } })), !isVoiceMessage && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Actions_Send__WEBPACK_IMPORTED_MODULE_23__[\"default\"], { width: \"21\", height: \"18\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' }), clickAction: function () {\n                                console.log('click send message');\n                                sendTextMessageActions();\n                            }, touchAction: function () {\n                                console.log('touch send message');\n                            } }) })), isVoiceMessage && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Actions_Voice__WEBPACK_IMPORTED_MODULE_26__[\"default\"], { width: \"21\", height: \"18\", applyZoom: true, color: isRecording ? 'var(--error)' : 'var(--input-elements)' }), clickAction: function () {\n                                console.log('click send voice message');\n                                if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                    return;\n                                setIsRecording(!isRecording);\n                            }, touchAction: function () {\n                                console.log('touch send message');\n                                if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                    return;\n                                setIsRecording(!isRecording);\n                            } }) }))] }))] })));\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (MessagesView);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _MessagesView_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./MessagesView.scss */ \"./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.scss\");\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQBConnection__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../providers/QuickBloxUIKitProvider/useQBConnection */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQBConnection.ts\");\n/* harmony import */ var _containers_ScrollableContainer_ScrollableContainer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../containers/ScrollableContainer/ScrollableContainer */ \"./src/Presentation/components/containers/ScrollableContainer/ScrollableContainer.tsx\");\n/* harmony import */ var _Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../Domain/entity/FileTypes */ \"./src/Domain/entity/FileTypes.ts\");\n/* harmony import */ var _svgs_Icons_Media_ImageEmpty__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../svgs/Icons/Media/ImageEmpty */ \"./src/Presentation/components/UI/svgs/Icons/Media/ImageEmpty/index.tsx\");\n/* harmony import */ var _svgs_Icons_Toggle_ImagePlay__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../svgs/Icons/Toggle/ImagePlay */ \"./src/Presentation/components/UI/svgs/Icons/Toggle/ImagePlay/index.tsx\");\n/* harmony import */ var _containers_ColumnContainer_ColumnContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../containers/ColumnContainer/ColumnContainer */ \"./src/Presentation/components/containers/ColumnContainer/ColumnContainer.tsx\");\n/* harmony import */ var _svgs_Icons_Media_ImageFile__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../svgs/Icons/Media/ImageFile */ \"./src/Presentation/components/UI/svgs/Icons/Media/ImageFile/index.tsx\");\n/* harmony import */ var _useMessagesViewModel__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./useMessagesViewModel */ \"./src/Presentation/components/UI/Dialogs/MessagesView/useMessagesViewModel.ts\");\n/* harmony import */ var _Placeholders_LoaderComponent_LoaderComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../Placeholders/LoaderComponent/LoaderComponent */ \"./src/Presentation/components/UI/Placeholders/LoaderComponent/LoaderComponent.tsx\");\n/* harmony import */ var _Placeholders_ErrorComponent_ErrorComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../Placeholders/ErrorComponent/ErrorComponent */ \"./src/Presentation/components/UI/Placeholders/ErrorComponent/ErrorComponent.tsx\");\n/* harmony import */ var _HeaderMessages_HeaderMessages__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./HeaderMessages/HeaderMessages */ \"./src/Presentation/components/UI/Dialogs/MessagesView/HeaderMessages/HeaderMessages.tsx\");\n/* harmony import */ var _VideoAttachmentComponent_VideoAttachmentComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./VideoAttachmentComponent/VideoAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/VideoAttachmentComponent/VideoAttachmentComponent.tsx\");\n/* harmony import */ var _ImageAttachmentComponent_ImageAttachmentComponent__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./ImageAttachmentComponent/ImageAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/ImageAttachmentComponent/ImageAttachmentComponent.tsx\");\n/* harmony import */ var _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../../../../Domain/entity/DialogTypes */ \"./src/Domain/entity/DialogTypes.ts\");\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQbInitializedDataContext.ts\");\n/* harmony import */ var _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../../../../Domain/repository/Pagination */ \"./src/Domain/repository/Pagination.ts\");\n/* harmony import */ var _utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../../../../utils/DateTimeFormatter */ \"./src/utils/DateTimeFormatter.ts\");\n/* harmony import */ var _svgs_Icons_Contents_User__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../svgs/Icons/Contents/User */ \"./src/Presentation/components/UI/svgs/Icons/Contents/User/index.tsx\");\n/* harmony import */ var _svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../svgs/ActiveSvg/ActiveSvg */ \"./src/Presentation/components/UI/svgs/ActiveSvg/ActiveSvg.tsx\");\n/* harmony import */ var _svgs_Icons_Media_Attachment__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../svgs/Icons/Media/Attachment */ \"./src/Presentation/components/UI/svgs/Icons/Media/Attachment/index.tsx\");\n/* harmony import */ var _svgs_Icons_Actions_Send__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../svgs/Icons/Actions/Send */ \"./src/Presentation/components/UI/svgs/Icons/Actions/Send/index.tsx\");\n/* harmony import */ var _AudioAttachmentComponent_AudioAttachmentComponent__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./AudioAttachmentComponent/AudioAttachmentComponent */ \"./src/Presentation/components/UI/Dialogs/MessagesView/AudioAttachmentComponent/AudioAttachmentComponent.tsx\");\n/* harmony import */ var _svgs_Icons_Media_AudioFile__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../svgs/Icons/Media/AudioFile */ \"./src/Presentation/components/UI/svgs/Icons/Media/AudioFile/index.tsx\");\n/* harmony import */ var _svgs_Icons_Actions_Voice__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../svgs/Icons/Actions/Voice */ \"./src/Presentation/components/UI/svgs/Icons/Actions/Voice/index.tsx\");\n/* harmony import */ var _svgs_Icons_Status_Sent__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../../svgs/Icons/Status/Sent */ \"./src/Presentation/components/UI/svgs/Icons/Status/Sent/index.tsx\");\n/* harmony import */ var _svgs_Icons_Status_ViewedDelivered__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../../svgs/Icons/Status/ViewedDelivered */ \"./src/Presentation/components/UI/svgs/Icons/Status/ViewedDelivered/index.tsx\");\n/* harmony import */ var _utils_parse__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../../../../../utils/parse */ \"./src/utils/parse.ts\");\n/* harmony import */ var _VoiceRecordingProgress_VoiceRecordingProgress__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./VoiceRecordingProgress/VoiceRecordingProgress */ \"./src/Presentation/components/UI/Dialogs/MessagesView/VoiceRecordingProgress/VoiceRecordingProgress.tsx\");\n/* harmony import */ var _HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./HighLightLink/HighLightLink */ \"./src/Presentation/components/UI/Dialogs/MessagesView/HighLightLink/HighLightLink.tsx\");\n/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../../../../../utils/utils */ \"./src/utils/utils.ts\");\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n    function verb(n) { return function (v) { return step([n, v]); }; }\n    function step(op) {\n        if (f) throw new TypeError(\"Generator is already executing.\");\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n            if (y = 0, t) op = [op[0] & 2, t.value];\n            switch (op[0]) {\n                case 0: case 1: t = op; break;\n                case 4: _.label++; return { value: op[1], done: false };\n                case 5: _.label++; y = op[1]; op = [0]; continue;\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\n                default:\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n                    if (t[2]) _.ops.pop();\n                    _.trys.pop(); continue;\n            }\n            op = body.call(thisArg, _);\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n    }\n};\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n// eslint-disable-next-line react/function-component-definition\nvar MessagesView = function (_a) {\n    var _b, _c, _d;\n    var \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    AIEditMessage = _a.AIEditMessage, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    AITranslation = _a.AITranslation, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    AIAnswerToMessage = _a.AIAnswerToMessage, dialogsViewModel = _a.dialogsViewModel, onDialogInformationHandler = _a.onDialogInformationHandler, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _e = _a.maxWidthToResize, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    maxWidthToResize = _e === void 0 ? undefined : _e, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _f = _a.theme, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    theme = _f === void 0 ? undefined : _f, _g = _a.subHeaderContent, subHeaderContent = _g === void 0 ? undefined : _g, _h = _a.upHeaderContent, upHeaderContent = _h === void 0 ? undefined : _h;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var maxWidthToResizing = maxWidthToResize || '$message-view-container-wrapper-min-width';\n    // const maxWidthToResizing = '720px'; // $message-view-container-wrapper-min-width:\n    var currentContext = (0,_providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_17__[\"default\"])();\n    var currentUserId = (_b = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _b === void 0 ? void 0 : _b.userId;\n    var currentUserName = (_c = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _c === void 0 ? void 0 : _c.userName;\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var _j = (0,_providers_QuickBloxUIKitProvider_useQBConnection__WEBPACK_IMPORTED_MODULE_3__[\"default\"])(), connectionRepository = _j.connectionRepository, browserOnline = _j.browserOnline;\n    var _k = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(100), dialogMessagesCount = _k[0], setDialogMessageCount = _k[1];\n    var _l = react__WEBPACK_IMPORTED_MODULE_1___default().useState(true), hasMore = _l[0], setHasMore = _l[1];\n    var _m = react__WEBPACK_IMPORTED_MODULE_1___default().useState(false), scrollUpToDown = _m[0], setScrollUpToDown = _m[1];\n    var _o = react__WEBPACK_IMPORTED_MODULE_1___default().useState([]), messagesToView = _o[0], setMessagesToView = _o[1];\n    var _p = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), waitAIWidget = _p[0], setWaitAIWidget = _p[1];\n    var messageEntitiesToIChatMessageCollection = function (messageEntities) {\n        var MAX_TOKENS = 3584;\n        var items = messageEntities.filter(function (it) {\n            return !it.notification_type ||\n                (it.notification_type && it.notification_type.length === 0);\n        });\n        var messages = (0,_utils_utils__WEBPACK_IMPORTED_MODULE_32__.loopToLimitTokens)(MAX_TOKENS, items, function (_a) {\n            var message = _a.message;\n            return message || '';\n        }).reverse();\n        var chatCompletionMessages = messages.map(function (_a) {\n            var message = _a.message, sender_id = _a.sender_id;\n            return ({\n                role: sender_id === currentUserId ? 'user' : 'assistant',\n                content: message,\n            });\n        });\n        //\n        return chatCompletionMessages;\n    };\n    var messagesViewModel = (0,_useMessagesViewModel__WEBPACK_IMPORTED_MODULE_10__[\"default\"])((_d = dialogsViewModel.entity) === null || _d === void 0 ? void 0 : _d.type, dialogsViewModel.entity);\n    var maxFileSize = currentContext.InitParams.maxFileSize;\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW DIALOG');\n        // messagesViewModel.getMessages(new Pagination());\n        messagesViewModel.entity = dialogsViewModel.entity;\n        setMessagesToView([]);\n    }, [dialogsViewModel.entity]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW ENTITY');\n        messagesViewModel.getMessages(new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_18__.Pagination());\n    }, [messagesViewModel.entity]);\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('HAVE NEW ENTITY');\n        dialogsViewModel.setWaitLoadingStatus(messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading);\n    }, [messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading]);\n    //\n    function prepareFirstPage(initData) {\n        var firstPageSize = messagesViewModel.messages.length < 47\n            ? messagesViewModel.messages.length\n            : 47;\n        // for (let i = 0; i < firstPageSize; i += 1) {\n        for (var i = firstPageSize - 1; i >= 0; i -= 1) {\n            initData.push(messagesViewModel.messages[i]);\n        }\n    }\n    var fetchMoreData = function () {\n        if (messagesToView.length >= dialogMessagesCount) {\n            setHasMore(false);\n            return;\n        }\n        if (hasMore &&\n            messagesToView.length > 0 &&\n            messagesToView.length < dialogMessagesCount) {\n            setMessagesToView(function (prevState) {\n                var newState = __spreadArray([], prevState, true);\n                var newMessageEntity = messagesViewModel.messages[prevState.length];\n                newState.push(newMessageEntity);\n                return newState;\n            });\n        }\n    };\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log('Messages have changed');\n        setDialogMessageCount(((_a = messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.messages) === null || _a === void 0 ? void 0 : _a.length) || 0);\n        if ((messagesToView === null || messagesToView === void 0 ? void 0 : messagesToView.length) === 0 && messagesViewModel.messages.length > 0) {\n            // setDialogMessageCount(messagesViewModel.messages.length);\n            var initData = [];\n            console.log(JSON.stringify(messagesViewModel.messages));\n            prepareFirstPage(initData);\n            setMessagesToView(initData);\n        }\n        else if (messagesViewModel.messages.length - messagesToView.length >= 1) {\n            setHasMore(true);\n            setScrollUpToDown(true);\n        }\n    }, [messagesViewModel.messages]);\n    //\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('dialogMessagesCount have changed');\n        if (messagesViewModel.messages.length - messagesToView.length >= 1) {\n            fetchMoreData();\n        }\n    }, [dialogMessagesCount]);\n    //\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var menuItems = [\n        {\n            title: 'Item 1',\n            action: function () {\n                console.log('Clicked on Item 1');\n            },\n        },\n        {\n            title: 'Item 2',\n            action: function () {\n                console.log('Clicked on Item 2');\n            },\n        },\n        // ... добавьте дополнительные элементы меню\n    ];\n    //\n    var getSenderName = function (sender) {\n        if (!sender)\n            return undefined;\n        return (sender.full_name || sender.login || sender.email || sender.id.toString());\n    };\n    var renderMessage = function (message, index) {\n        var SystemMessage = 'SystemMessage';\n        var IncomingMessage = 'IncomingMessage';\n        var OutgoingMessage = 'OutgoingMessage';\n        console.log('render message: ', JSON.stringify(message), ' index: ', index);\n        var messageView;\n        var checkMessageType = function (m) {\n            if (m.notification_type && m.notification_type.length > 0) {\n                return SystemMessage;\n            }\n            if ((m.sender && m.sender.id.toString() !== (currentUserId === null || currentUserId === void 0 ? void 0 : currentUserId.toString())) ||\n                m.sender_id.toString() !== (currentUserId === null || currentUserId === void 0 ? void 0 : currentUserId.toString())) {\n                return IncomingMessage;\n            }\n            return OutgoingMessage;\n        };\n        var messageTypes = checkMessageType(message);\n        var messageContentRender = function (mc) {\n            var messageText = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: mc.message });\n            var messageContent = messageText;\n            var attachmentContentRender = function (att) {\n                var contentPlaceHolder = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: att.type.toString() });\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.video)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_VideoAttachmentComponent_VideoAttachmentComponent__WEBPACK_IMPORTED_MODULE_14__[\"default\"], { videoFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Toggle_ImagePlay__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.audio)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_AudioAttachmentComponent_AudioAttachmentComponent__WEBPACK_IMPORTED_MODULE_24__[\"default\"], { audioFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_AudioFile__WEBPACK_IMPORTED_MODULE_25__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.image)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ImageAttachmentComponent_ImageAttachmentComponent__WEBPACK_IMPORTED_MODULE_15__[\"default\"], { imageFile: att.file })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_ImageEmpty__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {}));\n                }\n                if (att.type.toString().includes(_Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.text)) {\n                    contentPlaceHolder = att.file ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: \"TEXT\" })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_ImageFile__WEBPACK_IMPORTED_MODULE_9__[\"default\"], { applyZoom: true }));\n                }\n                var contentResult = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container--message-content-wrapper\" }, { children: contentPlaceHolder })));\n                if (att.type === _Domain_entity_FileTypes__WEBPACK_IMPORTED_MODULE_5__.FileType.text) {\n                    contentResult = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--file-message-content-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.caption() } : {}, className: \"message-view-container__file-message-icon\" }, { children: contentPlaceHolder })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: att.name || 'file' })] })));\n                }\n                return contentResult;\n            };\n            if (mc.attachments && mc.attachments.length > 0) {\n                messageContent = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_containers_ColumnContainer_ColumnContainer__WEBPACK_IMPORTED_MODULE_8__[\"default\"], __assign({ maxWidth: \"100%\" }, { children: [mc.attachments.map(function (attachment) {\n                            return attachmentContentRender(attachment);\n                        }), messageText] })));\n            }\n            if ((0,_HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__.messageHasUrls)(mc.message) &&\n                !(mc.attachments && mc.attachments.length > 0)) {\n                return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_HighLightLink_HighLightLink__WEBPACK_IMPORTED_MODULE_31__.HighLightLink, { messageText: mc.message });\n            }\n            return messageContent;\n        };\n        if (messageTypes === SystemMessage) {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--system-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.disabledElements() } : {}, className: \"message-view-container--system-message-wrapper__date_container\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", { children: [(0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getDateShortFormatEU)(message.date_sent), \",\"] }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: message.message })] }), message.id));\n        }\n        else if (messageTypes === IncomingMessage) {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--incoming-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container--incoming-message-wrapper__avatar\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { backgroundColor: theme.disabledElements() } : {}, className: \"message-view-container__sender-avatar\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Contents_User__WEBPACK_IMPORTED_MODULE_20__[\"default\"], { width: \"24\", height: \"24\", applyZoom: true, color: \"var(--secondary-text)\" }) })) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--incoming-message-container\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.secondaryText() } : {}, className: \"message-view-container__sender-name\" }, { children: getSenderName(message.sender) || message.sender_id.toString() })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme\n                                    ? {\n                                        color: theme.mainText(),\n                                        backgroundColor: theme.incomingBackground(),\n                                    }\n                                    : {}, className: \"message-view-container__sender-message\" }, { children: messageContentRender(message) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainText() } : {}, className: \"message-view-container__incoming-time\" }, { children: (0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getTimeShort24hFormat)(message.date_sent) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container__incoming-time\", onClick: function () {\n                            if (!waitAIWidget) {\n                                setWaitAIWidget(true);\n                                AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToWidget(message.message, messageEntitiesToIChatMessageCollection(messagesToView));\n                            }\n                        } }, { children: AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.renderWidget() }))] }), message.id));\n        }\n        else {\n            messageView = ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container--outgoing-message-wrapper\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ className: \"message-view-container__status-message\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ className: \"message-view-container__incoming-time\" }, { children: message.delivered_ids && message.delivered_ids.length > 0 ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Status_ViewedDelivered__WEBPACK_IMPORTED_MODULE_28__[\"default\"], { width: \"13\", height: \"13\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Status_Sent__WEBPACK_IMPORTED_MODULE_27__[\"default\"], { width: \"13\", height: \"13\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' })) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainText() } : {}, className: \"message-view-container__incoming-time\" }, { children: (0,_utils_DateTimeFormatter__WEBPACK_IMPORTED_MODULE_19__.getTimeShort24hFormat)(message.date_sent) }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme\n                            ? {\n                                color: theme.mainText(),\n                                backgroundColor: theme.outgoingBackground(),\n                            }\n                            : {}, className: \"message-view-container__outgoing-message\" }, { children: messageContentRender(message) }))] }), message.id));\n        }\n        return messageView;\n    };\n    var getCountDialogMembers = function (dialogEntity) {\n        var participants = [];\n        if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType.group) {\n            participants = dialogEntity.participantIds;\n        }\n        else if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType[\"private\"]) {\n            participants = [dialogEntity.participantId];\n        }\n        else if (dialogEntity.type === _Domain_entity_DialogTypes__WEBPACK_IMPORTED_MODULE_16__.DialogType[\"public\"]) {\n            participants = [];\n        }\n        return participants.length;\n    };\n    var _q = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null), fileToSend = _q[0], setFileToSend = _q[1];\n    var _r = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), messageText = _r[0], setMessageText = _r[1];\n    var _s = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), warningErrorText = _s[0], setWarningErrorText = _s[1];\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var _t = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''), widgetTextContent = _t[0], setWidgetTextContent = _t[1];\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        setWarningErrorText(messagesViewModel.typingText);\n    }, [messagesViewModel.typingText]);\n    var ChangeFileHandler = function (event) {\n        var reader = new FileReader();\n        var file = event.currentTarget.files\n            ? event.currentTarget.files[0]\n            : null;\n        reader.onloadend = function () {\n            setFileToSend(file);\n        };\n        if (file !== null)\n            reader.readAsDataURL(file);\n    };\n    var showErrorMessage = function (errorMessage) {\n        setWarningErrorText(errorMessage);\n        setTimeout(function () {\n            setWarningErrorText('');\n        }, 3000);\n    };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('have Attachments');\n        var MAXSIZE = maxFileSize || 90 * 1000000;\n        var MAXSIZE_FOR_MESSAGE = MAXSIZE / (1024 * 1024);\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        var flag = (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) && (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) < MAXSIZE;\n        if ((fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) && (fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size) < MAXSIZE) {\n            messagesViewModel.sendAttachmentMessage(fileToSend);\n        }\n        else if (fileToSend) {\n            showErrorMessage(\"file size \".concat(fileToSend === null || fileToSend === void 0 ? void 0 : fileToSend.size, \" must be less then \").concat(MAXSIZE_FOR_MESSAGE, \" mb.\"));\n        }\n    }, [fileToSend]);\n    var _u = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(true), isVoiceMessage = _u[0], setVoiceMessage = _u[1];\n    var _v = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), isRecording = _v[0], setIsRecording = _v[1];\n    //\n    var _w = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), permission = _w[0], setPermission = _w[1];\n    // const [recordingStatus, setRecordingStatus] = useState('inactive');\n    var _x = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(), stream = _x[0], setStream = _x[1];\n    // const [mediaRecorder, setMediaRecorder] = useState<MediaRecorder>();\n    var mediaRecorder = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();\n    var _y = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(), resultAudioBlob = _y[0], setResultAudioBlob = _y[1];\n    var _z = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)([]), audioChunks = _z[0], setAudioChunks = _z[1];\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var mimeType = 'audio/webm;codecs=opus'; // audio/ogg audio/mpeg audio/webm audio/x-wav audio/mp4\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var getMicrophonePermission = function () { return __awaiter(void 0, void 0, void 0, function () {\n        var mediaStream, err_1;\n        return __generator(this, function (_a) {\n            switch (_a.label) {\n                case 0:\n                    if (!window) return [3 /*break*/, 5];\n                    _a.label = 1;\n                case 1:\n                    _a.trys.push([1, 3, , 4]);\n                    return [4 /*yield*/, navigator.mediaDevices.getUserMedia({\n                            audio: true,\n                            video: false,\n                        })];\n                case 2:\n                    mediaStream = _a.sent();\n                    setPermission(true);\n                    setStream(mediaStream);\n                    return [3 /*break*/, 4];\n                case 3:\n                    err_1 = _a.sent();\n                    // setWarningErrorText(\n                    //   'The MediaRecorder API is not supported in your browser.',\n                    // );\n                    showErrorMessage(\"The MediaRecorder API throws exception \".concat((0,_utils_parse__WEBPACK_IMPORTED_MODULE_29__.stringifyError)(err_1), \" .\"));\n                    return [3 /*break*/, 4];\n                case 4: return [3 /*break*/, 6];\n                case 5:\n                    // setWarningErrorText(\n                    //   'The MediaRecorder API is not supported in your browser.',\n                    // );\n                    showErrorMessage('The MediaRecorder API is not supported in your browser.');\n                    _a.label = 6;\n                case 6: return [2 /*return*/];\n            }\n        });\n    }); };\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars,@typescript-eslint/require-await\n    var startRecording = function () { return __awaiter(void 0, void 0, void 0, function () {\n        var mimeContent, media, localAudioChunks;\n        return __generator(this, function (_a) {\n            if (!stream)\n                return [2 /*return*/];\n            mimeContent = window.MediaRecorder.isTypeSupported('audio/mp4;codecs=mp4a')\n                ? 'audio/mp4;codecs=mp4a'\n                : 'audio/webm;codecs=opus';\n            media = new MediaRecorder(stream, { mimeType: mimeContent });\n            mediaRecorder.current = media;\n            mediaRecorder.current.start();\n            localAudioChunks = [];\n            mediaRecorder.current.ondataavailable = function (event) {\n                // const localAudioChunks: any[] = [];\n                if (typeof event.data === 'undefined')\n                    return;\n                if (event.data.size === 0)\n                    return;\n                localAudioChunks.push(event.data);\n                console.log('voice data');\n                // setAudioChunks(localAudioChunks);\n            };\n            setAudioChunks(localAudioChunks);\n            return [2 /*return*/];\n        });\n    }); };\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    var stopRecording = function () {\n        if (!mediaRecorder.current)\n            return;\n        // setRecordingStatus('inactive');\n        mediaRecorder.current.stop();\n        mediaRecorder.current.onstop = function () {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            var mimeContent = window.MediaRecorder.isTypeSupported('audio/mp4;codecs=mp4a')\n                ? 'audio/mp4;codecs=mp4a'\n                : 'audio/webm;codecs=opus';\n            // const audioBlob = new Blob(audioChunks, { type: mimeContent }); // mimeType\n            // const mp4Blob = new Blob(recordedChunks, { type: 'video/mp4' });\n            // const audioBlob = new Blob(audioChunks, { type: 'video/mp4' }); // mimeType\n            var audioBlob = new Blob(audioChunks, { type: 'audio/mp4' }); // mimeType\n            setResultAudioBlob(audioBlob);\n            setAudioChunks([]);\n            //\n            stream === null || stream === void 0 ? void 0 : stream.getAudioTracks().forEach(function (track) {\n                track.stop();\n            });\n            setPermission(false);\n            //\n        };\n    };\n    //\n    var blobToFile = function (theBlob, fileName) {\n        var b = theBlob;\n        // A Blob() is almost a File() - it's just missing the two properties below which we will add\n        b.lastModifiedDate = new Date();\n        b.name = fileName;\n        // Cast to a File() type\n        var resultFile = theBlob;\n        return resultFile;\n    };\n    var _0 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false), useAudioWidget = _0[0], setUseAudioWidget = _0[1];\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var fileExt = 'mp4';\n        if (resultAudioBlob) {\n            var voiceMessage = blobToFile(resultAudioBlob, \"\".concat(currentUserName || '', \"_voice_message.\").concat(fileExt));\n            setFileToSend(voiceMessage);\n            if (useAudioWidget) {\n                setUseAudioWidget(false);\n                AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.fileToWidget(voiceMessage, messageEntitiesToIChatMessageCollection(messagesToView));\n            }\n            //\n        }\n    }, [resultAudioBlob]);\n    // test component version\n    // useEffect(() => {\n    //   if (isRecording) {\n    //     setWarningErrorText(`Your voice is recording during for 1 minute`);\n    //   } else {\n    //     setWarningErrorText('');\n    //   }\n    // }, [isRecording]);\n    // work version below:\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        // setFileToSend(null);\n        if (isRecording) {\n            if (!permission) {\n                // eslint-disable-next-line promise/catch-or-return,promise/always-return\n                getMicrophonePermission().catch(function () {\n                    // setWarningErrorText(`Have no audio.`);\n                    showErrorMessage(\"Have no audio.\");\n                });\n            }\n            else {\n                // eslint-disable-next-line promise/catch-or-return,promise/always-return\n                startRecording().then(function () {\n                    setWarningErrorText(\"Your voice is recording during for 1 minutes\");\n                });\n            }\n        }\n        else {\n            if (permission && mediaRecorder.current) {\n                stopRecording();\n            }\n            setWarningErrorText('');\n        }\n    }, [isRecording]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        if (isRecording && permission) {\n            // eslint-disable-next-line promise/always-return,promise/catch-or-return\n            startRecording().then(function () {\n                setWarningErrorText(\"Your voice is recording during for 1 minutes\");\n            });\n        }\n    }, [permission]);\n    function sendTextMessageActions() {\n        if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n            return;\n        setVoiceMessage(true);\n        if (messageText.length > 0 && messageText.length <= 1000) {\n            var messageTextToSend = messageText;\n            setMessageText('');\n            messagesViewModel.sendTextMessage(messageTextToSend);\n            setMessageText('');\n        }\n        else {\n            setWarningErrorText('length of text message must be less then 1000 chars.');\n            setTimeout(function () {\n                setWarningErrorText('');\n            }, 3000);\n        }\n    }\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        if ((AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.textToContent) &&\n            (AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.textToContent.length) > 0) {\n            setMessageText(AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.textToContent);\n            setWidgetTextContent(AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.textToContent);\n            setTimeout(function () {\n                setWidgetTextContent('');\n            }, 45 * 1000);\n        }\n    }, [AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.textToContent]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        if ((AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.textToContent) &&\n            (AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.textToContent.length) > 0) {\n            setMessageText(AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.textToContent);\n            setWidgetTextContent(AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.textToContent);\n            setTimeout(function () {\n                setWidgetTextContent('');\n            }, 45 * 1000);\n        }\n    }, [AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.textToContent]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        setWaitAIWidget(false);\n        if ((AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToContent) &&\n            (AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToContent.length) > 0) {\n            setMessageText(AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToContent);\n            setWidgetTextContent(AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToContent);\n            setTimeout(function () {\n                setWidgetTextContent('');\n            }, 45 * 1000);\n        }\n    }, [AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.textToContent]);\n    var useSubContent = subHeaderContent || false;\n    var useUpContent = upHeaderContent || false;\n    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: maxWidthToResize\n            ? {\n                maxWidth: \"\".concat(maxWidthToResizing),\n                minWidth: \"$message-view-container-wrapper-min-width\",\n                // width: `${maxWidthToResizing}`,\n                width: '100%',\n            }\n            : {}, className: \"message-view-container\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                    flexGrow: \"1\",\n                    flexShrink: \"1\",\n                    flexBasis: \"\".concat(maxWidthToResizing),\n                }, className: \"message-view-container--header\" }, { children: [useUpContent && upHeaderContent, (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_HeaderMessages_HeaderMessages__WEBPACK_IMPORTED_MODULE_13__[\"default\"], { dialog: messagesViewModel.entity, InformationHandler: onDialogInformationHandler, countMembers: getCountDialogMembers(dialogsViewModel.entity) }), useSubContent && subHeaderContent] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: theme\n                    ? {\n                        flexGrow: \"1\",\n                        flexShrink: \"1\",\n                        flexBasis: \"\".concat(maxWidthToResizing),\n                        backgroundColor: theme.secondaryBackground(), // var(--secondary-background);\n                    }\n                    : {\n                        flexGrow: \"1\",\n                        flexShrink: \"1\",\n                        flexBasis: \"\".concat(maxWidthToResizing),\n                    }, className: \"message-view-container--messages\" }, { children: [(messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.error) && !messagesViewModel.loading && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Placeholders_ErrorComponent_ErrorComponent__WEBPACK_IMPORTED_MODULE_12__[\"default\"], { title: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.error, ClickActionHandler: function () {\n                            alert('call click retry');\n                        } })), messagesViewModel &&\n                        messagesViewModel.messages &&\n                        messagesViewModel.messages.length > 0 &&\n                        messagesToView &&\n                        messagesToView.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containers_ScrollableContainer_ScrollableContainer__WEBPACK_IMPORTED_MODULE_4__[\"default\"], { data: messagesToView, renderItem: renderMessage, onEndReached: fetchMoreData, onEndReachedThreshold: 0.8, refreshing: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading, autoScrollToBottom: scrollUpToDown })), ((messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading) || waitAIWidget) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: {\n                            height: '44px',\n                            width: '44px',\n                        } }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Placeholders_LoaderComponent_LoaderComponent__WEBPACK_IMPORTED_MODULE_11__[\"default\"], { width: \"44\", height: \"44\", color: \"var(--color-background-info)\" }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", __assign({ style: theme ? { color: theme.mainElements() } : {}, className: \"message-view-container--warning-error\" }, { children: warningErrorText }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                    flex: \"flex: 1 1 \".concat(maxWidthToResizing),\n                }, onBlur: function () {\n                    if (!(messageText && messageText.length > 0)) {\n                        setVoiceMessage(true);\n                    }\n                }, className: \"message-view-container--chat-input\" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"label\", __assign({ htmlFor: \"btnUploadAttachment\", style: {\n                            cursor: 'pointer',\n                        } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Media_Attachment__WEBPACK_IMPORTED_MODULE_22__[\"default\"], { width: \"32\", height: \"32\", applyZoom: true, color: theme ? theme.inputElements() : 'var(--input-elements)' }), clickAction: function () {\n                                        console.log('click send message');\n                                    }, touchAction: function () {\n                                        console.log('touch send message');\n                                    } }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", { id: \"btnUploadAttachment\", type: \"file\", accept: \"image/*, audio/*, video/*, .pdf, .txt,\", style: { display: 'none' }, onChange: function (event) {\n                                    ChangeFileHandler(event);\n                                } })] })), !isRecording && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"textarea\", { style: theme ? { backgroundColor: theme.chatInput() } : {}, disabled: messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading, value: messageText, onFocus: function () {\n                            setVoiceMessage(false);\n                        }, onChange: function (event) {\n                            setMessageText(event.target.value);\n                        }, onInput: function () {\n                            messagesViewModel.sendTypingTextMessage();\n                        }, onKeyDown: function (e) {\n                            console.log(\"onKeyDown: \".concat(e.key, \" shift \").concat(e.shiftKey ? 'true' : 'false', \" ctrl \").concat(e.ctrlKey ? 'true' : 'false'));\n                            if (e.key === 'Enter' && !e.shiftKey && !e.ctrlKey) {\n                                sendTextMessageActions();\n                            }\n                        }, placeholder: \"enter text to send\" })), isRecording && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_VoiceRecordingProgress_VoiceRecordingProgress__WEBPACK_IMPORTED_MODULE_30__[\"default\"], { startStatus: isRecording, longRecInSec: 60, ClickActionHandler: function () {\n                            console.log('click send voice message');\n                            if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                return;\n                            setIsRecording(!isRecording);\n                        }, TouchActionHandler: function () {\n                            console.log('touch send voice message');\n                            if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                return;\n                            setIsRecording(!isRecording);\n                        } })), !isVoiceMessage && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Actions_Send__WEBPACK_IMPORTED_MODULE_23__[\"default\"], { width: \"21\", height: \"18\", applyZoom: true, color: theme ? theme.mainElements() : 'var(--main-elements)' }), clickAction: function () {\n                                console.log('click send message');\n                                sendTextMessageActions();\n                            }, touchAction: function () {\n                                console.log('touch send message');\n                            } }) })), isVoiceMessage && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_ActiveSvg_ActiveSvg__WEBPACK_IMPORTED_MODULE_21__[\"default\"], { content: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_svgs_Icons_Actions_Voice__WEBPACK_IMPORTED_MODULE_26__[\"default\"], { width: \"21\", height: \"18\", applyZoom: true, color: isRecording ? 'var(--error)' : 'var(--input-elements)' }), clickAction: function () {\n                                console.log('click send voice message');\n                                if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                    return;\n                                setIsRecording(!isRecording);\n                            }, touchAction: function () {\n                                console.log('touch send message');\n                                if (messagesViewModel === null || messagesViewModel === void 0 ? void 0 : messagesViewModel.loading)\n                                    return;\n                                setIsRecording(!isRecording);\n                            } }) }))] }))] })));\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (MessagesView);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.tsx?");
 
 /***/ }),
 
@@ -2086,6 +2108,17 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 
 /***/ }),
 
+/***/ "./src/Presentation/components/UI/svgs/Icons/Media/AIWidget/index.tsx":
+/*!****************************************************************************!*\
+  !*** ./src/Presentation/components/UI/svgs/Icons/Media/AIWidget/index.tsx ***!
+  \****************************************************************************/
+/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\n\nfunction AIWidgetIcon(theme) {\n    if (theme === void 0) { theme = undefined; }\n    return !(theme === null || theme === void 0 ? void 0 : theme.applyZoom) ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"svg\", __assign({ width: theme && theme.width ? theme.width : '44', height: theme && theme.height ? theme.height : '44', viewBox: \"0 0 44 44\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"path\", { d: \"M2.76833 38.5L41.25 22L2.76833 5.5L2.75 18.3333L30.25 22L2.75 25.6667L2.76833 38.5Z\", id: \"SendB\", fill: theme && theme.color ? theme.color : 'var(--color-icon)' }) }))) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"svg\", __assign({ width: theme && theme.width ? theme.width : '28', height: theme && theme.height ? theme.height : '28', viewBox: \"0 0 22 18\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"path\", { d: \"M18,6 C20.209139,6 22,7.790861 22,10 L22,18 C22,19.9255253 20.6753401,21.786149 18.0260203,23.581871 C18.5654117,21.193957 18.3975027,20 17.5222933,20 L10,20 C7.790861,20 6,18.209139 6,16 L6,10 C6,7.790861 7.790861,6 10,6 L18,6 Z M18,10 L10,10 C9.44771525,10 9,10.4477153 9,11 L9,14 C9,14.5522847 9.44771525,15 10,15 L18,15 C18.5522847,15 19,14.5522847 19,14 L19,11 C19,10.4477153 18.5522847,10 18,10 Z M12,11 C12.5522847,11 13,11.4477153 13,12 L13,13 C13,13.5522847 12.5522847,14 12,14 C11.4477153,14 11,13.5522847 11,13 L11,12 C11,11.4477153 11.4477153,11 12,11 Z M16,11 C16.5522847,11 17,11.4477153 17,12 L17,13 C17,13.5522847 16.5522847,14 16,14 C15.4477153,14 15,13.5522847 15,13 L15,12 C15,11.4477153 15.4477153,11 16,11 Z M4,10 L5,10 L5,10 L5,16 L4,16 C3.44771525,16 3,15.5522847 3,15 L3,11 C3,10.4477153 3.44771525,10 4,10 Z M23,10 L24,10 C24.5522847,10 25,10.4477153 25,11 L25,15 C25,15.5522847 24.5522847,16 24,16 L23,16 L23,16 L23,10 Z\", id: \"AIWidget\", fill: theme && theme.color ? theme.color : 'var(--color-icon)' }) })));\n}\n/*\n\n\n */\n/* harmony default export */ __webpack_exports__[\"default\"] = (AIWidgetIcon);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/UI/svgs/Icons/Media/AIWidget/index.tsx?");
+
+/***/ }),
+
 /***/ "./src/Presentation/components/UI/svgs/Icons/Media/Attachment/index.tsx":
 /*!******************************************************************************!*\
   !*** ./src/Presentation/components/UI/svgs/Icons/Media/Attachment/index.tsx ***!
@@ -2346,7 +2379,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQbInitializedDataContext.ts\");\n/* harmony import */ var _Views_Dialogs_Dialogs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../Views/Dialogs/Dialogs */ \"./src/Presentation/Views/Dialogs/Dialogs.tsx\");\n/* harmony import */ var _UI_Dialogs_DialogInformation_DialogInformation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../UI/Dialogs/DialogInformation/DialogInformation */ \"./src/Presentation/components/UI/Dialogs/DialogInformation/DialogInformation.tsx\");\n/* harmony import */ var _DesktopLayout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./DesktopLayout */ \"./src/Presentation/components/layouts/Desktop/DesktopLayout.tsx\");\n/* harmony import */ var _UI_Dialogs_MessagesView_MessagesView__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../UI/Dialogs/MessagesView/MessagesView */ \"./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.tsx\");\n/* harmony import */ var _Views_Dialogs_useDialogsViewModel__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../Views/Dialogs/useDialogsViewModel */ \"./src/Presentation/Views/Dialogs/useDialogsViewModel.ts\");\n/* harmony import */ var _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../Domain/repository/Pagination */ \"./src/Domain/repository/Pagination.ts\");\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\n\n\n// import { Configuration, OpenAIApi } from 'openai';\n\n\n\n\n\n\n\nvar QuickBloxUIKitDesktopLayout = function (_a) {\n    var _b, _c;\n    var _d = _a.theme, theme = _d === void 0 ? undefined : _d;\n    console.log('create QuickBloxUIKitDesktopLayout');\n    var _e = react__WEBPACK_IMPORTED_MODULE_1___default().useState(), selectedDialog = _e[0], setSelectedDialog = _e[1];\n    var currentContext = (0,_providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_2__[\"default\"])();\n    // const eventMessaging = useEventMessagesRepository();\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    var userName = (_b = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _b === void 0 ? void 0 : _b.userName;\n    var userId = (_c = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _c === void 0 ? void 0 : _c.userId;\n    var dialogsViewModel = (0,_Views_Dialogs_useDialogsViewModel__WEBPACK_IMPORTED_MODULE_7__[\"default\"])(currentContext);\n    // let defaultLeftPlaceHolderInputWidget = InputWidgetToLeftPlaceHolder; // useDefaultTextInputWidget();\n    //\n    // if (!defaultLeftPlaceHolderInputWidget) {\n    //   defaultLeftPlaceHolderInputWidget = useDefaultTextInputWidget();\n    // }\n    // const defaultRightPlaceHolderInputWidget =\n    //   InputWidgetToRightPlaceHolder || useDefaultVoiceInputWidget();\n    // let defaultIncomingMessageWidget = IncomingMessageWidgetToRightPlaceHolder;\n    //\n    // if (!defaultIncomingMessageWidget) {\n    //   const apiKey = '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'; // Замените на ваш реальный ключ API\n    //\n    //   const openAIConfiguration = new Configuration({\n    //     apiKey,\n    //   });\n    //\n    //   const openAIApi = new OpenAIApi(openAIConfiguration);\n    //\n    //   defaultIncomingMessageWidget = UseDefaultIncomingMessageWidget({\n    //     openAIApi,\n    //   });\n    // }\n    var selectDialogActions = function (item) {\n        if (!dialogsViewModel.loading) {\n            setSelectedDialog(item);\n        }\n    };\n    // const subscribeToDialogEventsUseCase: SubscribeToDialogEventsUseCase =\n    //   new SubscribeToDialogEventsUseCase(eventMessaging, 'TestStage');\n    // инициализация СДК и загрузка тестовых данных, запуск пинга - может не быть\n    // todo: добавить метод в контекст\n    var isAuthProcessed = function () {\n        console.log('call isAuthProcessed');\n        var result = currentContext.storage.REMOTE_DATA_SOURCE.needInit === false &&\n            currentContext.storage.REMOTE_DATA_SOURCE.authProcessed &&\n            currentContext.storage.CONNECTION_REPOSITORY.needInit === false;\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.REMOTE_DATA_SOURCE_MOCK.needInit: \".concat(currentContext.storage.REMOTE_DATA_SOURCE.needInit));\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.REMOTE_DATA_SOURCE_MOCK.authProcessed: \".concat(currentContext.storage.REMOTE_DATA_SOURCE.authProcessed));\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.CONNECTION_REPOSITORY.needInit: \".concat(currentContext.storage.CONNECTION_REPOSITORY.needInit));\n        return result;\n    };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('TestStage: GET DATA ');\n        console.log(\"auth data: \".concat(JSON.stringify(currentContext.InitParams.loginData), \" at \").concat(new Date().toLocaleTimeString()));\n        if (isAuthProcessed()) {\n            console.log('auth is completed, CAN GET DATA');\n            var pagination = new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__.Pagination();\n            dialogsViewModel === null || dialogsViewModel === void 0 ? void 0 : dialogsViewModel.getDialogs(pagination);\n        }\n        return function () {\n            console.log('TestStage: USE EFFECT release');\n            dialogsViewModel.release();\n        };\n    }, []); // сейчас это выполняется один раз при старте, а нужно каждый раз при смене пользователя\n    // const dialogsEventHandler = (dialogInfo: DialogEventInfo) => {\n    //   console.log('call dialogsEventHandler in QuickBloxUIKitDesktopLayout');\n    //   if (dialogInfo.eventMessageType === EventMessageType.SystemMessage) {\n    //     switch (dialogInfo.notificationTypes) {\n    //       case NotificationTypes.DELETE_LEAVE_DIALOG: {\n    //         if (\n    //           dialogInfo.messageInfo &&\n    //           dialogInfo.messageInfo.sender_id === userId\n    //         ) {\n    //           setSelectedDialog(undefined);\n    //         }\n    //\n    //         break;\n    //       }\n    //       default: {\n    //         const pagination: Pagination = new Pagination();\n    //\n    //         dialogsViewModel?.getDialogs(pagination);\n    //         break;\n    //       }\n    //     }\n    //   }\n    // };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('TestStage: GET DATA AFTER User data has CHANGED');\n        console.log(\"auth is \".concat(JSON.stringify(currentContext.InitParams.loginData), \" at \").concat(new Date().toLocaleTimeString()));\n        if (isAuthProcessed()) {\n            console.log('auth is completed, FETCH DATA');\n            var pagination = new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__.Pagination();\n            dialogsViewModel === null || dialogsViewModel === void 0 ? void 0 : dialogsViewModel.getDialogs(pagination);\n            //\n            // console.log('auth is completed, subscribe');\n            //\n            // subscribeToDialogEventsUseCase\n            //   .execute(dialogsEventHandler)\n            //   .catch((reason) => {\n            //     console.log(stringifyError(reason));\n            //   });\n            // //\n            // console.log('subscribe is completed, go');\n        }\n    }, [currentContext.InitParams]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log(\"TestStage: selectedDialog: \".concat(((_a = selectedDialog === null || selectedDialog === void 0 ? void 0 : selectedDialog.entity) === null || _a === void 0 ? void 0 : _a.name) || 'Dialog Name is empty'));\n        if (selectedDialog && selectedDialog.entity) {\n            dialogsViewModel.entity = selectedDialog.entity;\n        }\n    }, [selectedDialog]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log(\"Clear selected dialog: \".concat(((_a = selectedDialog === null || selectedDialog === void 0 ? void 0 : selectedDialog.entity) === null || _a === void 0 ? void 0 : _a.name) || 'Dialog Name is empty'));\n        if (!dialogsViewModel.entity) {\n            setSelectedDialog(undefined);\n        }\n    }, [dialogsViewModel.entity]);\n    var _f = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(true), needDialogInformation = _f[0], setNeedDialogInformation = _f[1];\n    var informationCloseHandler = function () {\n        setNeedDialogInformation(false);\n    };\n    var informationOpenHandler = function () {\n        setNeedDialogInformation(true);\n    };\n    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DesktopLayout__WEBPACK_IMPORTED_MODULE_5__[\"default\"], { theme: theme, dialogsView: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Views_Dialogs_Dialogs__WEBPACK_IMPORTED_MODULE_3__[\"default\"]\n        // subHeaderContent={<CompanyLogo />}\n        // upHeaderContent={<CompanyLogo />}\n        , { \n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            dialogsViewModel: dialogsViewModel, onDialogSelectHandler: selectDialogActions, additionalSettings: {\n                withoutHeader: false,\n                themeHeader: theme,\n                themePreview: theme,\n                useSubHeader: false,\n                useUpHeader: false,\n            } }), dialogMessagesView: selectedDialog && selectedDialog.entity && dialogsViewModel.entity ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_UI_Dialogs_MessagesView_MessagesView__WEBPACK_IMPORTED_MODULE_6__[\"default\"]\n        // subHeaderContent={<CompanyLogo />}\n        // upHeaderContent={<CompanyLogo />}\n        , { \n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            dialogsViewModel: dialogsViewModel, onDialogInformationHandler: informationOpenHandler, maxWidthToResize: selectedDialog && needDialogInformation ? undefined : '1040px', \n            // InputWidgetToLeftPlaceHolder={defaultLeftPlaceHolderInputWidget}\n            // InputWidgetToRightPlaceHolder={defaultRightPlaceHolderInputWidget}\n            // IncomingMessageWidgetToRightPlaceHolder={\n            //   defaultIncomingMessageWidget\n            // }\n            theme: theme }) // 1 Get Messages + 1 Get User by Id\n        ) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                minHeight: '799px',\n                minWidth: '1040px',\n                border: '1px solid var(--divider)',\n                margin: '0 auto',\n            } }, { children: [\"You login as \", userName, \"(\", userId, \"). Select chat to start conversation.\"] }))), dialogInfoView: \n        // 1 Get User by 1 + Get user by name\n        (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: selectedDialog && needDialogInformation && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_UI_Dialogs_DialogInformation_DialogInformation__WEBPACK_IMPORTED_MODULE_4__[\"default\"]\n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            , { \n                // subHeaderContent={<CompanyLogo />}\n                // upHeaderContent={<CompanyLogo />}\n                dialog: selectedDialog.entity, dialogViewModel: dialogsViewModel, onCloseDialogInformationHandler: informationCloseHandler })) }) }));\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (QuickBloxUIKitDesktopLayout);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/layouts/Desktop/QuickBloxUIKitDesktopLayout.tsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"./node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext */ \"./src/Presentation/components/providers/QuickBloxUIKitProvider/useQbInitializedDataContext.ts\");\n/* harmony import */ var _Views_Dialogs_Dialogs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../Views/Dialogs/Dialogs */ \"./src/Presentation/Views/Dialogs/Dialogs.tsx\");\n/* harmony import */ var _UI_Dialogs_DialogInformation_DialogInformation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../UI/Dialogs/DialogInformation/DialogInformation */ \"./src/Presentation/components/UI/Dialogs/DialogInformation/DialogInformation.tsx\");\n/* harmony import */ var _DesktopLayout__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./DesktopLayout */ \"./src/Presentation/components/layouts/Desktop/DesktopLayout.tsx\");\n/* harmony import */ var _UI_Dialogs_MessagesView_MessagesView__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../UI/Dialogs/MessagesView/MessagesView */ \"./src/Presentation/components/UI/Dialogs/MessagesView/MessagesView.tsx\");\n/* harmony import */ var _Views_Dialogs_useDialogsViewModel__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../Views/Dialogs/useDialogsViewModel */ \"./src/Presentation/Views/Dialogs/useDialogsViewModel.ts\");\n/* harmony import */ var _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../Domain/repository/Pagination */ \"./src/Domain/repository/Pagination.ts\");\n/* harmony import */ var _QBconfig__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../QBconfig */ \"./src/QBconfig.ts\");\n/* harmony import */ var _UI_Dialogs_MessagesView_AIWidgets_UseDefaultAIAssistAnswerWidgetWithProxy__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy */ \"./src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.tsx\");\nvar __assign = (undefined && undefined.__assign) || function () {\n    __assign = Object.assign || function(t) {\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\n            s = arguments[i];\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))\n                t[p] = s[p];\n        }\n        return t;\n    };\n    return __assign.apply(this, arguments);\n};\n\n\n\n\n\n\n\n\n\n\n\nvar QuickBloxUIKitDesktopLayout = function (_a) {\n    var _b, _c, _d;\n    var _e = _a.theme, theme = _e === void 0 ? undefined : _e, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _f = _a.AITranslation, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    AITranslation = _f === void 0 ? undefined : _f, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    _g = _a.AIEditMessage, \n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    AIEditMessage = _g === void 0 ? undefined : _g, _h = _a.AIAnswerToMessage, AIAnswerToMessage = _h === void 0 ? undefined : _h;\n    console.log('create QuickBloxUIKitDesktopLayout');\n    var _j = react__WEBPACK_IMPORTED_MODULE_1___default().useState(), selectedDialog = _j[0], setSelectedDialog = _j[1];\n    var currentContext = (0,_providers_QuickBloxUIKitProvider_useQbInitializedDataContext__WEBPACK_IMPORTED_MODULE_2__[\"default\"])();\n    // const eventMessaging = useEventMessagesRepository();\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    var userName = (_b = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _b === void 0 ? void 0 : _b.userName;\n    var userId = (_c = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _c === void 0 ? void 0 : _c.userId;\n    var sessionToken = (_d = currentContext.storage.REMOTE_DATA_SOURCE.authInformation) === null || _d === void 0 ? void 0 : _d.sessionToken;\n    var dialogsViewModel = (0,_Views_Dialogs_useDialogsViewModel__WEBPACK_IMPORTED_MODULE_7__[\"default\"])(currentContext);\n    var defaultAIEditMessageWidget = AIEditMessage === null || AIEditMessage === void 0 ? void 0 : AIEditMessage.AIWidget; // useDefaultTextInputWidget();\n    var defaultAITranslateWidget = AITranslation === null || AITranslation === void 0 ? void 0 : AITranslation.AIWidget;\n    // if (!defaultAIEditMessageWidget) {\n    //   defaultAIEditMessageWidget = useDefaultTextInputWidget();\n    // }\n    // const defaultAITranslateWidget =\n    //   AITranslation?.AIWidget || useDefaultVoiceInputWidget();\n    var defaultAIAnswerToMessageWidget;\n    var getAIAssistAnswer = function () {\n        if ((AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.enabled) && !(AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.default)) {\n            defaultAIAnswerToMessageWidget = AIAnswerToMessage.AIWidget;\n        }\n        else if ((AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.enabled) ||\n            _QBconfig__WEBPACK_IMPORTED_MODULE_9__.QBConfig.configAIApi.AIAnswerAssistWidgetConfig.useDefault) {\n            if (!_QBconfig__WEBPACK_IMPORTED_MODULE_9__.QBConfig.configAIApi.AIAnswerAssistWidgetConfig.useDefault ||\n                (AIAnswerToMessage && !(AIAnswerToMessage === null || AIAnswerToMessage === void 0 ? void 0 : AIAnswerToMessage.default))) {\n                defaultAIAnswerToMessageWidget = undefined;\n            }\n            else {\n                var apiKey = _QBconfig__WEBPACK_IMPORTED_MODULE_9__.QBConfig.configAIApi.AIAnswerAssistWidgetConfig.apiKey;\n                var token = '';\n                if (apiKey) {\n                    token = apiKey;\n                }\n                else {\n                    token =\n                        _QBconfig__WEBPACK_IMPORTED_MODULE_9__.QBConfig.configAIApi.AIAnswerAssistWidgetConfig.proxyConfig.sessionToken ||\n                            sessionToken ||\n                            '';\n                }\n                defaultAIAnswerToMessageWidget =\n                    (0,_UI_Dialogs_MessagesView_AIWidgets_UseDefaultAIAssistAnswerWidgetWithProxy__WEBPACK_IMPORTED_MODULE_10__[\"default\"])(__assign(__assign({}, _QBconfig__WEBPACK_IMPORTED_MODULE_9__.QBConfig.configAIApi.AIAnswerAssistWidgetConfig.proxyConfig), { sessionToken: token }));\n            }\n        }\n    };\n    getAIAssistAnswer();\n    var selectDialogActions = function (item) {\n        if (!dialogsViewModel.loading) {\n            setSelectedDialog(item);\n        }\n    };\n    // const subscribeToDialogEventsUseCase: SubscribeToDialogEventsUseCase =\n    //   new SubscribeToDialogEventsUseCase(eventMessaging, 'TestStage');\n    // инициализация СДК и загрузка тестовых данных, запуск пинга - может не быть\n    // todo: добавить метод в контекст\n    var isAuthProcessed = function () {\n        console.log('call isAuthProcessed');\n        var result = currentContext.storage.REMOTE_DATA_SOURCE.needInit === false &&\n            currentContext.storage.REMOTE_DATA_SOURCE.authProcessed &&\n            currentContext.storage.CONNECTION_REPOSITORY.needInit === false;\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.REMOTE_DATA_SOURCE_MOCK.needInit: \".concat(currentContext.storage.REMOTE_DATA_SOURCE.needInit));\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.REMOTE_DATA_SOURCE_MOCK.authProcessed: \".concat(currentContext.storage.REMOTE_DATA_SOURCE.authProcessed));\n        console.log(\n        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n        \"initialValue.CONNECTION_REPOSITORY.needInit: \".concat(currentContext.storage.CONNECTION_REPOSITORY.needInit));\n        return result;\n    };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('TestStage: GET DATA ');\n        console.log(\"auth data: \".concat(JSON.stringify(currentContext.InitParams.loginData), \" at \").concat(new Date().toLocaleTimeString()));\n        if (isAuthProcessed()) {\n            console.log('auth is completed, CAN GET DATA');\n            var pagination = new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__.Pagination();\n            dialogsViewModel === null || dialogsViewModel === void 0 ? void 0 : dialogsViewModel.getDialogs(pagination);\n        }\n        return function () {\n            console.log('TestStage: USE EFFECT release');\n            dialogsViewModel.release();\n        };\n    }, []); // сейчас это выполняется один раз при старте, а нужно каждый раз при смене пользователя\n    // const dialogsEventHandler = (dialogInfo: DialogEventInfo) => {\n    //   console.log('call dialogsEventHandler in QuickBloxUIKitDesktopLayout');\n    //   if (dialogInfo.eventMessageType === EventMessageType.SystemMessage) {\n    //     switch (dialogInfo.notificationTypes) {\n    //       case NotificationTypes.DELETE_LEAVE_DIALOG: {\n    //         if (\n    //           dialogInfo.messageInfo &&\n    //           dialogInfo.messageInfo.sender_id === userId\n    //         ) {\n    //           setSelectedDialog(undefined);\n    //         }\n    //\n    //         break;\n    //       }\n    //       default: {\n    //         const pagination: Pagination = new Pagination();\n    //\n    //         dialogsViewModel?.getDialogs(pagination);\n    //         break;\n    //       }\n    //     }\n    //   }\n    // };\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        console.log('TestStage: GET DATA AFTER User data has CHANGED');\n        console.log(\"auth is \".concat(JSON.stringify(currentContext.InitParams.loginData), \" at \").concat(new Date().toLocaleTimeString()));\n        if (isAuthProcessed()) {\n            console.log('auth is completed, FETCH DATA');\n            var pagination = new _Domain_repository_Pagination__WEBPACK_IMPORTED_MODULE_8__.Pagination();\n            dialogsViewModel === null || dialogsViewModel === void 0 ? void 0 : dialogsViewModel.getDialogs(pagination);\n            //\n            // console.log('auth is completed, subscribe');\n            //\n            // subscribeToDialogEventsUseCase\n            //   .execute(dialogsEventHandler)\n            //   .catch((reason) => {\n            //     console.log(stringifyError(reason));\n            //   });\n            // //\n            // console.log('subscribe is completed, go');\n        }\n    }, [currentContext.InitParams]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log(\"TestStage: selectedDialog: \".concat(((_a = selectedDialog === null || selectedDialog === void 0 ? void 0 : selectedDialog.entity) === null || _a === void 0 ? void 0 : _a.name) || 'Dialog Name is empty'));\n        if (selectedDialog && selectedDialog.entity) {\n            dialogsViewModel.entity = selectedDialog.entity;\n        }\n    }, [selectedDialog]);\n    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {\n        var _a;\n        console.log(\"Clear selected dialog: \".concat(((_a = selectedDialog === null || selectedDialog === void 0 ? void 0 : selectedDialog.entity) === null || _a === void 0 ? void 0 : _a.name) || 'Dialog Name is empty'));\n        if (!dialogsViewModel.entity) {\n            setSelectedDialog(undefined);\n        }\n    }, [dialogsViewModel.entity]);\n    var _k = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(true), needDialogInformation = _k[0], setNeedDialogInformation = _k[1];\n    var informationCloseHandler = function () {\n        setNeedDialogInformation(false);\n    };\n    var informationOpenHandler = function () {\n        setNeedDialogInformation(true);\n    };\n    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DesktopLayout__WEBPACK_IMPORTED_MODULE_5__[\"default\"], { theme: theme, dialogsView: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Views_Dialogs_Dialogs__WEBPACK_IMPORTED_MODULE_3__[\"default\"]\n        // subHeaderContent={<CompanyLogo />}\n        // upHeaderContent={<CompanyLogo />}\n        , { \n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            dialogsViewModel: dialogsViewModel, onDialogSelectHandler: selectDialogActions, additionalSettings: {\n                withoutHeader: false,\n                themeHeader: theme,\n                themePreview: theme,\n                useSubHeader: false,\n                useUpHeader: false,\n            } }), dialogMessagesView: selectedDialog && selectedDialog.entity && dialogsViewModel.entity ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_UI_Dialogs_MessagesView_MessagesView__WEBPACK_IMPORTED_MODULE_6__[\"default\"]\n        // subHeaderContent={<CompanyLogo />}\n        // upHeaderContent={<CompanyLogo />}\n        , { \n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            dialogsViewModel: dialogsViewModel, onDialogInformationHandler: informationOpenHandler, maxWidthToResize: selectedDialog && needDialogInformation ? undefined : '1040px', AIEditMessage: defaultAIEditMessageWidget, AITranslation: defaultAITranslateWidget, AIAnswerToMessage: defaultAIAnswerToMessageWidget, theme: theme }) // 1 Get Messages + 1 Get User by Id\n        ) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", __assign({ style: {\n                minHeight: '799px',\n                minWidth: '1040px',\n                border: '1px solid var(--divider)',\n                margin: '0 auto',\n            } }, { children: [\"You login as \", userName, \"(\", userId, \"). Select chat to start conversation.\"] }))), dialogInfoView: \n        // 1 Get User by 1 + Get user by name\n        (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", { children: selectedDialog && needDialogInformation && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_UI_Dialogs_DialogInformation_DialogInformation__WEBPACK_IMPORTED_MODULE_4__[\"default\"]\n            // subHeaderContent={<CompanyLogo />}\n            // upHeaderContent={<CompanyLogo />}\n            , { \n                // subHeaderContent={<CompanyLogo />}\n                // upHeaderContent={<CompanyLogo />}\n                dialog: selectedDialog.entity, dialogViewModel: dialogsViewModel, onCloseDialogInformationHandler: informationCloseHandler })) }) }));\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (QuickBloxUIKitDesktopLayout);\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/Presentation/components/layouts/Desktop/QuickBloxUIKitDesktopLayout.tsx?");
 
 /***/ }),
 
@@ -2445,7 +2478,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var reac
 /***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"QBConfig\": function() { return /* binding */ QBConfig; }\n/* harmony export */ });\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n    function verb(n) { return function (v) { return step([n, v]); }; }\n    function step(op) {\n        if (f) throw new TypeError(\"Generator is already executing.\");\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n            if (y = 0, t) op = [op[0] & 2, t.value];\n            switch (op[0]) {\n                case 0: case 1: t = op; break;\n                case 4: _.label++; return { value: op[1], done: false };\n                case 5: _.label++; y = op[1]; op = [0]; continue;\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\n                default:\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n                    if (t[2]) _.ops.pop();\n                    _.trys.pop(); continue;\n            }\n            op = body.call(thisArg, _);\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n    }\n};\nvar QBConfig = {\n    credentials: {\n        appId: -1,\n        accountKey: '',\n        authKey: '',\n        authSecret: '',\n        sessionToken: '',\n    },\n    configAIApi: {\n        AIAnswerAssistWidgetConfig: {\n            apiKey: '',\n            useDefault: true,\n            proxyConfig: {\n                // https://api.openai.com/v1/chat/completions'\n                api: 'v1/chat/completions',\n                servername: 'https://myproxy.com',\n                port: '4032',\n                sessionToken: '',\n            },\n        },\n    },\n    appConfig: {\n        maxFileSize: 10 * 1024 * 1024,\n        sessionTimeOut: 122,\n        chatProtocol: {\n            active: 2,\n        },\n        debug: true,\n        endpoints: {\n            api: 'api.quickblox.com',\n            chat: 'chat.quickblox.com',\n        },\n        on: {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars,@typescript-eslint/require-await\n            sessionExpired: function (handleResponse, retry) {\n                return __awaiter(this, void 0, void 0, function () {\n                    return __generator(this, function (_a) {\n                        console.log(\n                        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n                        \"QBconfig sessionExpired handle: \".concat(handleResponse, \" \").concat(retry));\n                        return [2 /*return*/];\n                    });\n                });\n            },\n        },\n        streamManagement: {\n            enable: true,\n        },\n    },\n};\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/QBconfig.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"QBConfig\": function() { return /* binding */ QBConfig; }\n/* harmony export */ });\nvar __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __generator = (undefined && undefined.__generator) || function (thisArg, body) {\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\n    function verb(n) { return function (v) { return step([n, v]); }; }\n    function step(op) {\n        if (f) throw new TypeError(\"Generator is already executing.\");\n        while (g && (g = 0, op[0] && (_ = 0)), _) try {\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\n            if (y = 0, t) op = [op[0] & 2, t.value];\n            switch (op[0]) {\n                case 0: case 1: t = op; break;\n                case 4: _.label++; return { value: op[1], done: false };\n                case 5: _.label++; y = op[1]; op = [0]; continue;\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\n                default:\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\n                    if (t[2]) _.ops.pop();\n                    _.trys.pop(); continue;\n            }\n            op = body.call(thisArg, _);\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\n    }\n};\nvar QBConfig = {\n    credentials: {\n        appId: -1,\n        accountKey: '',\n        authKey: '',\n        authSecret: '',\n        sessionToken: '',\n    },\n    configAIApi: {\n        AIAnswerAssistWidgetConfig: {\n            apiKey: '',\n            useDefault: true,\n            proxyConfig: {\n                api: 'v1/chat/completions',\n                servername: 'https://api.openai.com/',\n                port: '',\n                sessionToken: '',\n            },\n        },\n    },\n    appConfig: {\n        maxFileSize: 10 * 1024 * 1024,\n        sessionTimeOut: 122,\n        chatProtocol: {\n            active: 2,\n        },\n        debug: true,\n        endpoints: {\n            api: 'api.quickblox.com',\n            chat: 'chat.quickblox.com',\n        },\n        on: {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars,@typescript-eslint/require-await\n            sessionExpired: function (handleResponse, retry) {\n                return __awaiter(this, void 0, void 0, function () {\n                    return __generator(this, function (_a) {\n                        console.log(\n                        // eslint-disable-next-line @typescript-eslint/restrict-template-expressions\n                        \"QBconfig sessionExpired handle: \".concat(handleResponse, \" \").concat(retry));\n                        return [2 /*return*/];\n                    });\n                });\n            },\n        },\n        streamManagement: {\n            enable: true,\n        },\n    },\n};\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/QBconfig.ts?");
 
 /***/ }),
 
@@ -2493,6 +2526,17 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
+/***/ "./src/utils/utils.ts":
+/*!****************************!*\
+  !*** ./src/utils/utils.ts ***!
+  \****************************/
+/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"completeSentence\": function() { return /* binding */ completeSentence; },\n/* harmony export */   \"loopToLimitTokens\": function() { return /* binding */ loopToLimitTokens; },\n/* harmony export */   \"tokenCounter\": function() { return /* binding */ tokenCounter; }\n/* harmony export */ });\n// import { encode } from 'gpt-3-encoder';\nvar __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\n        if (ar || !(i in from)) {\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\n            ar[i] = from[i];\n        }\n    }\n    return to.concat(ar || Array.prototype.slice.call(from));\n};\nvar completeSentence = function (text) {\n    return (text === null || text === void 0 ? void 0 : text.replace(/([^.!?;]+)[^.!?;]*$/, ' ...')) || '';\n};\n// export const tokenCounter = (text?: string) => (text ? encode(text).length : 0);\nvar tokenCounter = function (text) { return (text ? text.length / 4 : 0); };\nvar loopToLimitTokens = function (limit, data, getValue, tokens) {\n    if (getValue === void 0) { getValue = function (item) {\n        return typeof item === 'string' ? item : String(item);\n    }; }\n    if (tokens === void 0) { tokens = 0; }\n    if (!data.length) {\n        return [];\n    }\n    var firstItem = data[0], lastItems = data.slice(1);\n    var itemValue = getValue(firstItem);\n    var itemTokens = tokenCounter(itemValue);\n    var amountTokens = tokens + itemTokens;\n    if (amountTokens <= limit) {\n        var nextData = loopToLimitTokens(limit, lastItems, getValue, amountTokens);\n        return itemTokens === 0 ? nextData : __spreadArray([firstItem], nextData, true);\n    }\n    return [];\n};\n\n\n//# sourceURL=webpack://quickblox-react-ui-kit/./src/utils/utils.ts?");
+
+/***/ }),
+
 /***/ "react":
 /*!************************!*\
   !*** external "react" ***!

package/dist/utils/utils.d.ts

@@ -0,0 +1,3 @@
+export declare const completeSentence: (text?: string) => string;
+export declare const tokenCounter: (text?: string) => number;
+export declare const loopToLimitTokens: <T>(limit: number, data: T[], getValue?: (item: T) => string, tokens?: number) => T[];