Call state doesn't change after accepted

[ohri31]

Which package/packages do you use?

• @stream-io/video-react-sdk
• @stream-io/video-react-native-sdk
• @stream-io/video-client

Describe the bug

I have setup an app that needs to have video calling.

I invoke a call in the following way:

`async function handleCall(callUserId: string) {
if (!client) {
return;
}

const callId = uuidv4();
const call = client.call("default", callId);

await call.microphone.enable();
await call.camera.disable();

await call.getOrCreate({
  ring: true,
  data: {
    members: [{ user_id: userId }, { user_id: callUserId }],
  },
});

}
`
After I invoke the call, both users get the corresponding Incoming/Outgoing call screen.

This is the component:

const getCallContent = useCallback(() => { switch (state) { case CallingState.RINGING: return isCallCreatedByMe ? ( <CustomOutgoingVideoCall call={call} onHangupCallHandler={() => call.leave()} /> ) : ( <CustomIncomingVideoCall call={call} onAcceptCallHandler={() => call.join()} onRejectCallHandler={() => call.reject()} /> ); case CallingState.LEFT: return <></>; case CallingState.IDLE: return <></>; default: return ( <WindView className="w-[100%] flex flex-grow"> <CallContent /> </WindView> ); } }, [call, isCallCreatedByMe, state]);

So when the call is invoked, the state becomes RINGING - but after the called user accepts, the state doesn't update on either of those two devices and just stays the same.

Is this a bug - or am I missing something?

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Version

1.2.8

Env:

Fill out what's applicable

React / JS client

• Browser [e.g. chrome, safari]

React Native

• OS: iOS
• Device or emulator: Simulator

Node JS client

• Node version

Additional context
Add any other context about the problem here.

[oliverlaz]

hi @ohri31, thanks for raising this issue. It is a bit hard to understand where the problem is.
Can you please share how you have set up the components where:

• Call is initiated (call.getOrCreate())
• Call is provided to the component tree (<StreamCall call={call}>....</StreamCall>)
• CallingState is read (const state = useCallCallingState())