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

src/components/control-tray/ControlTray.tsx

@@ -36,8 +36,8 @@ const ControlTray: React.FC<ControlTrayProps> = ({
   isAppCamActive,
   onAppCamToggle,
   ReferenceMicrophoneIcon,
-  currentFacingMode,
-  setCurrentFacingMode,
+  currentFacingMode, // دریافت از AppCore
+  setCurrentFacingMode, // دریافت از AppCore
 }) => {
   const { client, connected, connect } = useLiveAPIContext();
   const [audioRecorder] = useState(() => new AudioRecorder());
@@ -45,14 +45,48 @@ const ControlTray: React.FC<ControlTrayProps> = ({
   const [isSwitchingCamera, setIsSwitchingCamera] = useState(false);
   const renderCanvasRef = React.useRef<HTMLCanvasElement>(null);
 
+  const _startWebcam = async (facingModeToTry: 'user' | 'environment') => {
+    if (isSwitchingCamera) return null; // برگرداندن null اگر در حال تعویض دوربین هستیم
+    setIsSwitchingCamera(true);
+    try {
+      const mediaStream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: facingModeToTry }, audio: false });
+      setActiveLocalVideoStream(mediaStream);
+      onVideoStreamChange(mediaStream);
+      // setCurrentFacingMode در اینجا ست نمی‌شود، چون توسط handleSwitchCamera یا handleCamToggle مدیریت می‌شود
+      return mediaStream; // برگرداندن استریم برای استفاده در توابع دیگر
+    } catch (error) {
+      console.error(`❌ Start WC err ${facingModeToTry}:`, error);
+      setActiveLocalVideoStream(null);
+      onVideoStreamChange(null);
+      onAppCamToggle(false); // خاموش کردن دوربین در App.tsx اگر خطا رخ داد
+      return null;
+    } finally {
+      setIsSwitchingCamera(false);
+    }
+  };
+
+  const _stopWebcam = () => {
+    if (activeLocalVideoStream) {
+      activeLocalVideoStream.getTracks().forEach(track => track.stop());
+    }
+    setActiveLocalVideoStream(null);
+    onVideoStreamChange(null);
+  };
+
+  // useEffect برای مدیریت روشن/خاموش شدن دوربین بر اساس isAppCamActive
   useEffect(() => {
-    if (isAppCamActive && !activeLocalVideoStream && !isSwitchingCamera) {
-      startWebcam(currentFacingMode); // استفاده از currentFacingMode از پراپ
-    } else if (!isAppCamActive && activeLocalVideoStream) {
-      stopWebcam();
+    if (isAppCamActive) {
+      if (!activeLocalVideoStream && !isSwitchingCamera) {
+        _startWebcam(currentFacingMode); // استفاده از currentFacingMode از state والد
+      }
+    } else {
+      if (activeLocalVideoStream) {
+        _stopWebcam();
+      }
     }
   }, [isAppCamActive, activeLocalVideoStream, isSwitchingCamera, currentFacingMode]);
 
+
   useEffect(() => { /* ... audioRecorder ... */ }, [connected, client, isAppMicActive, audioRecorder]);
   useEffect(() => { /* ... sendVideoFrame ... */ }, [connected, activeLocalVideoStream, client, videoRef, renderCanvasRef]);
   useEffect(() => { /* ... videoRef.srcObject ... */ }, [activeLocalVideoStream, videoRef]);
@@ -60,56 +94,42 @@ const ControlTray: React.FC<ControlTrayProps> = ({
   const ensureConnectedAndReady = async (): Promise<boolean> => { if (!connected) { try { await connect(); return true; } catch (err) { console.error('❌ CT Connect err:', err); return false; } } return true; };
   const handleMicToggle = async () => { if (isSwitchingCamera) return; const newMicState = !isAppMicActive; if (newMicState && !(await ensureConnectedAndReady())) { onAppMicToggle(false); return; } onAppMicToggle(newMicState); };
 
-  const startWebcam = async (facingModeToTry: 'user' | 'environment') => {
-    if (isSwitchingCamera) return;
-    setIsSwitchingCamera(true);
-    try {
-      const mediaStream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: facingModeToTry }, audio: false });
-      setActiveLocalVideoStream(mediaStream);
-      onVideoStreamChange(mediaStream);
-      // setCurrentFacingMode در اینجا نباید مستقیما ست شود، چون از پراپ می آید و در handleSwitchCamera و handleCamToggle مدیریت می شود
-    } catch (error) {
-      console.error(`❌ Start WC err ${facingModeToTry}:`, error);
-      setActiveLocalVideoStream(null); onVideoStreamChange(null); onAppCamToggle(false);
-    } finally { setIsSwitchingCamera(false); }
-  };
-
-  const stopWebcam = () => { if (activeLocalVideoStream) activeLocalVideoStream.getTracks().forEach(track => track.stop()); setActiveLocalVideoStream(null); onVideoStreamChange(null); };
-
   const handleCamToggle = async () => {
     if (isSwitchingCamera) return;
     const newCamState = !isAppCamActive;
-    if (newCamState) {
-        if (!(await ensureConnectedAndReady())) { onAppCamToggle(false); return; }
-        if (!isAppMicActive) { onAppMicToggle(true); }
-        onAppCamToggle(true); // این باعث اجرای useEffect برای startWebcam با currentFacingMode فعلی می شود
-    } else {
-        onAppCamToggle(false);
+
+    if (newCamState) { // روشن کردن دوربین
+        if (!(await ensureConnectedAndReady())) {
+            onAppCamToggle(false); // آپدیت state در App.tsx
+            return;
+        }
+        if (!isAppMicActive) {
+            onAppMicToggle(true); // فعال کردن میکروفون اگر خاموش است
+        }
+        onAppCamToggle(true); // این باعث می‌شود useEffect بالا _startWebcam را فراخوانی کند
+                            // با currentFacingMode فعلی که از App.tsx می‌آید.
+    } else { // خاموش کردن دوربین
+        onAppCamToggle(false); // این باعث می‌شود useEffect بالا _stopWebcam را فراخوانی کند
     }
   };
 
   const handleSwitchCamera = async () => {
     if (!isAppCamActive || !activeLocalVideoStream || isSwitchingCamera) return;
-    setIsSwitchingCamera(true);
+
     const targetFacingMode = currentFacingMode === 'user' ? 'environment' : 'user';
-    activeLocalVideoStream.getTracks().forEach(track => track.stop());
-    try {
-      const newStream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: { exact: targetFacingMode } }, audio: false });
-      setActiveLocalVideoStream(newStream);
-      onVideoStreamChange(newStream);
-      setCurrentFacingMode(targetFacingMode); // آپدیت state در App.tsx
-    } catch (error) {
-      console.error(`❌ Switch Cam err ${targetFacingMode}:`, error);
-      try {
-        const restoredStream = await navigator.mediaDevices.getUserMedia({ video: { facingMode: currentFacingMode }, audio: false }); // بازگشت به دوربین قبلی
-        setActiveLocalVideoStream(restoredStream);
-        onVideoStreamChange(restoredStream);
-        // setCurrentFacingMode تغییر نمی کند
-      } catch (restoreError) {
-        console.error('❌ Restore Cam err:', restoreError);
-        setActiveLocalVideoStream(null); onVideoStreamChange(null); onAppCamToggle(false);
-      }
-    } finally { setIsSwitchingCamera(false); }
+    _stopWebcam(); // ابتدا استریم فعلی را متوقف کن
+
+    // کمی تاخیر برای اطمینان از آزاد شدن دوربین قبل از درخواست جدید
+    await new Promise(resolve => setTimeout(resolve, 100));
+
+    const newStream = await _startWebcam(targetFacingMode); // تلاش برای شروع با دوربین جدید
+    if (newStream) {
+        setCurrentFacingMode(targetFacingMode); // آپدیت state در App.tsx فقط در صورت موفقیت
+    } else {
+        // اگر شروع با دوربین جدید ناموفق بود، سعی کن به دوربین قبلی برگردی
+        // (currentFacingMode هنوز مقدار قبلی را دارد)
+        await _startWebcam(currentFacingMode);
+    }
   };
 
   return (