How to solve TypeError: Cannot read properties of undefined (reading 'call') error??

Cendazz

I am using simple-peer to support realtime video calling between browsers. The peer.on("signal") listener is not working. The sockets listeners is working i have tested but after peer objection creation while calling the user it throws this error

This is my code

import React, { useState, useRef, useEffect } from 'react'import { useSelector, useDispatch } from 'react-redux'import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'import { faImage, faVideo, faPhone } from '@fortawesome/free-solid-svg-icons'import Peer from "simple-peer"

  const myVideo = useRef()  const userVideo = useRef()  const connectionRef = useRef() const [stream, setStream] = useState();  const [me, setMe] = useState("")

  useEffect(() => {    const accessCamera = () => {      navigator.mediaDevices.getUserMedia({ video: true, audio: true }).then((stream) => {        setStream(stream)        myVideo.current.srcObject = stream;      })    }
    accessCamera();  },[])

const callUser = () => {    console.log(myVideo);    const peer = new Peer({      initiator: true,      trickle: false,      stream: stream    });
        console.log(peer);    peer.on("signal", (data) => {      socket.emit("callUser", {        userToCall: friendId,        signalData: data,        from: me,        name: getCredential.firstName      });      console.log("Signal generated:", data);      console.log("Signal sent to server");    });
    peer.on("stream", (stream) => {      console.log("Stream received:", stream);      userVideo.current.srcObject = stream;    });
    socket.on("callAccepted", (signal) => {      console.log("Call accepted signal received:", signal);      setCallAccepted(true);      peer.signal(signal);    });
    connectionRef.current = peer;  };