From 82966c3f7a6420723cf4e48ba18895a5e1fda29a Mon Sep 17 00:00:00 2001
From: vinu tv <vinutv91@gmail.com>
Date: Wed, 16 Oct 2024 13:56:38 +0530
Subject: [PATCH] Implement truncation for sidebar user card username to handle
 overflow

---
 src/Components/Common/Sidebar/SidebarUserCard.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/Components/Common/Sidebar/SidebarUserCard.tsx b/src/Components/Common/Sidebar/SidebarUserCard.tsx
index aafaf96a87f..f963f5a2860 100644
--- a/src/Components/Common/Sidebar/SidebarUserCard.tsx
+++ b/src/Components/Common/Sidebar/SidebarUserCard.tsx
@@ -43,11 +43,13 @@ const SidebarUserCard: React.FC<SidebarUserCardProps> = ({ shrinked }) => {
                   className="w-8 text-sm font-medium"
                 />
               </div>
-              {!shrinked && (
-                <span className="flex w-full grow items-center pl-1 text-xs font-medium tracking-wide">
-                  {formatName(user)}
-                </span>
-              )}
+              <div className="max-w-32">
+                {!shrinked && (
+                  <p className="truncate pl-1 text-xs font-medium tracking-wide">
+                    {formatName(user)}
+                  </p>
+                )}
+              </div>
             </div>
             <div className="flex shrink-0 items-center justify-center rounded-full bg-gray-300/50">
               <CareIcon