From 0bf4cec83c36d07f84c68c0f51cfb98c99a07b57 Mon Sep 17 00:00:00 2001
From: Lei OT <lyt@hainatravel.com>
Date: Fri, 15 Mar 2024 21:43:30 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E5=8F=91=E9=80=81=E5=A4=B1=E8=B4=A5?=
 =?UTF-8?q?=E7=9A=84=E6=B6=88=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/msgUtils.js                                 | 4 ++--
 src/views/ChatHistory.jsx                           | 1 +
 src/views/Conversations/Components/MessagesList.jsx | 1 +
 src/views/Conversations/Conversations.css           | 7 ++++++-
 4 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/lib/msgUtils.js b/src/lib/msgUtils.js
index 02265c2..ea6ae58 100644
--- a/src/lib/msgUtils.js
+++ b/src/lib/msgUtils.js
@@ -268,7 +268,7 @@ export const whatsappMsgTypeMapped = {
       data: {
         id: msg.wamid,
         uri: msg.image.link,
-        width: '100%',
+        width: 'auto',
         height: 200,
         alt: msg.image.caption,
         status: {
@@ -282,7 +282,7 @@ export const whatsappMsgTypeMapped = {
     renderForReply: (msg) => ({
       id: msg.wamid,
       photoURL: msg.image.link,
-      width: '100%',
+      width: 'auto',
       height: 200,
       alt: msg.image?.caption || '',
     }),
diff --git a/src/views/ChatHistory.jsx b/src/views/ChatHistory.jsx
index 1455452..1e6880c 100644
--- a/src/views/ChatHistory.jsx
+++ b/src/views/ChatHistory.jsx
@@ -343,6 +343,7 @@ function ChatHistory() {
                         message.whatsapp_msg_type === 'sticker' ? 'bg-transparent' : '',
                         message.sender === 'me' ? 'whatsappme-container' : '',
                         focusMsg === message.id ? 'message-box-focus' : '',
+                        message.status === 'failed' ? 'failed-msg' : '',
                       ].join(' ')}
                       style={{
                         backgroundColor: message.sender === 'me' ? '#ccd4ae' : '#fff',
diff --git a/src/views/Conversations/Components/MessagesList.jsx b/src/views/Conversations/Components/MessagesList.jsx
index 4e8e18d..e66cd3f 100644
--- a/src/views/Conversations/Components/MessagesList.jsx
+++ b/src/views/Conversations/Components/MessagesList.jsx
@@ -111,6 +111,7 @@ const MessagesList = ({ messages, handlePreview, reference, longListLoading, get
               message.whatsapp_msg_type === 'sticker' ? 'bg-transparent' : '',
               message.sender === 'me' ? 'whatsappme-container' : '',
               focusMsg === message.id ? 'message-box-focus' : '',
+              message.status === 'failed' ? 'failed-msg' : '',
             ].join(' ')}
             {...(message.type === 'meetingLink'
               ? {
diff --git a/src/views/Conversations/Conversations.css b/src/views/Conversations/Conversations.css
index 5b312be..950cf7b 100644
--- a/src/views/Conversations/Conversations.css
+++ b/src/views/Conversations/Conversations.css
@@ -134,7 +134,12 @@
     content: none;
 }
 .chatwindow-wrapper .rce-mbox-photo--img img{
-    width: 100%;
+    width: auto;
+}
+.chatwindow-wrapper .failed-msg .rce-mbox-photo--img,
+.chatwindow-wrapper .failed-msg .rce-mbox-video--video
+{
+    filter: blur(2px) opacity(0.7);
 }
 .chatwindow-wrapper .rce-mbox-photo .rce-mbox-text{
     padding-left: 8px;