Ringing call

RingingCall displays incoming or outgoing ring calls with member avatars, connection status, and accept/cancel buttons.

Best Practices

• Show RingingCall when callingState is CallingState.RINGING.
• Use call.isCreatedByMe to distinguish incoming vs outgoing calls.
• Provide callbacks for post-accept/reject navigation.

General usage

import { Call, RingingCall, StreamCall } from "@stream-io/video-react-sdk";

const MyRingingCallUI = () => {
  let call: Call;

  return (
    <StreamCall call={call}>
      <RingingCall />
    </StreamCall>
  );
};

Ringing call controls

The RingingCall component features CancelCallButton to reject/cancel the outgoing/incoming call and in case of incoming call panel, also AcceptCallButton is displayed.

Props RingingCall

includeSelf

Whether to include the current user in the list of members to show.

totalMembersToShow

The maximum number of members to show.

Props RingingCallControls

None

Customization

If you want to create your own ringing call panel, see our ringing call panel customization guide.