From 78b8c508d85ca58d8c7494ef355eb70ffe2dc066 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 27 Feb 2025 03:01:05 +0530
Subject: [PATCH] fix: message bubble styling for better text wrapping

---
 .../features/conversation/message/AgentMessageBubble.vue  | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/features/conversation/message/AgentMessageBubble.vue b/frontend/src/features/conversation/message/AgentMessageBubble.vue
index 02f464fe..123bebcd 100644
--- a/frontend/src/features/conversation/message/AgentMessageBubble.vue
+++ b/frontend/src/features/conversation/message/AgentMessageBubble.vue
@@ -21,7 +21,7 @@
         <!-- Message Content -->
         <div
           v-dompurify-html="messageContent"
-          class="break-words break-all"
+          class="whitespace-pre-wrap break-words overflow-wrap-anywhere"
           :class="{ 'mb-3': message.attachments.length > 0 }"
         />
 
@@ -129,3 +129,9 @@ const retryMessage = (msg) => {
   api.retryMessage(convStore.current.uuid, msg.uuid)
 }
 </script>
+
+<style scoped>
+.overflow-wrap-anywhere {
+  overflow-wrap: anywhere;
+}
+</style>