# Remote stream is showing blank, unable to figure out why, please help **URL:** \ **Category:** Help\ **Created:** [September 15, 2023, 9:02am UTC](https://react-native-webrtc.discourse.group/t/remote-stream-is-showing-blank-unable-to-figure-out-why-please-help/1851 "2023-09-15T09:02:23Z")\ **Posts on this page:** 3\ **Page:** 1
**Author:** ![gul](https://yyz2.discourse-cdn.com/free1/user_avatar/react-native-webrtc.discourse.group/gul/32/752_2.png) [@gul](https://react-native-webrtc.discourse.group/u/gul)\ **Post date:** [September 15, 2023, 9:02am UTC](https://react-native-webrtc.discourse.group/t/remote-stream-is-showing-blank-unable-to-figure-out-why-please-help/1851/1 "2023-09-15T09:02:23Z")
I’m using expo 49 and react-native v0.72.3, I seem to be getting video stream but it shows blank in RCTView however Local stream does show properly, Any help is much appreciated, I’m stuck Here’s code : ```auto import React, { useState, useEffect } from 'react'; import { View, Text, Button } from 'react-native'; import { RTCPeerConnection, RTCView, mediaDevices } from 'react-native-webrtc'; import socket from './socket'; import { SafeAreaView } from 'react-native-safe-area-context'; const STUN_SERVERS = [ ]; const VideoCall = () => { const [localStream, setLocalStream] = useState(null); const [remoteStream, setRemoteStream] = useState(null); const [peerConnections, setPeerConnections] = useState([]); const socketInstance = socket() useEffect(() => { // Initialize local stream mediaDevices.getUserMedia({ audio: true, video: true }) .then(stream => setLocalStream(stream)) .catch(error => console.error('Error getting user media:', error)); return () => { socketInstance.disconnect(); // Clean up socketInstance connection on component unmount }; }, []); useEffect(() => { if (localStream) { // Create a peer connection for each user const pc = new RTCPeerConnection({ iceServers: STUN_SERVERS, sdpSemantics: 'unified-plan', }); setPeerConnections(prevConnections => [...prevConnections, pc]); // Add local stream to peer connection localStream.getTracks().forEach(track => pc.addTrack(track, localStream)); // Handle ICE candidate events pc.onicecandidate = event => { if (event.candidate) { // Send ICE candidate to all connected clients socketInstance.emit('ice-candidate', { candidate: event.candidate }); } }; // Handle remote stream events pc.ontrack = event => { setRemoteStream(event.streams[0]); }; pc.onupdatetrack = event => { // Update remoteStream if the video track changes setRemoteStream(event.streams[0]); }; } }, [localStream]); useEffect(()=>{ if (localStream){ socketInstance.on('offer', data => { handleOffer(data); }); } }, [localStream]) const handleOffer = data => { if (!localStream) { console.error('Local stream is not yet available'); return; } const pc = new RTCPeerConnection({ iceServers: STUN_SERVERS, sdpSemantics: 'unified-plan', }); setPeerConnections(prevConnections => [...prevConnections, pc]); pc.onicecandidate = event => { if (event.candidate) { socketInstance.emit('ice-candidate', { candidate: event.candidate }); } }; pc.ontrack = event => { const receivedOffer = data.offer.sdp; if (receivedOffer.includes("audio") && receivedOffer.includes("video")) { console.log("Received offer contains both audio and video."); } else { console.error("Received offer does not contain expected media types."); } console.log("Received tracks:", event.streams[0].getTracks()); // Log the tracks // Check the kind of the track if (event.track.kind === 'video') { // Set remoteStream to the received video track setRemoteStream(event.streams[0]); } }; pc.onupdatetrack = event => { // Update remoteStream if the video track changes setRemoteStream(event.streams[0]); }; pc.setRemoteDescription(data.offer) .then(() => pc.createAnswer()) .then(answer => { console.log("Received offer:", data.offer.sdp); // Log the received offer console.log("Created answer:", answer.sdp); socketInstance.emit('answer', { answer, senderSocketId: data.senderUserId }); return pc.setLocalDescription(answer); }); }; useEffect(() => { console.log('remote stream inUseeffect: ', remoteStream); }, [remoteStream]); const handleCall = () => { // Send offer to all connected clients peerConnections.forEach(pc => { pc.createOffer() .then(offer => { // Send the offer to all clients socketInstance.emit('offer', { offer }); pc.setLocalDescription(offer); }); }); }; return ( Video Call Screen {remoteStream && } {localStream && }