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

src/components/control-tray/ControlTray.tsx

@@ -4,12 +4,9 @@ import cn from "classnames";
 import React, { memo, RefObject, useEffect, useState, useCallback } from "react";
 import { useLiveAPIContext } from "../../contexts/LiveAPIContext";
 import { AudioRecorder } from "../../lib/audio-recorder";
-import Logo from '../logo/Logo'; // <-- کامپوننت جدید Logo ایمپورت شد
-
-// آیکون‌ها از فایل مرکزی ایمپورت می‌شوند
+import Logo from '../logo/Logo';
 import { pauseIcon, microphoneIcon, cameraIcon, stopCamIcon } from '../icons';
 
-// آیکون Switch Camera اینجا تعریف می‌شود چون فقط در این فایل استفاده شده
 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>;
 
 export type ControlTrayProps = {
@@ -20,7 +17,6 @@ export type ControlTrayProps = {
   onAppMicToggle: (active: boolean) => void;
   isAppCamActive: boolean;
   onAppCamToggle: (active: boolean) => void;
-  // ReferenceMicrophoneIcon حذف شد
   currentFacingMode: 'user' | 'environment';
   onFacingModeChange: (mode: 'user' | 'environment') => void;
 };
@@ -36,7 +32,7 @@ const ControlTray: React.FC<ControlTrayProps> = ({
   currentFacingMode,
   onFacingModeChange,
 }) => {
-  const { client, connected, connect } = useLiveAPIContext();
+  const { client, connected, connect, volume } = useLiveAPIContext(); // <-- دریافت volume
   const [audioRecorder] = useState(() => new AudioRecorder());
   const [activeLocalVideoStream, setActiveLocalVideoStream] = useState<MediaStream | null>(null);
   const [isSwitchingCamera, setIsSwitchingCamera] = useState(false);
@@ -232,10 +228,16 @@ const ControlTray: React.FC<ControlTrayProps> = ({
         {isAppMicActive ? pauseIcon : microphoneIcon}
       </div>
 
-      {isAppCamActive && (
+      {(isAppMicActive || isAppCamActive) && (
         <div id="small-logo-footer-container" className="small-logo-footer-html-like">
-            {/* کامپوننت Logo جدید جایگزین LogoAnimation شد */}
-            <Logo isMini={true} isActive={true} isAi={false} />
+            {/* --- 👇 تغییر در اینجا: پاس دادن volume و isAppMicActive 👇 --- */}
+            <Logo 
+                isMini={true} 
+                isActive={true} 
+                isAi={true} 
+                speakingVolume={volume}
+                isUserSpeaking={isAppMicActive}
+            />
         </div>
       )}