Update src/components/control-tray/ControlTray.tsx

src/components/control-tray/ControlTray.tsx

@@ -4,8 +4,8 @@ import cn from "classnames";
 import React, { memo, RefObject, useEffect, useState, useCallback, useRef } from "react";
 import { useLiveAPIContext } from "../../contexts/LiveAPIContext";
 import { AudioRecorder } from "../../lib/audio-recorder";
-import Logo from '../logo/Logo'; // لوگو اینجا استفاده می‌شود
-import { PauseIconWithPulse, microphoneIcon, cameraIcon, stopCamIcon } from '../icons';
+import Logo from '../logo/Logo';
+import { PauseIconWithSurroundPulse, microphoneIcon, cameraIcon, stopCamIcon, pauseIcon } from '../icons';
 
 const SvgSwitchCameraIcon = () => <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="w-[22px] h-[22px]"><path d="M11 19H4a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h5"/><path d="M13 5h7a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-5"/><path d="m17 12-3-3 3-3"/><path d="m7 12 3 3-3 3"/></svg>;
 
@@ -190,16 +190,16 @@ const ControlTray: React.FC<ControlTrayProps> = ({ videoRef, onVideoStreamChange
       setIsSwitchingCamera(false);
     }
   };
+  
+  const isSpeaking = onUserSpeakingChange.length > 0 && userVolume > 0.01;
 
   return (
     <footer id="footer-controls" className="footer-controls-html-like">
       <canvas style={{ display: "none" }} ref={renderCanvasRef} />
       <div id="mic-button" className="control-button mic-button-color" onClick={handleMicToggle}>
-        {isAppMicActive ? <PauseIconWithPulse userVolume={userVolume} /> : microphoneIcon}
+        {isAppMicActive ? <PauseIconWithSurroundPulse userVolume={userVolume} /> : microphoneIcon}
       </div>
-
-      {/* --- 👇 تغییر اصلی اینجاست 👇 --- */}
-      {/* اگر دوربین فعال است، لوگو را در وسط نمایش بده */}
+      
       {isAppCamActive && (
         <div id="small-logo-footer-container" className="small-logo-footer-html-like">
             <Logo 
@@ -207,7 +207,7 @@ const ControlTray: React.FC<ControlTrayProps> = ({ videoRef, onVideoStreamChange
                 isActive={true} 
                 isAi={false}
                 speakingVolume={volume}
-                isUserSpeaking={onUserSpeakingChange.length > 0 && userVolume > 0.01}
+                isUserSpeaking={isSpeaking}
             />
         </div>
       )}