add websocket

src/renderer/components/HeadAvatar.tsx

@@ -4,7 +4,7 @@ interface HeadAvatarProps {
   skinUrl?: string;
   size?: number;
   style?: React.CSSProperties;
-  version?: number; // ✅ добавили
+  version?: number;
 }
 
 const DEFAULT_SKIN =
@@ -14,15 +14,17 @@ export const HeadAvatar: React.FC<HeadAvatarProps> = ({
   skinUrl,
   size = 24,
   style,
-  version = 0, // ✅ дефолт
+  version = 0,
   ...canvasProps
 }) => {
   const canvasRef = useRef<HTMLCanvasElement>(null);
+  const requestIdRef = useRef(0);
 
   useEffect(() => {
-    const baseUrl = skinUrl?.trim() ? skinUrl : DEFAULT_SKIN;
+    requestIdRef.current += 1;
+    const requestId = requestIdRef.current;
 
-    // ✅ cache-bust: чтобы браузер НЕ отдавал старую картинку
+    const baseUrl = skinUrl?.trim() ? skinUrl : DEFAULT_SKIN;
     const finalSkinUrl = `${baseUrl}${baseUrl.includes('?') ? '&' : '?'}v=${version}`;
 
     const canvas = canvasRef.current;
@@ -33,6 +35,9 @@ export const HeadAvatar: React.FC<HeadAvatarProps> = ({
     img.src = finalSkinUrl;
 
     img.onload = () => {
+      // ✅ игнорим старые onload
+      if (requestIdRef.current !== requestId) return;
+
       const ctx = canvas.getContext('2d');
       if (!ctx) return;
 
@@ -47,9 +52,16 @@ export const HeadAvatar: React.FC<HeadAvatarProps> = ({
     };
 
     img.onerror = (e) => {
+      if (requestIdRef.current !== requestId) return;
       console.error('Не удалось загрузить скин для HeadAvatar:', e);
     };
-  }, [skinUrl, size, version]); // ✅ version добавили
+
+    return () => {
+      // ✅ гарантированно “убиваем” обработчики старого запроса
+      img.onload = null;
+      img.onerror = null;
+    };
+  }, [skinUrl, size, version]);
 
   return (
     <canvas