fix displaying message warning

wireapp · Feb 28, 2024 · 4727f52 · 4727f52
1 parent 19f3269
commit 4727f52
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 10 deletions.
diff --git a/src/script/components/MessagesList/Message/ContentMessage/ContentMessage.tsx b/src/script/components/MessagesList/Message/ContentMessage/ContentMessage.tsx
@@ -243,14 +243,6 @@ export const ContentMessageComponent = ({
           />
         )}
 
-        {[StatusType.FAILED, StatusType.FEDERATION_ERROR].includes(status) && (
-          <CompleteFailureToSendWarning
-            {...(status === StatusType.FEDERATION_ERROR && {unreachableDomain: conversation.domain})}
-            isMessageFocused={msgFocusState}
-            onRetry={() => onRetry(message)}
-          />
-        )}
-
         {isAssetMessage && (
           <ReadIndicator
             message={message}
@@ -274,6 +266,14 @@ export const ContentMessageComponent = ({
         )}
       </div>
 
+      {[StatusType.FAILED, StatusType.FEDERATION_ERROR].includes(status) && (
+        <CompleteFailureToSendWarning
+          {...(status === StatusType.FEDERATION_ERROR && {unreachableDomain: conversation.domain})}
+          isMessageFocused={msgFocusState}
+          onRetry={() => onRetry(message)}
+        />
+      )}
+
       {!!reactions.length && (
         <MessageReactionsList
           reactions={reactions}

diff --git a/...sagesList/Message/ContentMessage/Warnings/CompleteFailureToSend/CompleteFailureToSend.tsx b/...sagesList/Message/ContentMessage/Warnings/CompleteFailureToSend/CompleteFailureToSend.tsx
@@ -36,7 +36,7 @@ const config = Config.getConfig();
 export const CompleteFailureToSendWarning = ({isMessageFocused, onRetry, unreachableDomain}: Props) => {
   const messageFocusedTabIndex = useMessageFocusedTabIndex(isMessageFocused);
   return (
-    <>
+    <div className="message-warning">
       {unreachableDomain ? (
         <p>
           <span
@@ -64,6 +64,6 @@ export const CompleteFailureToSendWarning = ({isMessageFocused, onRetry, unreach
           {t('messageCouldNotBeSentRetry')}
         </Button>
       </div>
-    </>
+    </div>
   );
 };
diff --git a/src/style/content/conversation/message-list.less b/src/style/content/conversation/message-list.less
@@ -271,6 +271,15 @@
   outline-offset: 0.4rem;
 }
 
+.message-warning {
+  padding-left: var(--conversation-message-sender-width);
+  margin-top: 6px;
+
+  button {
+    margin-block: 4px 0;
+  }
+}
+
 // MESSAGE - BODY
 .message-body {
   position: relative;