Use only text for Avatar

ohcnetwork · Jan 14, 2025 · fc48288 · fc48288
1 parent 7cf4c23
commit fc48288
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/src/components/Common/Avatar.tsx b/src/components/Common/Avatar.tsx
@@ -58,7 +58,9 @@ const Avatar: React.FC<AvatarProps> = ({
   className,
   icon,
 }) => {
-  const [bgColor] = propColors || (name ? toColor(name) : toColor(""));
+  const avatarText = name?.match(/[a-zA-Z]/g)?.join("");
+  const [bgColor] =
+    propColors || (avatarText ? toColor(avatarText) : toColor(""));
   return (
     <div
       title={name}
@@ -100,7 +102,7 @@ const Avatar: React.FC<AvatarProps> = ({
             dominantBaseline="middle"
             alignmentBaseline="middle"
           >
-            {name ? initials(name) : null}
+            {avatarText ? initials(avatarText) : null}
           </text>
         </svg>
       )}