updates

Author: ddematheu2

articles/communication-services/tutorials/widgets/click-to-call-widget.md

@@ -1,16 +1,32 @@
+---
+title: Tutorial - Embed a Teams call widget into your web application
+titleSuffix: An Azure Communication Services tutorial
+description: Learn how to use Azure Communication Services to embed a calling widget into your web application.
+author: ddematheu2
+manager: shahen
+services: azure-communication-services
+
+ms.author: dademath
+ms.date: 04/17/2023
+ms.topic: tutorial
+ms.service: azure-communication-services
+ms.subservice: calling
+---
+
 # Embed a Teams call widget into your web application
 
 Enable your customers to talk with your support agent on Teams through a call interface directly embedded into your web application. 
 
 ## Architecture overview
 
 ## Pre-requisites
-- Azure Subscription
-- Azure Communication Services resource
+- An Azure account with an active subscription. For details, see [Create an account for free](https://azure.microsoft.com/free/?WT.mc_id=A261C142F).
+- [Visual Studio Code](https://code.visualstudio.com/) on one of the [supported platforms](https://code.visualstudio.com/docs/supporting/requirements#_platforms).
+- An active Communication Services resource and connection string. [Create a Communication Services resource](../quickstarts/create-communication-resource.md).
 
 ## Set up an Azure Function to provide access tokens
 
-Follow instructions from our [trusted user access service tutorial](https://learn.microsoft.com/azure/communication-services/tutorials/trusted-service-tutorial) to deploy your Azure Function for access tokens. This service will return an access token which our widget will use to authenticate to Azure Communication Services and start the call to the Teams user we define.
+Follow instructions from our [trusted user access service tutorial](../trusted-service-tutorial) to deploy your Azure Function for access tokens. This service returns an access token which our widget uses to authenticate to Azure Communication Services and start the call to the Teams user we define.
 
 ## Set up boilerplate vanilla web application
 
@@ -75,11 +91,10 @@ Follow instructions from our [trusted user access service tutorial](https://lear
 
 ```
 
-3. Configure the call window to be hidden by default. We will show it when the user clicks the button.
+1. Configure the call window to be hidden by default. We show it when the user clicks the button.
 
 ``` html
 
-    <script src="https://github.com/Azure/communication-ui-library/releases/latest/download/callComposite.js"></script>
     <script>
         var open = false;
         const button = document.querySelector('.widget');
@@ -104,7 +119,7 @@ Follow instructions from our [trusted user access service tutorial](https://lear
 
 ```
 
-At this point we have set up a static HTML page with a button that will open a call widget when clicked. We will next add the widget script code. It will make a call to our Azure Function to get the access token and then use it to initialize our call client for Azure Communication Services and start the call to the Teams user we define.
+At this point we have set up a static HTML page with a button that opens a call widget when clicked. Next, we add the widget script code. It makes a call to our Azure Function to get the access token and then use it to initialize our call client for Azure Communication Services and start the call to the Teams user we define.
 
 ## Fetch an access token from your Azure Function
 
@@ -119,7 +134,7 @@ Add the following code to the `getAccessToken()` function:
     }
 
 ```
-You will need to add the URL of your Azure Function. You can find these values in the Azure portal under your Azure Function resource.
+You need to add the URL of your Azure Function. You can find these values in the Azure portal under your Azure Function resource.
 
 
 ## Initialize the call widget
@@ -128,7 +143,7 @@ You will need to add the URL of your Azure Function. You can find these values i
 
 ``` html
 
-    <script src="https://github.com/Azure/communication-ui-library/releases/latest/download/callComposite.js"></script>
+    <script src="https://github.com/ddematheu2/ACS-UI-Library-Widget/releases/download/widget/callComposite.js"></script>
 
 ```
 
@@ -148,7 +163,7 @@ We provide a test script hosted on GitHub for you to use for testing. For produc
             const callAdapter = await callComposite.loadCallComposite(
                 {
                 displayName: "Test User",
-                locator: { participantIds: ['INSERT TEAMS USER ID']},
+                locator: { participantIds: ['INSERT USER UNIQUE IDENTIFIER FROM MICROSOFT GRAPH']},
                 userId: response.user,
                 token: response.userToken
                 },
@@ -167,4 +182,8 @@ We provide a test script hosted on GitHub for you to use for testing. For produc
 
 ```
 
-This code will initialize the call widget when the button is clicked. It will make a call to our Azure Function to get the access token and then use it to initialize our call client for Azure Communication Services and start the call to the Teams user we define.
+Add a Microsoft Graph [User](https://learn.microsoft.com/graph/api/resources/user?view=graph-rest-1.0) ID to the `participantIds` array. You can find this value through [Microsoft Graph](https://learn.microsoft.com/graph/api/user-get?view=graph-rest-1.0&tabs=http) or through [Microsoft Graph explorer](https://developer.microsoft.com/graph/graph-explorer) for testing purposes. There you can grab the `id` value from the response.
+
+## Run code
+
+Open the `index.html` in a browser. This code initializes the call widget when the button is clicked. It makes a call to our Azure Function to get the access token and then use it to initialize our call client for Azure Communication Services and start the call to the Teams user we define.