From 11aa6c74357dadadc5a954223112374271b2a7e6 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 15 Dec 2021 19:47:57 +0000
Subject: [PATCH] Don't show a message bubble around polls (#7374)

* Don't show a message bubble around polls

* Update res/css/views/rooms/_EventBubbleTile.scss
---
 res/css/views/rooms/_EventBubbleTile.scss | 4 ++++
 src/components/views/rooms/EventTile.tsx  | 2 ++
 src/utils/EventUtils.ts                   | 9 +++++++--
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/res/css/views/rooms/_EventBubbleTile.scss b/res/css/views/rooms/_EventBubbleTile.scss
index 7e2a1ec45e..d42339cf64 100644
--- a/res/css/views/rooms/_EventBubbleTile.scss
+++ b/res/css/views/rooms/_EventBubbleTile.scss
@@ -312,6 +312,10 @@ limitations under the License.
     }
 }
 
+.mx_EventTile.mx_EventTile_noBubble[data-layout=bubble] {
+    --backgroundColor: transparent;
+}
+
 .mx_EventTile.mx_EventTile_bubbleContainer[data-layout=bubble],
 .mx_EventTile.mx_EventTile_leftAlignedBubble[data-layout=bubble],
 .mx_EventTile.mx_EventTile_info[data-layout=bubble],
diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx
index 2db9b311ea..e35c7286f6 100644
--- a/src/components/views/rooms/EventTile.tsx
+++ b/src/components/views/rooms/EventTile.tsx
@@ -1067,6 +1067,7 @@ export default class EventTile extends React.Component<IProps, IState> {
             isBubbleMessage,
             isInfoMessage,
             isLeftAlignedBubbleMessage,
+            noBubbleEvent,
         } = getEventDisplayInfo(this.props.mxEvent);
         const { isQuoteExpanded } = this.state;
 
@@ -1121,6 +1122,7 @@ export default class EventTile extends React.Component<IProps, IState> {
             mx_EventTile_emote: msgtype === 'm.emote',
             mx_EventTile_noSender: this.props.hideSender,
             mx_EventTile_clamp: this.props.tileShape === TileShape.ThreadPanel,
+            mx_EventTile_noBubble: noBubbleEvent,
         });
 
         // If the tile is in the Sending state, don't speak the message.
diff --git a/src/utils/EventUtils.ts b/src/utils/EventUtils.ts
index 5a7332301b..95ee1b14c6 100644
--- a/src/utils/EventUtils.ts
+++ b/src/utils/EventUtils.ts
@@ -119,6 +119,7 @@ export function getEventDisplayInfo(mxEvent: MatrixEvent): {
     tileHandler: string;
     isBubbleMessage: boolean;
     isLeftAlignedBubbleMessage: boolean;
+    noBubbleEvent: boolean;
 } {
     const content = mxEvent.getContent();
     const msgtype = content.msgtype;
@@ -144,7 +145,11 @@ export function getEventDisplayInfo(mxEvent: MatrixEvent): {
         eventType !== EventType.RoomMessage &&
         eventType !== EventType.Sticker &&
         eventType !== EventType.RoomCreate &&
-        eventType !== POLL_START_EVENT_TYPE.name
+        !POLL_START_EVENT_TYPE.matches(eventType)
+    );
+    // Some non-info messages want to be rendered in the appropriate bubble column but without the bubble background
+    const noBubbleEvent = (
+        POLL_START_EVENT_TYPE.matches(eventType)
     );
 
     // If we're showing hidden events in the timeline, we should use the
@@ -158,7 +163,7 @@ export function getEventDisplayInfo(mxEvent: MatrixEvent): {
         isInfoMessage = true;
     }
 
-    return { tileHandler, isInfoMessage, isBubbleMessage, isLeftAlignedBubbleMessage };
+    return { tileHandler, isInfoMessage, isBubbleMessage, isLeftAlignedBubbleMessage, noBubbleEvent };
 }
 
 export function isVoiceMessage(mxEvent: MatrixEvent): boolean {