MilanKaur-01

const [teamsMeetingLink, setTeamsMeetingLink] = useState<string>('');

MilanKaur-01

npm install @azure/communication-common @azure/communication-react

MilanKaur-01

// Replace '' with the ACS user identity value
const [userId, setUserId] = useState<string>(''); 

// Replace '' with the ACS token value
const [token, setToken] = useState<string>(''); 

// Replace '' with the Teams meeting link value
const [teamsMeetingLink, setTeamsMeetingLink] = useState<string>('');

MilanKaur-01

if (callAdapter) {
    return (
        <div>
            <h1>Contact Customer Service</h1>
            <div className="wrapper">
                <CallComposite adapter={callAdapter} />
            </div>
        </div>
    );
}

MilanKaur-01

if (callAdapter) {
  return (
    <div> 
      <h1>Contact Customer Service</h1>
      <div className="wrapper"> 
        <CallComposite 
          adapter={callAdapter} 
        /> 
      </div> 
    </div> 

MilanKaur-01

const callAdapterArgs = useMemo(() => { 
  if (userId && credential && displayName && teamsMeetingLink) { 
    return { 
      userId: fromFlatCommunicationIdentifier(userId)  
               as CommunicationUserIdentifier, 
      displayName, 
      credential, 
      locator: { meetingLink: teamsMeetingLink }, 
    } 
  } 

MilanKaur-01

useEffect(() => {
  const init = async () => {
    setMessage('Getting Teams meeting link...'); 
    
    //Call Azure Function to get the meeting link 
    res = await fetch(process.env.REACT_APP_TEAMS_MEETING_FUNCTION as string); 
    let link = await res.text(); 
    setTeamsMeetingLink(link); 
    console.log('Teams meeting link', link); 
  }

MilanKaur-01

const newMeeting = `/users/${userId}/calendar/events`; 
     
const event = { 
    subject: 'Customer Service Meeting', 
    start: { 
        dateTime: startTime, 
        timeZone: 'UTC' 
    }, 
    end: { 
        dateTime: endTime,