its actually crisp with audio....and smooth and cool...no need for video if this is smooth

packages/desktop/package.json

@@ -42,8 +42,8 @@
         [
           "@electron-forge/plugin-webpack",
           {
-            "port": "4000",
+            "port": "4005",
-            "loggerPort": "9000",
+            "loggerPort": "9005",
             "mainConfig": "./webpack.main.config.js",
             "devContentSecurityPolicy": "connect-src 'self' http://localhost:5000 ws://localhost:5000 https://api.quotable.io/random 'unsafe-eval'",
             "renderer": {

packages/desktop/src/providers/StreamProvider.tsx

@@ -16,11 +16,13 @@ import useTerminalProvider from './TerminalProvider';
 import MasterLineData from '@nirvana/core/models/masterLineData.model';
 import { useEffectOnce } from 'react-use';
 
-const videoConstraints = {
+const videoConstraints = false;
-  frameRate: 30,
+
-  width: { max: 100 },
+// {
-  height: { max: 200 },
+//   frameRate: 30,
-};
+//   width: { max: 100 },
+//   height: { max: 200 },
+// };
 
 const iceServers = [
   // { urls: 'stun:stun.l.google.com:19302' },

packages/desktop/src/tree/protected/terminal/line/LineDetails.tsx

@@ -175,7 +175,7 @@ export default function LineDetails() {
 }
 
 function StreamPlayer({ peerStream }: { peerStream: MediaStream }) {
-  const streamRef = useRef<HTMLVideoElement>(null);
+  const streamRef = useRef<HTMLAudioElement>(null);
 
   useEffect(() => {
     if (streamRef?.current) streamRef.current.srcObject = peerStream;
@@ -183,14 +183,15 @@ function StreamPlayer({ peerStream }: { peerStream: MediaStream }) {
 
   return (
     <>
-      <video
+      {/* <video
         ref={streamRef}
         height={300}
         width={400}
         className={'shadow-xl rounded'}
         autoPlay
         muted
-      />
+      /> */}
+      <audio ref={streamRef} className={'shadow-xl rounded'} autoPlay controls />
     </>
   );
 }