fix: Add AZURE_APP_API_BASE_URL environment variable and update related configurations for Teams extension

Author: Pavan-Microsoft

docs/teams_extension.md

@@ -32,11 +32,11 @@ This extension enables users to experience Chat with your data within Teams, wit
 
 ![ENV](images/teams-1.png)
 
-4. Locate the environment variable _AZURE_FUNCTION_URL_.
-5. Replace the `<FUNCTION_APP_NAME>` and `<FUNCTION_KEY>` with your actual Function App name and function key
+4. Locate the environment variables _AZURE_FUNCTION_URL_ and _AZURE_APP_API_BASE_URL_.
+5. Replace the `<FUNCTION_APP_NAME>` and `<FUNCTION_KEY>` with your actual Function App name and function key, and replace `<APP-NAME>` with your actual App Service name
     ```env
     AZURE_FUNCTION_URL=https://<FUNCTION_APP_NAME>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_KEY>
-
+    AZURE_APP_API_BASE_URL=https://<APP-NAME>.azurewebsites.net/
     ```
     ![Env](images/teams-deploy-env.png)
 6. Save the file.

extensions/teams/cards/cardBuilder.ts

@@ -1,11 +1,12 @@
 import { Attachment, CardFactory } from "botbuilder";
 import { Citation, CardType } from "../model";
+import config from "../config";
 
 export function actionBuilder(citation: Citation, docId: number): any {
 
-    const urlParts = citation.url.split("]");
-    let url = urlParts[urlParts.length - 1].replaceAll("(", "").replaceAll(")", "");
     let title = citation.title.replaceAll("/documents/", "");
+    const filename = title;
+    let fileApiUrl = `${config.getFileEndpoint}/${filename}`;
     let content = citation.content.replaceAll(citation.title, "").replaceAll("url", "");
     content = content.replaceAll(/(<([^>]+)>)/ig, "\n").replaceAll("<>", "");
     let citationCardAction = {
@@ -37,7 +38,7 @@ export function actionBuilder(citation: Citation, docId: number): any {
                 {
                     type: CardType.OpenUrl,
                     title: "Go to the source",
-                    url: decodeURI(url),
+                    url: decodeURI(fileApiUrl),
                 }
             ]
         }

extensions/teams/config.ts

@@ -2,7 +2,11 @@ const config = {
   botId: process.env.BOT_ID,
   botPassword: process.env.BOT_PASSWORD,
   azureFunctionUrl: process.env.AZURE_FUNCTION_URL,
+  azureAppApiBaseUrl: process.env.AZURE_APP_API_BASE_URL,
   tenantId: process.env.TEAMS_APP_TENANT_ID,
+  getFileEndpoint: process.env.AZURE_APP_API_BASE_URL ?
+    `${process.env.AZURE_APP_API_BASE_URL}api/files` :
+    null,
 };
 
 export default config;

extensions/teams/env/.env.dev

@@ -14,4 +14,5 @@ BOT_ID=
 TEAMS_APP_ID=
 BOT_AZURE_APP_SERVICE_RESOURCE_ID=
 BOT_DOMAIN=
-AZURE_FUNCTION_URL=https://backend-<RESOURCE_TOKEN>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_APP_CLIENT_KEY>&clientId=clientKey
+AZURE_FUNCTION_URL=https://<FUNCTION_APP_NAME>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_KEY>
+AZURE_APP_API_BASE_URL=https://<APP-NAME>.azurewebsites.net/

extensions/teams/env/.env.test

@@ -14,6 +14,7 @@ BOT_ID=
 TEAMS_APP_ID=
 BOT_AZURE_APP_SERVICE_RESOURCE_ID=
 BOT_DOMAIN=
-AZURE_FUNCTION_URL=https://backend-<RESOURCE_TOKEN>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_APP_CLIENT_KEY>&clientId=clientKey
+AZURE_FUNCTION_URL=https://<FUNCTION_APP_NAME>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_KEY>
+AZURE_APP_API_BASE_URL=https://<APP-NAME>.azurewebsites.net/
 TEAMS_APP_TENANT_ID=
 TEAMS_APP_PUBLISHED_APP_ID=

extensions/teams/env/.env.testtool

@@ -6,4 +6,5 @@ TEAMSFX_ENV=testtool
 # Environment variables used by test tool
 TEAMSAPPTESTER_PORT=56150
 TEAMSFX_NOTIFICATION_STORE_FILENAME=.notification.testtoolstore.json
-AZURE_FUNCTION_URL=https://backend-<RESOURCE_TOKEN>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_APP_CLIENT_KEY>&clientId=clientKey
+AZURE_FUNCTION_URL=https://<FUNCTION_APP_NAME>.azurewebsites.net/api/GetConversationResponse?code=<FUNCTION_KEY>
+AZURE_APP_API_BASE_URL=https://<APP-NAME>.azurewebsites.net/

extensions/teams/infra/azure.bicep

@@ -17,6 +17,9 @@ param botAadAppClientSecret string
 @description('Required by Bot Framework azureFunctionURL')
 param azureFunctionURL string
 
+@description('Base URL for the Azure Web App API endpoints used for file access')
+param azureAppApiBaseUrl string
+
 param webAppSKU string
 
 @maxLength(42)
@@ -72,6 +75,10 @@ resource webApp 'Microsoft.Web/sites@2021-02-01' = {
           name: 'AZURE_FUNCTION_URL'
           value: azureFunctionURL
         }
+        {
+          name: 'AZURE_APP_API_BASE_URL'
+          value: azureAppApiBaseUrl
+        }
         {
           name: 'TEAMS_APP_TENANT_ID'
           value: botAadAppTenantId

extensions/teams/infra/azure.parameters.json

@@ -17,11 +17,14 @@
     "azureFunctionURL": {
       "value": "${{AZURE_FUNCTION_URL}}"
     },
+    "azureAppApiBaseUrl": {
+      "value": "${{AZURE_APP_API_BASE_URL}}"
+    },
     "webAppSKU": {
       "value": "B1"
     },
     "botDisplayName": {
       "value": "teams-bot-toolkit"
     }
   }
-}
+}

extensions/teams/teamsapp.local.yml

@@ -77,3 +77,4 @@ deploy:
         BOT_ID: ${{BOT_ID}}
         BOT_PASSWORD: ${{SECRET_BOT_PASSWORD}}
         AZURE_FUNCTION_URL: ${{AZURE_FUNCTION_URL}}
+        AZURE_APP_API_BASE_URL: ${{AZURE_APP_API_BASE_URL}}

extensions/teams/teamsapp.testtool.yml

@@ -22,4 +22,5 @@ deploy:
       target: ./.localConfigs.testTool
       envs:
         TEAMSFX_NOTIFICATION_STORE_FILENAME: ${{TEAMSFX_NOTIFICATION_STORE_FILENAME}}
-        AZURE_FUNCTION_URL: ${{AZURE_FUNCTION_URL}}
+        AZURE_FUNCTION_URL: ${{AZURE_FUNCTION_URL}}
+        AZURE_APP_API_BASE_URL: ${{AZURE_APP_API_BASE_URL}}