Как реализировать jsSIP на React?

import React, { useEffect, useRef, useState } from 'react'
import JsSIP from 'jssip'
import { Input, Button } from 'antd'
const Sip = () => {
  const myAudio = useRef()
  const [userId, setUserId] = useState(null);
  const [fromNumber, setFromNumber] = useState(null);
  const [stream, setStream] = useState();
  const [toNumber, setToNumber] = useState(null);
  const [callReceived, setCallReceived] = useState(false);
  const [session, setSession] = useState(null);
  // console.log('method', session);
  // // console.log('userId', userId);
  // // console.log('toNumber', toNumber);
  // console.log('stream', stream);
  // console.log('myAudio', myAudio);
  // // console.log('fromNumber', fromNumber);
  // console.log('callReceived', callReceived);

  var callOptions = {
    mediaConstraints: {
      audio: true, // only audio calls
      video: false
    }
  };

  useEffect(() => {

    const jsSIP = new JsSIP.WebSocketInterface("wss://sip.myhost.com");
    // console.log('jsSIP', jsSIP)
    const configuration = {
      sockets: [jsSIP],
      uri: "sip:[e-mail]",
      password: "1111",
    };
    const callPhone = new JsSIP.UA(configuration);
    callPhone.on("connected", e => {
      console.log(`Connect.... `, e);
    });
    // callPhone.on("sipEvent", e => {
    //   console.log("sadasdsadsade", e);
    // })
    callPhone.on("newRTCSession", function (data) {
      let session = data.session
      let request = data.request
      let originator = data.originator
      setSession(session)
      setCallReceived(true)
      setUserId(request.call_id)
      console.log('conn sess', session)
      console.log('conn request', request)
      console.log('conn originator', originator)
      // console.log("call_ID", session.request.getHeader("From"));
    });
    callPhone.start();
    const eventHandlers = {
      progress: function (e) {
        console.log(`call is in progress.... ${e}`);
      },
      failed: function (e) {
        console.log("call failed with cause: " + e);
      },
      ended: function (e) {
        // console.log("call ended with cause: " + e.data.cause);
      },
      confirmed: function (e) {
        console.log("call confirmed", e);
      }
    };
    const options = {
      eventHandlers: eventHandlers,
      mediaConstraints: { audio: true, video: false }
    };
    callPhone.call("sip:[e-mail]:5060", options);
  }, [])

  return (
    <div>
      User id: {userId}
      <br />
      <audio controls autoplay ref={myAudio} src={stream} />
      <Button type='primary' block>Call</Button>
    </div>
  );
}
export default Sip<code></code>