Звонки

client-web/src/modules/users/presentation/components/UserProfile.tsx

@@ -15,7 +15,8 @@ import { httpClient } from '../../../../core/infrastructure/httpClient';
 import { Loader2 } from 'lucide-react';
 import ImageLightbox from '../../../../core/presentation/components/ui/ImageLightbox';
 import type { FriendWithId, FriendRequest } from '../../../../core/domain/types';
-import { getInitials } from '../../../../core/utils/utils';
+import Avatar from '../../../../core/presentation/components/ui/Avatar';
+import ConfirmModal from '../../../../core/presentation/components/ui/ConfirmModal';
 
 interface UserProfileProps {
   userId: string;
@@ -227,12 +228,13 @@ export default function UserProfile({ userId, onClose, onMessage, isSelf: isSelf
               <div className="flex flex-col items-center mb-10">
                 <div className="relative mb-8 group">
                   <div className="absolute -inset-4 bg-primary/20 blur-3xl rounded-[3rem] opacity-40 group-hover:opacity-60 transition-opacity" />
-                  <div className="relative w-40 h-40 rounded-[3rem] bg-zinc-900 border-2 border-white/10 overflow-hidden shadow-2xl">
-                    {user.avatar ? (
-                      <img src={resolveUrl(user.avatar)} className="w-full h-full object-cover" alt="" />
-                    ) : (
-                      <div className="w-full h-full flex items-center justify-center bg-gradient-to-br from-primary/30 to-primary-container/10 text-5xl font-black text-primary">{getInitials(user.displayName)}</div>
-                    )}
+                  <div className="relative w-40 h-40">
+                    <Avatar 
+                      src={user.avatar ? resolveUrl(user.avatar) : null} 
+                      name={user.displayName || '?'} 
+                      size="3xl"
+                      className="shadow-2xl"
+                    />
                   </div>
                 </div>
                 <h2 className="text-4xl font-black text-white mb-3 tracking-tighter text-center">{user.displayName}</h2>