From 2f0eb8fb05a6f856ec9e38612200fd42b2a225eb Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Mon, 20 Nov 2023 17:27:54 +0000
Subject: [PATCH] Fix ended polls overlapping event bubbles (#11895)

* Fix ended polls overlapping event bubbles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 res/css/views/rooms/_EventBubbleTile.pcss                    | 5 +++++
 src/components/views/messages/MPollEndBody.tsx               | 2 +-
 .../views/messages/__snapshots__/MPollEndBody-test.tsx.snap  | 4 +++-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/res/css/views/rooms/_EventBubbleTile.pcss b/res/css/views/rooms/_EventBubbleTile.pcss
index f9901788dd..ad94b3c58e 100644
--- a/res/css/views/rooms/_EventBubbleTile.pcss
+++ b/res/css/views/rooms/_EventBubbleTile.pcss
@@ -358,6 +358,11 @@ limitations under the License.
             // Keep height equal to text for shield alignment, additional 2px because of 1px padding on text
             height: calc($font-18px + 2px);
         }
+
+        .mx_MPollEndBody {
+            // Prevent the poll end body from exceeding the tile width
+            width: 100%;
+        }
     }
 
     &:not(.mx_EventTile_noBubble) .mx_EventTile_line:not(.mx_EventTile_mediaLine) {
diff --git a/src/components/views/messages/MPollEndBody.tsx b/src/components/views/messages/MPollEndBody.tsx
index d83502f581..4e104d7cef 100644
--- a/src/components/views/messages/MPollEndBody.tsx
+++ b/src/components/views/messages/MPollEndBody.tsx
@@ -108,7 +108,7 @@ export const MPollEndBody = React.forwardRef<any, IBodyProps>(({ mxEvent, ...pro
     }
 
     return (
-        <div ref={ref}>
+        <div className="mx_MPollEndBody" ref={ref}>
             <Caption>{_t("timeline|m.poll.end|ended")}</Caption>
             <MPollBody mxEvent={pollStartEvent} {...props} />
         </div>
diff --git a/test/components/views/messages/__snapshots__/MPollEndBody-test.tsx.snap b/test/components/views/messages/__snapshots__/MPollEndBody-test.tsx.snap
index bad7c2d129..ac2603d89d 100644
--- a/test/components/views/messages/__snapshots__/MPollEndBody-test.tsx.snap
+++ b/test/components/views/messages/__snapshots__/MPollEndBody-test.tsx.snap
@@ -10,7 +10,9 @@ exports[`<MPollEndBody /> when poll start event does not exist in current timeli
 
 exports[`<MPollEndBody /> when poll start event exists in current timeline renders an ended poll 1`] = `
 <div>
-  <div>
+  <div
+    class="mx_MPollEndBody"
+  >
     <span
       class="mx_Caption"
     >