diff --git a/src/components/Video.tsx b/src/components/Video.tsx
index 6eee6ce..9d6bb6d 100644
--- a/src/components/Video.tsx
+++ b/src/components/Video.tsx
@@ -13,51 +13,94 @@ interface Props {
   user?: IUser;
 }
 
+const SPEAKING_HIDE_DELAY_MS = 400;
+
 function Video({ mediaStream, muted, user }: Props) {
   const remoteVideoRef = useRef<HTMLVideoElement>(null);
+  const remoteAudioRef = useRef<HTMLAudioElement>(null);
   const isSpeaking = useIsAudioActive({ source: mediaStream });
+  const [showSpeakingBorder, setShowSpeakingBorder] = useState(false);
+  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const [_muted, setMuted] = useState(muted);
   const [isLoading, setIsLoading] = useState(true);
   const [minimized, setMinimized] = useState(user?.isAdmin ? false : true);
 
+  const hasVideo = (mediaStream?.getVideoTracks().length ?? 0) > 0;
+
+  useEffect(() => {
+    if (user && user.micEnabled === false) {
+      if (hideTimeoutRef.current) {
+        clearTimeout(hideTimeoutRef.current);
+        hideTimeoutRef.current = null;
+      }
+      setShowSpeakingBorder(false);
+      return;
+    }
+    if (isSpeaking) {
+      if (hideTimeoutRef.current) {
+        clearTimeout(hideTimeoutRef.current);
+        hideTimeoutRef.current = null;
+      }
+      setShowSpeakingBorder(true);
+    } else {
+      hideTimeoutRef.current = setTimeout(() => {
+        setShowSpeakingBorder(false);
+        hideTimeoutRef.current = null;
+      }, SPEAKING_HIDE_DELAY_MS);
+    }
+    return () => {
+      if (hideTimeoutRef.current) clearTimeout(hideTimeoutRef.current);
+    };
+  }, [isSpeaking, user?.micEnabled]);
+
   function toggleSound() {
-    if (!remoteVideoRef.current) return;
-    // remoteVideoRef.current.muted = !remoteVideoRef.current.muted;
     setMuted((prev) => !prev);
   }
 
   useEffect(() => {
-    if (!remoteVideoRef.current) return;
+    if (!mediaStream) return;
 
-    remoteVideoRef.current.srcObject = mediaStream;
-    remoteVideoRef.current.onloadedmetadata = () => {
-      remoteVideoRef.current?.play();
-    };
-
-    remoteVideoRef.current.onplay = () => {
+    if (hasVideo && remoteVideoRef.current) {
+      remoteVideoRef.current.srcObject = mediaStream;
+      remoteVideoRef.current.onloadedmetadata = () => {
+        remoteVideoRef.current?.play();
+      };
+      remoteVideoRef.current.onplay = () => setIsLoading(false);
+    } else if (!hasVideo && remoteAudioRef.current) {
+      remoteAudioRef.current.srcObject = mediaStream;
+      remoteAudioRef.current.onloadedmetadata = () => {
+        remoteAudioRef.current?.play();
+      };
+      remoteAudioRef.current.onplay = () => setIsLoading(false);
       setIsLoading(false);
-    };
-
-    console.log("mediaStream", mediaStream?.getTracks());
-  }, [mediaStream]);
-
-  useEffect(() => {
-    console.log("remoteVideoRef.current", remoteVideoRef);
-  }, [remoteVideoRef.current]);
+    }
+  }, [mediaStream, hasVideo]);
 
   return (
     <div
       className={`relative border-2 rounded-lg ${
         minimized ? "h-8 rounded-lg overflow-hidden" : ""
-      } ${!_muted && user?.micEnabled && isSpeaking ? "border-green-500" : "border-transparent"}`}
+      } ${!_muted && user?.micEnabled !== false && showSpeakingBorder ? "border-green-500" : "border-transparent"}`}
     >
-      <video
-        ref={remoteVideoRef}
-        className={`aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] rounded-lg object-cover bg-gray-500`}
-        playsInline
-        autoPlay
-        muted={_muted}
-      ></video>
+      {hasVideo ? (
+        <video
+          ref={remoteVideoRef}
+          className={`aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] rounded-lg object-cover bg-gray-500`}
+          playsInline
+          autoPlay
+          muted={_muted}
+        ></video>
+      ) : (
+        <>
+          <audio
+            ref={remoteAudioRef}
+            autoPlay
+            muted={_muted}
+            className="hidden"
+          />
+          <div className="aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] rounded-lg bg-gray-500" />
+        </>
+      )}
       <div
         className={`absolute -bottom-1.5 flex items-center justify-between w-full gap-2 p-2 ${
           minimized ? "bg-black" : ""
diff --git a/src/components/modals/stream/SetNameModal.tsx b/src/components/modals/stream/SetNameModal.tsx
index 8539a98..f72c207 100644
--- a/src/components/modals/stream/SetNameModal.tsx
+++ b/src/components/modals/stream/SetNameModal.tsx
@@ -49,52 +49,60 @@ function SetNameModal({ onAction }: Props) {
     videoStreamRef.current = null;
 
     try {
-      const constraints: MediaStreamConstraints = {
+      const audioConstraints: MediaStreamConstraints = {
         audio: audioDeviceId
           ? { deviceId: { exact: audioDeviceId } }
           : true,
-        video: videoDeviceId
-          ? { deviceId: { exact: videoDeviceId } }
-          : true,
       };
-      const stream = await navigator.mediaDevices.getUserMedia(constraints);
-
-      const devices = await navigator.mediaDevices.enumerateDevices();
-      const microphones = devices.filter((d) => d.kind === "audioinput");
-      const cameras = devices.filter((d) => d.kind === "videoinput");
-
-      const audioTracks = stream.getAudioTracks();
-      const videoTracks = stream.getVideoTracks();
-
+      const audioStreamResult = await navigator.mediaDevices.getUserMedia(
+        audioConstraints
+      );
+      const audioTracks = audioStreamResult.getAudioTracks();
       if (audioTracks.length) {
         const audioMediaStream = new MediaStream(audioTracks);
         audioStreamRef.current = audioMediaStream;
         setAudioStream(audioMediaStream);
-        setAudioDevices(microphones);
-        setSelectedAudioDeviceId(
-          audioDeviceId ?? microphones[0]?.deviceId ?? ""
-        );
         setMicStatus("success");
       } else {
         setMicStatus("error");
       }
+    } catch {
+      setMicStatus("error");
+    }
 
+    try {
+      const videoConstraints: MediaStreamConstraints = {
+        video: videoDeviceId
+          ? { deviceId: { exact: videoDeviceId } }
+          : true,
+      };
+      const videoStreamResult = await navigator.mediaDevices.getUserMedia(
+        videoConstraints
+      );
+      const videoTracks = videoStreamResult.getVideoTracks();
       if (videoTracks.length) {
         const videoMediaStream = new MediaStream(videoTracks);
         videoStreamRef.current = videoMediaStream;
         setVideoStream(videoMediaStream);
-        setVideoDevices(cameras);
-        setSelectedVideoDeviceId(
-          videoDeviceId ?? cameras[0]?.deviceId ?? ""
-        );
         setCameraStatus("success");
       } else {
         setCameraStatus("error");
       }
     } catch {
-      setMicStatus("error");
       setCameraStatus("error");
     }
+
+    const devices = await navigator.mediaDevices.enumerateDevices();
+    const microphones = devices.filter((d) => d.kind === "audioinput");
+    const cameras = devices.filter((d) => d.kind === "videoinput");
+    setAudioDevices(microphones);
+    setVideoDevices(cameras);
+    setSelectedAudioDeviceId(
+      audioDeviceId ?? microphones[0]?.deviceId ?? ""
+    );
+    setSelectedVideoDeviceId(
+      videoDeviceId ?? cameras[0]?.deviceId ?? ""
+    );
   }
 
   async function checkMicrophone(deviceId?: string) {
diff --git a/src/pages/StreamPage.tsx b/src/pages/StreamPage.tsx
index 8de9d59..749cd92 100644
--- a/src/pages/StreamPage.tsx
+++ b/src/pages/StreamPage.tsx
@@ -147,25 +147,37 @@ function StreamPage() {
           ...existingVideoStream!.getVideoTracks(),
         ]);
       } else if (hasAudio) {
-        const videoStream = await navigator.mediaDevices.getUserMedia({
-          video: videoDeviceId
-            ? { deviceId: { exact: videoDeviceId } }
-            : true,
-        });
-        mediaStream = new MediaStream([
-          ...existingAudioStream!.getAudioTracks(),
-          ...videoStream.getVideoTracks(),
-        ]);
+        try {
+          const videoStream = await navigator.mediaDevices.getUserMedia({
+            video: videoDeviceId
+              ? { deviceId: { exact: videoDeviceId } }
+              : true,
+          });
+          mediaStream = new MediaStream([
+            ...existingAudioStream!.getAudioTracks(),
+            ...videoStream.getVideoTracks(),
+          ]);
+        } catch {
+          mediaStream = new MediaStream(
+            existingAudioStream!.getAudioTracks()
+          );
+        }
       } else if (hasVideo) {
-        const audioStream = await navigator.mediaDevices.getUserMedia({
-          audio: audioDeviceId
-            ? { deviceId: { exact: audioDeviceId } }
-            : true,
-        });
-        mediaStream = new MediaStream([
-          ...audioStream.getAudioTracks(),
-          ...existingVideoStream!.getVideoTracks(),
-        ]);
+        try {
+          const audioStream = await navigator.mediaDevices.getUserMedia({
+            audio: audioDeviceId
+              ? { deviceId: { exact: audioDeviceId } }
+              : true,
+          });
+          mediaStream = new MediaStream([
+            ...audioStream.getAudioTracks(),
+            ...existingVideoStream!.getVideoTracks(),
+          ]);
+        } catch {
+          mediaStream = new MediaStream(
+            existingVideoStream!.getVideoTracks()
+          );
+        }
       } else {
         mediaStream = await navigator.mediaDevices.getUserMedia({
           video: videoDeviceId
@@ -177,12 +189,15 @@ function StreamPage() {
         });
       }
 
-      if (!localVideoRef.current) return;
-
-      localVideoRef.current.srcObject = mediaStream;
-      localVideoRef.current.onloadedmetadata = () => {
-        localVideoRef.current?.play();
-      };
+      if (
+        localVideoRef.current &&
+        mediaStream.getVideoTracks().length > 0
+      ) {
+        localVideoRef.current.srcObject = mediaStream;
+        localVideoRef.current.onloadedmetadata = () => {
+          localVideoRef.current?.play();
+        };
+      }
 
       setLocalStream(mediaStream);
       setPermission(true);
@@ -479,6 +494,15 @@ function StreamPage() {
   }, [users.length]);
 
   useEffect(() => {
+    if (
+      localVideoRef.current &&
+      localStream.getVideoTracks().length > 0
+    ) {
+      localVideoRef.current.srcObject = localStream;
+      localVideoRef.current.onloadedmetadata = () => {
+        localVideoRef.current?.play();
+      };
+    }
     toggleCamera();
     toggleMic();
   }, [localStream]);
@@ -564,44 +588,52 @@ function StreamPage() {
 
                     {permission && (
                       <>
-                        <div className="relative group">
-                          <Button
-                            variant="secondary"
-                            icon={
-                              isMicEnabled ? <MicroOnIcon /> : <MicroOffIcon />
-                            }
-                            onlyIcon
-                            onClick={toggleMic}
-                          />
-                          <Tooltip
-                            text={
-                              isMicEnabled
-                                ? t("tooltips.turnOffMic")
-                                : t("tooltips.turnOnMic")
-                            }
-                          />
-                        </div>
-                        <div className="relative group">
-                          <Button
-                            variant="secondary"
-                            icon={
-                              isCameraEnabled ? (
-                                <CameraOnIcon />
-                              ) : (
-                                <CameraOffIcon />
-                              )
-                            }
-                            onlyIcon
-                            onClick={toggleCamera}
-                          />
-                          <Tooltip
-                            text={
-                              isCameraEnabled
-                                ? t("tooltips.turnOffCamera")
-                                : t("tooltips.turnOnCamera")
-                            }
-                          />
-                        </div>
+                        {localStream.getAudioTracks().length > 0 && (
+                          <div className="relative group">
+                            <Button
+                              variant="secondary"
+                              icon={
+                                isMicEnabled ? (
+                                  <MicroOnIcon />
+                                ) : (
+                                  <MicroOffIcon />
+                                )
+                              }
+                              onlyIcon
+                              onClick={toggleMic}
+                            />
+                            <Tooltip
+                              text={
+                                isMicEnabled
+                                  ? t("tooltips.turnOffMic")
+                                  : t("tooltips.turnOnMic")
+                              }
+                            />
+                          </div>
+                        )}
+                        {localStream.getVideoTracks().length > 0 && (
+                          <div className="relative group">
+                            <Button
+                              variant="secondary"
+                              icon={
+                                isCameraEnabled ? (
+                                  <CameraOnIcon />
+                                ) : (
+                                  <CameraOffIcon />
+                                )
+                              }
+                              onlyIcon
+                              onClick={toggleCamera}
+                            />
+                            <Tooltip
+                              text={
+                                isCameraEnabled
+                                  ? t("tooltips.turnOffCamera")
+                                  : t("tooltips.turnOnCamera")
+                              }
+                            />
+                          </div>
+                        )}
                       </>
                     )}
                   </div>
@@ -733,7 +765,12 @@ function StreamPage() {
               <div className="absolute top-2 space-y-2 lg:left-2 max-lg:right-2">
                 <div
                   className={`relative border-2 rounded-lg ${
-                    !permission || !isCameraEnabled ? "hidden" : ""
+                    !permission ? "hidden" : ""
+                  } ${
+                    localStream.getVideoTracks().length === 0 ||
+                    !isCameraEnabled
+                      ? "h-8 overflow-hidden"
+                      : ""
                   } ${
                     isMicEnabled && isSpeaking
                       ? "border-green-500"
@@ -742,12 +779,28 @@ function StreamPage() {
                 >
                   <video
                     ref={localVideoRef}
-                    className={`object-cover bg-gray-500 rounded-lg aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] -scale-x-100`}
+                    className={`object-cover bg-gray-500 rounded-lg aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] -scale-x-100 ${
+                      localStream.getVideoTracks().length === 0 ||
+                      !isCameraEnabled
+                        ? "hidden"
+                        : ""
+                    }`}
                     playsInline
                     autoPlay
                     muted
                   ></video>
-                  <div className="absolute bottom-0 p-2">
+                  {(localStream.getVideoTracks().length === 0 ||
+                    !isCameraEnabled) && (
+                    <div className="aspect-video lg:w-[216px] w-[160px] lg:h-[162px] h-[120px] rounded-lg bg-gray-500" />
+                  )}
+                  <div
+                    className={`absolute -bottom-1.5 flex items-center lg:w-[216px] w-[160px] gap-2 p-2 ${
+                      localStream.getVideoTracks().length === 0 ||
+                      !isCameraEnabled
+                        ? "bg-black"
+                        : ""
+                    }`}
+                  >
                     <p className="text-xs text-white truncate lg:text-sm">
                       {name}
                     </p>