whyuzeim 1.1.49 → 1.1.51

package/cjs/ChatBox/index.js

@@ -13,6 +13,8 @@ var _slicedToArray = require('@babel/runtime-corejs3/helpers/esm/slicedToArray')
 var _regeneratorRuntime = require('@babel/runtime-corejs3/regenerator');
 var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
 var _Date$now = require('@babel/runtime-corejs3/core-js-stable/date/now');
+var _trimInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/trim');
+var _findInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/find');
 var React = require('react');
 var agoraChatUikit = require('agora-chat-uikit');
 require('./style/index.scss');
@@ -40,7 +42,8 @@ var Chatbox = function Chatbox(props) {
     theme = _useContext.theme;
   var onBack = props.onBack;
   var _useConversationConte = agoraChatUikit.useConversationContext(),
-    currentConversation = _useConversationConte.currentConversation;
+    currentConversation = _useConversationConte.currentConversation,
+    conversationList = _useConversationConte.conversationList;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isTopMenuOpen = _useState2[0],
@@ -587,6 +590,11 @@ var Chatbox = function Chatbox(props) {
     var _ref12 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
       var userid,
         content,
+        cuiScrollList,
+        cuiScrollListWrap,
+        htmlString,
+        template,
+        node,
         _args4 = arguments;
       return _regeneratorRuntime.wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
@@ -594,6 +602,20 @@ var Chatbox = function Chatbox(props) {
             userid = _args4.length > 0 && _args4[0] !== undefined ? _args4[0] : "";
             content = _args4.length > 1 && _args4[1] !== undefined ? _args4[1] : "";
             if (isAgent) {
+              cuiScrollList = document.querySelector(".cui-messageList .cui-scrollList div");
+              cuiScrollListWrap = document.querySelector(".cui-messageList .cui-scrollList");
+              if (cuiScrollList) {
+                htmlString = "<div id=\"agent-generating-loader\" class=\"cui-messageList-msgItem\"><div><div class=\"thread-container\"><div id=\"1393207307050949578\" class=\"cui-message-base cui-message-base-left cui-message-base-hasAvatar cui-message-base-secondly cui-message-base-square cui-message-base-dark\"><img src=\"/icon/im/avatar_default.svg\" class=\"w-[48px] h-[48px] rounded-full overflow-hidden object-fit\"><div class=\"cui-message-base-box\"><div class=\"cui-message-base-info\"></div><div class=\"cui-message-base-body\"><div class=\"cui-message-base-content\" style=\"background: var(--im-msg-bubble-color-left); border-radius: 9px; padding: 10px 12px; color: var(--im-msg-bubble-font-color);\"><div style=\"display:flex;align-items:center\"><div class=\"generating-loader-wrap\"><div class=\"generating-loader\"></div></div><span class=\"cui-message-text\">Generating</span></div></div><div class=\"cui-message-base-time-and-status-box\"><span class=\"cui-message-status cui-message-status-icon\"></span><span class=\"cui-message-base-time\"></span></div></div></div></div></div></div><div class=\"cui-modal-root\"><div tabindex=\"-1\" class=\"cui-modal-wrap modify-message-modal\" style=\"display: none;\"></div></div></div>";
+                template = document.createElement('template');
+                template.innerHTML = _trimInstanceProperty(htmlString).call(htmlString);
+                node = template.content.firstChild;
+                if (node) {
+                  cuiScrollList.appendChild(node);
+                  cuiScrollListWrap === null || cuiScrollListWrap === void 0 || cuiScrollListWrap.scrollTo({
+                    top: 1000000000
+                  });
+                }
+              }
               tools.reportAgentMsg(http, userid, content);
             }
           case 3:
@@ -632,6 +654,16 @@ var Chatbox = function Chatbox(props) {
       setRightComponent && setRightComponent(undefined);
     }
   }, [currentConversation]);
+  React.useEffect(function () {
+    var _conversationList$fin;
+    var cuiScrollList = document.querySelector(".cui-messageList .cui-scrollList div");
+    var generatingLoader = document.querySelector("#agent-generating-loader");
+    if (cuiScrollList && generatingLoader && ((_conversationList$fin = _findInstanceProperty(conversationList).call(conversationList, function (item) {
+      return item.conversationId === agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId;
+    })) === null || _conversationList$fin === void 0 || (_conversationList$fin = _conversationList$fin.lastMessage) === null || _conversationList$fin === void 0 ? void 0 : _conversationList$fin.to) !== agoraChatUikit.rootStore.conversationStore.currentCvs.conversationId) {
+      cuiScrollList.removeChild(generatingLoader);
+    }
+  }, [conversationList]);
   return /*#__PURE__*/React.createElement("div", {
     className: "yuze_chat_container w-full h-full overflow-hidden flex flex-col"
   }, currentConversation.conversationId && customHeader(), /*#__PURE__*/React.createElement(agoraChatUikit.Chat, {

package/es/ChatBox/index.js

@@ -11,8 +11,10 @@ import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
 import _regeneratorRuntime from '@babel/runtime-corejs3/regenerator';
 import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
 import _Date$now from '@babel/runtime-corejs3/core-js-stable/date/now';
+import _trimInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/trim';
+import _findInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/find';
 import React, { useContext, useState, useEffect } from 'react';
-import { useClient, useConversationContext, Chat, MessageList, rootStore, Tooltip, ImageMessage, FileMessage, VideoMessage, AudioMessage, BaseMessage, TextMessage } from 'agora-chat-uikit';
+import { useClient, useConversationContext, rootStore, Chat, MessageList, Tooltip, ImageMessage, FileMessage, VideoMessage, AudioMessage, BaseMessage, TextMessage } from 'agora-chat-uikit';
 import './style/index.scss';
 import img$2 from './image/ic_more.svg.js';
 import img from './image/ic_chat_back.svg.js';
@@ -38,7 +40,8 @@ var Chatbox = function Chatbox(props) {
     theme = _useContext.theme;
   var onBack = props.onBack;
   var _useConversationConte = useConversationContext(),
-    currentConversation = _useConversationConte.currentConversation;
+    currentConversation = _useConversationConte.currentConversation,
+    conversationList = _useConversationConte.conversationList;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isTopMenuOpen = _useState2[0],
@@ -585,6 +588,11 @@ var Chatbox = function Chatbox(props) {
     var _ref12 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
       var userid,
         content,
+        cuiScrollList,
+        cuiScrollListWrap,
+        htmlString,
+        template,
+        node,
         _args4 = arguments;
       return _regeneratorRuntime.wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
@@ -592,6 +600,20 @@ var Chatbox = function Chatbox(props) {
             userid = _args4.length > 0 && _args4[0] !== undefined ? _args4[0] : "";
             content = _args4.length > 1 && _args4[1] !== undefined ? _args4[1] : "";
             if (isAgent) {
+              cuiScrollList = document.querySelector(".cui-messageList .cui-scrollList div");
+              cuiScrollListWrap = document.querySelector(".cui-messageList .cui-scrollList");
+              if (cuiScrollList) {
+                htmlString = "<div id=\"agent-generating-loader\" class=\"cui-messageList-msgItem\"><div><div class=\"thread-container\"><div id=\"1393207307050949578\" class=\"cui-message-base cui-message-base-left cui-message-base-hasAvatar cui-message-base-secondly cui-message-base-square cui-message-base-dark\"><img src=\"/icon/im/avatar_default.svg\" class=\"w-[48px] h-[48px] rounded-full overflow-hidden object-fit\"><div class=\"cui-message-base-box\"><div class=\"cui-message-base-info\"></div><div class=\"cui-message-base-body\"><div class=\"cui-message-base-content\" style=\"background: var(--im-msg-bubble-color-left); border-radius: 9px; padding: 10px 12px; color: var(--im-msg-bubble-font-color);\"><div style=\"display:flex;align-items:center\"><div class=\"generating-loader-wrap\"><div class=\"generating-loader\"></div></div><span class=\"cui-message-text\">Generating</span></div></div><div class=\"cui-message-base-time-and-status-box\"><span class=\"cui-message-status cui-message-status-icon\"></span><span class=\"cui-message-base-time\"></span></div></div></div></div></div></div><div class=\"cui-modal-root\"><div tabindex=\"-1\" class=\"cui-modal-wrap modify-message-modal\" style=\"display: none;\"></div></div></div>";
+                template = document.createElement('template');
+                template.innerHTML = _trimInstanceProperty(htmlString).call(htmlString);
+                node = template.content.firstChild;
+                if (node) {
+                  cuiScrollList.appendChild(node);
+                  cuiScrollListWrap === null || cuiScrollListWrap === void 0 || cuiScrollListWrap.scrollTo({
+                    top: 1000000000
+                  });
+                }
+              }
               reportAgentMsg(http, userid, content);
             }
           case 3:
@@ -630,6 +652,16 @@ var Chatbox = function Chatbox(props) {
       setRightComponent && setRightComponent(undefined);
     }
   }, [currentConversation]);
+  useEffect(function () {
+    var _conversationList$fin;
+    var cuiScrollList = document.querySelector(".cui-messageList .cui-scrollList div");
+    var generatingLoader = document.querySelector("#agent-generating-loader");
+    if (cuiScrollList && generatingLoader && ((_conversationList$fin = _findInstanceProperty(conversationList).call(conversationList, function (item) {
+      return item.conversationId === rootStore.conversationStore.currentCvs.conversationId;
+    })) === null || _conversationList$fin === void 0 || (_conversationList$fin = _conversationList$fin.lastMessage) === null || _conversationList$fin === void 0 ? void 0 : _conversationList$fin.to) !== rootStore.conversationStore.currentCvs.conversationId) {
+      cuiScrollList.removeChild(generatingLoader);
+    }
+  }, [conversationList]);
   return /*#__PURE__*/React.createElement("div", {
     className: "yuze_chat_container w-full h-full overflow-hidden flex flex-col"
   }, currentConversation.conversationId && customHeader(), /*#__PURE__*/React.createElement(Chat, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "whyuzeim",
-  "version": "1.1.49",
+  "version": "1.1.51",
   "description": "im componenets",
   "main": "cjs/index.js",
   "module": "es/index.js",