From b9e3942ed81d916265c6eababf4ce903527e0505 Mon Sep 17 00:00:00 2001
From: Enrico Ros <enrico.ros@gmail.com>
Date: Thu, 25 Apr 2024 10:45:51 -0700
Subject: [PATCH] ChatMessage: fix broken overflow

---
 src/apps/chat/components/message/ChatMessage.tsx | 3 +--
 src/modules/beam/scatter/BeamScatterInput.tsx    | 2 +-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/apps/chat/components/message/ChatMessage.tsx b/src/apps/chat/components/message/ChatMessage.tsx
index 46db15013..b26f728ba 100644
--- a/src/apps/chat/components/message/ChatMessage.tsx
+++ b/src/apps/chat/components/message/ChatMessage.tsx
@@ -556,8 +556,7 @@ export function ChatMessage(props: {
         '&:hover > button': { opacity: 1 },
 
         // layout
-        display: 'grid',
-        gap: 1,
+        display: 'block', // this is Needed, otherwise there will be a horizontal overflow
 
         ...props.sx,
       }}
diff --git a/src/modules/beam/scatter/BeamScatterInput.tsx b/src/modules/beam/scatter/BeamScatterInput.tsx
index 830cc418d..bf851e9c9 100644
--- a/src/modules/beam/scatter/BeamScatterInput.tsx
+++ b/src/modules/beam/scatter/BeamScatterInput.tsx
@@ -71,7 +71,7 @@ export function BeamScatterInput(props: {
   const userMessageDecorator = React.useMemo(() => {
     return (/*showHistoryMessage &&*/ otherHistoryCount >= 1 && scatterShowPrevMessages) ? (
       // <Chip color='primary' variant='outlined' endDecorator={<ChipDelete />} sx={{ my: 1 }}>
-      <Typography level='body-xs' sx={{ my: 1, mx: 'auto', color: 'neutral.softColor' }} onClick={undefined /*() => setShowHistoryMessage(on => !on)*/}>
+      <Typography level='body-xs' sx={{ my: 1, textAlign: 'center', color: 'neutral.softColor' }} onClick={undefined /*() => setShowHistoryMessage(on => !on)*/}>
         ... {otherHistoryCount === 1 ? (isFirstMessageSystem ? '1 system message' : '1 message') : `${otherHistoryCount} messages`} before this one ...
       </Typography>
       // </Chip>