From f02d55ae8b5f876f5de12e12bc606a4edf696f6c Mon Sep 17 00:00:00 2001
From: "sp.wack" <83104063+amanape@users.noreply.github.com>
Date: Thu, 27 Feb 2025 21:21:43 +0400
Subject: [PATCH] hotfix(frontend): Truncate long conversation card titles
 (#7001)

---
 .../features/conversation-panel/conversation-card.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/features/conversation-panel/conversation-card.tsx b/frontend/src/components/features/conversation-panel/conversation-card.tsx
index f9b52f3857..19a82be117 100644
--- a/frontend/src/components/features/conversation-panel/conversation-card.tsx
+++ b/frontend/src/components/features/conversation-panel/conversation-card.tsx
@@ -101,9 +101,11 @@ export function ConversationCard({
           "h-auto w-fit rounded-xl border border-[#525252]",
       )}
     >
-      <div className="flex items-center justify-between">
-        <div className="flex items-center gap-2 w-full">
-          {isActive && <span className="w-2 h-2 bg-blue-500 rounded-full" />}
+      <div className="flex items-center justify-between w-full">
+        <div className="flex items-center gap-2 flex-1 min-w-0 overflow-hidden mr-2">
+          {isActive && (
+            <span className="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0" />
+          )}
           {titleMode === "edit" && (
             <input
               ref={inputRef}
@@ -119,7 +121,8 @@ export function ConversationCard({
           {titleMode === "view" && (
             <p
               data-testid="conversation-card-title"
-              className="text-sm leading-6 font-semibold bg-transparent w-full"
+              className="text-sm leading-6 font-semibold bg-transparent truncate overflow-hidden"
+              title={title}
             >
               {title}
             </p>