Ms Teams Integration in React App Using Azure Communication Service

Question

Hi, I want to integrate Microsoft Teams into my React app. I am using some packages and helper functions provided by Azure Communication Services, as shown below:

import { AzureCommunicationTokenCredential, CommunicationUserIdentifier } from '``@azure``/communication-common';

import { CallComposite, fromFlatCommunicationIdentifier, useAzureCommunicationCallAdapter } from '``@azure``/communication-react';

I have created a resource in Azure Communication Services and am obtaining the token and identity from ACS. However, when I try to integrate Microsoft Teams into my React app, fromFlatCommunicationIdentifier and useAzureCommunicationCallAdapter are not working.

Note: I am using a class component.

I am following the documentation for MS Teams integration here: [MS Teams Integration Documentation]

(https://learn.microsoft.com/en-gb/microsoft-cloud/dev/tutorials/acs-to-teams-meeting?WT.mc_id=m365-80533-dwahlin&tabs=typescript%2Cbash&tutorial-step=2)

Kindly assist on how can I integrate it within our React webapp.