From fc2cdba317e6f9777ed84d8c12d9c4c7240a61ff Mon Sep 17 00:00:00 2001
From: Ajay Bura <32841439+ajbura@users.noreply.github.com>
Date: Sun, 14 Sep 2025 15:21:28 +0530
Subject: [PATCH] add bubble layout for event content

---
 .../components/message/content/EventContent.tsx    | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/app/components/message/content/EventContent.tsx b/src/app/components/message/content/EventContent.tsx
index 97ff26f7..9eaa7aa9 100644
--- a/src/app/components/message/content/EventContent.tsx
+++ b/src/app/components/message/content/EventContent.tsx
@@ -1,6 +1,6 @@
 import { Box, Icon, IconSrc } from 'folds';
 import React, { ReactNode } from 'react';
-import { CompactLayout, ModernLayout } from '..';
+import { BubbleLayout, CompactLayout, ModernLayout } from '..';
 import { MessageLayout } from '../../../state/settings';
 
 export type EventContentProps = {
@@ -30,9 +30,11 @@ export function EventContent({ messageLayout, time, iconSrc, content }: EventCon
     </Box>
   );
 
-  return messageLayout === MessageLayout.Compact ? (
-    <CompactLayout before={beforeJSX}>{msgContentJSX}</CompactLayout>
-  ) : (
-    <ModernLayout before={beforeJSX}>{msgContentJSX}</ModernLayout>
-  );
+  if (messageLayout === MessageLayout.Compact) {
+    return <CompactLayout before={beforeJSX}>{msgContentJSX}</CompactLayout>;
+  }
+  if (messageLayout === MessageLayout.Bubble) {
+    return <BubbleLayout before={beforeJSX}>{msgContentJSX}</BubbleLayout>;
+  }
+  <ModernLayout before={beforeJSX}>{msgContentJSX}</ModernLayout>;
 }