diff --git a/src/lib/msgUtils.js b/src/lib/msgUtils.js index 2ffb741..d76112f 100644 --- a/src/lib/msgUtils.js +++ b/src/lib/msgUtils.js @@ -31,7 +31,7 @@ export const sentMsgTypeMapped = { renderId: msg.id, to: msg.to, msgtype: 'text', - msgcontent: { body: msg.text, ...(msg.context ? { context: msg.context, message_origin: msg.message_origin } : {}) }, + msgcontent: { body: msg.text, ...(msg.context ? { context: msg.context, message_origin: msg.message_origin.origin } : {}) }, }), contentToRender: (msg) => ({ ...msg, @@ -39,7 +39,7 @@ export const sentMsgTypeMapped = { conversationid: msg.id.split('.')[0], ...(msg.context ? { - reply: { message: msg.message_origin.text, title: msg.message_origin.senderName || 'Reference' }, + reply: { message: msg.message_origin.text, title: msg.message_origin.senderName || 'Reference', titleColor: "#53bdeb", }, } : {}), }), @@ -63,7 +63,7 @@ export const sentMsgTypeMapped = { conversationid: msg.id.split('.')[0], ...(msg.context ? { - reply: { message: msg.message_origin.text, title: msg.message_origin.senderName || 'Reference' }, + reply: { message: msg.message_origin.text, title: msg.message_origin.senderName || 'Reference', titleColor: "#53bdeb", }, } : {}), }), @@ -91,7 +91,7 @@ const whatsappMsgMapped = { 'whatsapp.inbound_message.received': { getMsg: (result) => { console.log('whatsapp.inbound_message.received', result); - return isEmpty(result?.whatsappInboundMessage) ? null : { ...result.whatsappInboundMessage, conversationid: result.conversationid }; + return isEmpty(result?.whatsappInboundMessage) ? null : { ...result.whatsappInboundMessage, conversationid: result.conversationid, messageorigin: result.messageorigin }; }, contentToRender: (contentObj) => { console.log('whatsapp.inbound_message.received to render', contentObj); @@ -165,6 +165,7 @@ export const whatsappMsgTypeMapped = { text: { type: 'text', data: (msg) => ({ id: msg.wamid, text: msg.text.body }), + renderForReply: (msg) => ({ id: msg.wamid, message: msg.text.body }), }, image: { type: 'photo', @@ -216,7 +217,7 @@ export const whatsappMsgTypeMapped = { unsupported: { type: 'system', data: (msg) => ({ text: 'Message type is currently not supported.' }) }, reaction: { type: 'text', - data: (msg) => ({ id: msg.wamid, text: msg.reaction?.emoji || msg.reaction?.text?.body || 'Reaction', reply: { message: '{content}', title: 'React from', titleColor: '#1ba784' } }), // todo: + data: (msg) => ({ id: msg.wamid, text: msg.reaction?.emoji || '', }), // todo: }, document: { type: 'file', @@ -257,12 +258,17 @@ export const parseRenderMessageItem = (msg) => { whatsapp_name: msg?.customerProfile?.name || '', whatsapp_phone_number: msg.from, whatsapp_msg_type: msg.type, - ...(isEmpty(msg.context) + ...(isEmpty(msg.context) && isEmpty(msg.reaction) ? {} : { reply: { - message: `${msg.context.id}`, // todo: msg.context.text?.body || msg.context.text, - title: msg?.customerProfile?.name || msg.from, + /** + * reply: { message: msg.messageorigin, title: 'React from', titleColor: '#1ba784' } + */ + ...(typeof whatsappMsgTypeMapped[msg?.messageorigin?.type]?.renderForReply === 'function' + ? whatsappMsgTypeMapped[msg.messageorigin.type].renderForReply(msg.messageorigin) + : {}), + title: '@', // todo: 按方向显示, 不要显示号码 // msg?.customerProfile?.name titleColor: "#53bdeb", // "#128c7e", }, origin: msg.context, @@ -279,6 +285,7 @@ export const parseRenderMessageList = (messages, conversationid = null) => { const msgType = msgContent.type; // const parseMethod = msgContent.bizType === 'whatsapp' ? cloneDeep(whatsappMsgTypeMapped) : {}; return { + origin: msgContent, ...(whatsappMsgTypeMapped?.[msgType]?.data(msgContent) || {}), type: msgContent.type, ...(typeof whatsappMsgTypeMapped[msgType].type === 'function' ? whatsappMsgTypeMapped[msgType].type(msg) : { type: whatsappMsgTypeMapped[msgType].type || 'text' }), diff --git a/src/views/Conversations/ChatWindow.jsx b/src/views/Conversations/ChatWindow.jsx index 76dcda7..c498262 100644 --- a/src/views/Conversations/ChatWindow.jsx +++ b/src/views/Conversations/ChatWindow.jsx @@ -1,6 +1,6 @@ import { useEffect, useState } from 'react'; import { Layout, Spin, Button } from 'antd'; -import { RightCircleOutlined, RightOutlined, MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons'; +import { RightCircleOutlined, RightOutlined, ReloadOutlined, MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons'; // import { useParams, useNavigate } from 'react-router-dom'; import MessagesHeader from './Components/MessagesHeader'; import Messages from './Components/Messages'; @@ -52,9 +52,10 @@ const ChatWindow = () => { -
+
diff --git a/src/views/Conversations/Components/ConversationsList.jsx b/src/views/Conversations/Components/ConversationsList.jsx index de79ac8..3fe8bd7 100644 --- a/src/views/Conversations/Components/ConversationsList.jsx +++ b/src/views/Conversations/Components/ConversationsList.jsx @@ -3,11 +3,7 @@ import { useParams, useNavigate, useLocation } from 'react-router-dom'; import { Button, Dropdown } from 'antd'; import { MoreOutlined } from '@ant-design/icons'; import { useAuthContext } from '@/stores/AuthContext'; -import { - fetchOrderConversationsList, - fetchConversationItemClose, - fetchMessages, -} from '@/actions/ConversationActions'; +import { fetchOrderConversationsList, fetchConversationItemClose, fetchMessages } from '@/actions/ConversationActions'; import { ChatList, } from 'react-chat-elements'; import { isEmpty } from '@/utils/utils'; import useConversationStore from '@/stores/ConversationStore'; @@ -103,7 +99,7 @@ const Conversations = () => { }; const switchConversation = async (item) => { const messagesList = activeConversations[`${item.sn}`] || []; - if (isEmpty(messagesList)) { + if (messagesList.length < 20) { const data = await fetchMessages({ opisn: userId, whatsappid: item.whatsapp_phone_number }); receivedMessageList(item.sn, data); }