The incoming call component is displayed when the user receives an incoming call, such as a voice call, video call. It serves as a visual representation of an incoming call and provides options for the user to answer or decline the call.

​
Properties

​
Call Information

Details associated with the call.
NameTypeDescription
callCometChat.CallCometChat call object consumed by the component to launch itself.

​
title

Heading text for the component
NameTypeDescription
titlestringHeading text of the component

​
Custom view

UI component created and customised by the developer to meet your design or functional requirements.
NameTypeDescription
subtitleViewFunction as PropType<(call: CometChat.Call) => ViewType>User-defined React component to customise the secondary text shown in the component.

​
Sound

This refers to the action of activating or allowing the audio or sound capabilities of the component.
NameTypeDescription
disableSoundForCallsbooleanWhen set to true, the component will not produce sound for all incoming / outgoing messages.
customSoundForCallsstringmp3 file asset of your choice to play for all incoming calls.

​
Function callback

Functions that can be invoked by the user in response to a specific event or condition.
NameTypeDescription
onAcceptFunction as PropType<(call:CometChat.Call)=>void>Override the method that is invoked when user clicks on the accept button
onDeclineFunction as PropType<(call:CometChat.Call)=>void>Override the method that is invoked when user clicks on the decline button
onErrorFunction as PropType<(error: CometChat.CometChatException) => void>Override the method that is invoked when an error is encountered within the component

​
Custom text

Customise the text or label displayed on the button
NameTypeDescription
acceptButtonTextstringText or label displayed on the accept button within the component.
declineButtonTextstringText or label displayed on the decline button within the component.

​
Style

Styling properties and values of all the involved components
NameTypeDescription
AvatarStyleAvatarStyleStyling properties and values of the Avatar component
ListItemStylelistItemStyleStyling properties and values of the List item component
IncomingCallStyleIncomingCallStyleStyling properties of this component

​
Usage

//overriding style properties of the incomning call component
const incomingCallStyle:IncomingCallStyle = new IncomingCallStyle({
width: "320px",
height: "110px",
titleTextFont: "700 28px Inter",
titleTextColor: "black",
});

<CometChatIncomingCall :incomingCallStyle="incomingCallStyle"></CometChatIncomingCall>