I am trying to create AgentChat panel in react TS using Amazon connect streams API and connect Chat JS As per https://github.com/amazon-connect/amazon-connect-chatjs & amazon-connect-streams API documentation I need to import the streams and chatjs libs in order. I am importing the streamsJS then chatJS, but still 'getMediaController' throws error.
I did check https://github.com/amazon-connect/amazon-connect-streams/issues/197 this, still missing something
import "amazon-connect-streams";
import "amazon-connect-chatjs";
import { CCP_URL } from "../Constants";
export default class ContactCenter {
constructor() {
try {
var containerDiv = document.getElementById("ccpContainer");
this.connect.core.initCCP(containerDiv as HTMLElement, {
ccpUrl: CCP_URL,
loginPopup: true,
loginPopupAutoClose: true,
loginOptions: {
autoClose: true,
},
softphone: {
allowFramedSoftphone: true,
disableRingtone: false,
},
});
connect.contact(function (contact) {
const c = contact;
if (contact.getType() !== connect.ContactType.CHAT) {
return;
}
c.onConnecting(function (c) {
console.log("incoming");
c.accept();
});
c.onAccepted(async () => {
const cnn = contact.getConnections().find(cnn => cnn.getType() === connect.ConnectionType.AGENT);
if(cnn){
const agentChatSession = await cnn.getMediaController();
console.log(cnn)
}
});
});
return this.connect;
} catch (error) {
console.log(error);
return;
}
}
}
Receiving bellow error.
Property 'getMediaController' does not exist on type 'BaseConnection'. TS2339
33 | const cnn = contact.getConnections().find(cnn => cnn.getType() === connect.ConnectionType.AGENT);
34 | if(cnn){
> 35 | const agentChatSession = await cnn.getMediaController();
| ^
36 | console.log(agentChatSession)
37 | }
38 | });
Please help me out, what am I missing.