From ae535574f5fefc989565968f330942c7becf04ce Mon Sep 17 00:00:00 2001
From: devsimze <simzeeth@gmail.com>
Date: Wed, 27 May 2026 13:37:30 +0100
Subject: [PATCH] fix profile header subtitle wrapping

Add a safe wrap fallback for creator profile subtitle text so long handles no longer break header layout while short subtitles keep existing styling.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/components/common/CreatorProfileHeader.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/components/common/CreatorProfileHeader.tsx b/src/components/common/CreatorProfileHeader.tsx
index d8a449e1..06e193b8 100644
--- a/src/components/common/CreatorProfileHeader.tsx
+++ b/src/components/common/CreatorProfileHeader.tsx
@@ -17,6 +17,9 @@ interface CreatorProfileHeaderProps {
 	className?: string;
 }
 
+const CREATOR_PROFILE_SUBTITLE_WRAP_CLASS_NAME =
+	'max-w-full whitespace-normal break-words [overflow-wrap:anywhere]';
+
 const CreatorProfileHeader: React.FC<CreatorProfileHeaderProps> = ({
 	name,
 	handle,
@@ -77,7 +80,14 @@ const CreatorProfileHeader: React.FC<CreatorProfileHeaderProps> = ({
 						</h1>
 						{isVerified && <div className="shrink-0"><VerifiedBadge verified={true} /></div>}
 					</div>
-					<p className="truncate font-jakarta text-lg text-white/50">@{handle}</p>
+					<p
+						className={cn(
+							'font-jakarta text-lg text-white/50',
+							CREATOR_PROFILE_SUBTITLE_WRAP_CLASS_NAME
+						)}
+					>
+						@{handle}
+					</p>
 					<CreatorBio bio={bio} variant="profile" className="mt-2 max-w-md" />
 				</div>
 			</div>