[JS] chore: Move datasource Azure OpenAI sample to ai-apps (#1520)

## Linked issues

#minor
related: #1250
related: #1461 

## Details

- Move datasource Azure OpenAI sample to ai-apps
- Fix TTK files
- Update dependencies

## Attestation Checklist

- [x] My code follows the style guidelines of this project

- I have checked for/fixed spelling, linting, and other errors
- I have commented my code for clarity
- I have made corresponding changes to the documentation (updating the
doc strings in the code is sufficient)
- My changes generate no new warnings
- I have added tests that validates my changes, and provides sufficient
test coverage. I have tested with:
  - Local testing
  - E2E testing in Teams
- New and existing unit tests pass locally with my changes

Co-authored-by: Corina Gum <>

js/samples/04.ai-apps/h.datasource-azureOpenAI/README.md

@@ -0,0 +1,103 @@
+# Azure OpenAI On Your Data
+
+The following is a conversational bot that uses the Azure OpenAI Chat Completions API `Azure OpenAI on Your Data` feature to facilitate RAG (retrieval augmentation) using Azure AI Search as the Azure data source.
+
+<!-- @import "[TOC]" {cmd="toc" depthFrom=1 depthTo=6 orderedList=false} -->
+
+<!-- code_chunk_output -->
+
+-   [Azure OpenAI On Your Data](#azure-openai-on-your-data)
+    -   [Summary](#summary)
+        -   [Example Interaction](#example-interaction)
+    -   [Setting up the sample](#setting-up-the-sample)
+    -   [Testing the sample](#testing-the-sample)
+        -   [Using Teams Toolkit for Visual Studio Code](#using-teams-toolkit-for-visual-studio-code)
+
+<!-- /code_chunk_output -->
+
+## Summary
+
+This sample shows how to integrate your Azure AI Search index as a data source into prompt templates through the Azure Chat Completions API.
+
+### Example Interaction
+
+![example interaction](assets/example.png)
+
+## Setting up the sample
+
+> [!IMPORTANT]
+> To prevent issues when installing dependencies after cloning the repo, copy or move the sample directory to it's own location first.
+> If you opened this sample from the Sample Gallery in Teams Toolkit, you can skip to step 3.
+
+1. If you do not have `yarn` installed, and want to run local bits, install it globally
+
+    ```bash
+    npm install -g [email protected]
+    ```
+
+1. In the root **JavaScript folder**, install and build all dependencies
+
+    ```bash
+    cd teams-ai/js
+    # This will use the latest changes from teams-ai in the sample.
+    yarn install #only needs to be run once, after clone or remote pull
+    yarn build
+    # To run using latest published version of teams-ai, do the following instead:
+    cd teams-ai/js/samples/<this-sample-folder>
+    npm install --workspaces=false
+    npm run build
+    ```
+
+1. In a terminal, navigate to the sample root.
+
+    ```bash
+    cd samples/<this-sample-folder>/
+    yarn start
+    # If running the sample on published version of teams-ai
+    npm start
+    ```
+
+1. Duplicate the `sample.env` in the `teams-ai/js/samples/08.datasource.azureOpenAI/` folder. Rename the file to `.env`.
+
+> [!NOTE]
+> Please note that at this time, this sample is only supported with Azure OpenAI.
+
+1. Fill the `AZURE_OPENAI_KEY`, `AZURE_OPENAI_ENDPOINT`, `AZURE_SEARCH_KEY`, `AZURE_SEARCH_ENDPOINT` variables appropriately.
+
+1. Follow the [use your data quickstart instructions](https://learn.microsoft.com/en-us/azure/ai-services/openai/use-your-data-quickstart?tabs=command-line%2Cpython-new&pivots=programming-language-studio#add-your-data-using-azure-openai-studio) to add your data using Azure OpenAI Studio. Select `Upload files` as the data source. You can upload the `nba.pdf` file. Take note of the index name.
+
+1. Update `prompts/chat/config.json` by adding the missing fields in the `data_sources` property:
+
+```json
+"data_sources": [
+    {
+        "type": "azure_search",
+        "parameters": {
+            "endpoint": "", // The Azure AI Search service endpoint
+            "index_name": "", // The index that was created in the previous step.
+            "authentication": {
+                "type": "api_key",
+                "key": "" // The api key for authentication.
+            }
+        }
+    }
+]
+```
+
+## Testing the sample
+
+The easiest and fastest way to get up and running is with Teams Toolkit as your development guide. To use Teams Toolkit to automate setup and debugging, please [continue below](#using-teams-toolkit-for-visual-studio-code).
+
+1.  1. Fill the `AZURE_OPENAI_KEY`, `AZURE_OPENAI_ENDPOINT`, `AZURE_SEARCH_KEY`, `AZURE_SEARCH_ENDPOINT` in the `./env/.env.local.user` file.
+1. Ensure you have downloaded and installed [Visual Studio Code](https://code.visualstudio.com/docs/setup/setup-overview)
+1. Install the [Teams Toolkit extension](https://marketplace.visualstudio.com/items?itemName=TeamsDevApp.ms-teams-vscode-extension)
+1. Copy this sample into a new folder outside of teams-ai
+1. Select File > Open Folder in VS Code and choose this sample's directory
+1. Using the extension, sign in with your Microsoft 365 account where you have permissions to upload custom apps
+1. Ensure that you have set up the sample from the previous step.
+1. Select **Debug > Start Debugging** or **F5** to run the app in a Teams web client.
+1. In the browser that launches, select the **Add** button to install the app to Teams.
+
+> If you do not have permission to upload custom apps (sideloading), Teams Toolkit will recommend creating and using a Microsoft 365 Developer Program account - a free program to get your own dev environment sandbox that includes Teams.
+
+> If you do not have permission to upload custom apps (sideloading), Teams Toolkit will recommend creating and using a Microsoft 365 Developer Program account - a free program to get your own dev environment sandbox that includes Teams.

js/samples/04.ai-apps/h.datasource-azureOpenAI/env/.env.dev.user

@@ -0,0 +1,4 @@
+SECRET_BOT_PASSWORD=
+SECRET_AZURE_OPENAI_KEY=
+SECRET_AZURE_SEARCH_KEY=
+SECRET_AZURE_SEARCH_ENDPOINT=

js/samples/04.ai-apps/h.datasource-azureOpenAI/env/.env.local.user

@@ -0,0 +1,4 @@
+SECRET_BOT_PASSWORD=
+SECRET_AZURE_OPENAI_KEY=
+SECRET_AZURE_SEARCH_KEY=
+SECRET_AZURE_SEARCH_ENDPOINT=

js/samples/04.ai-apps/h.datasource-azureOpenAI/env/.env.staging

@@ -0,0 +1,15 @@
+# This file includes environment variables that will be committed to git by default.
+
+# Built-in environment variables
+TEAMSFX_ENV=staging
+
+# Updating AZURE_SUBSCRIPTION_ID or AZURE_RESOURCE_GROUP_NAME after provision may also require an update to RESOURCE_SUFFIX, because some services require a globally unique name across subscriptions/resource groups.
+AZURE_SUBSCRIPTION_ID=
+AZURE_RESOURCE_GROUP_NAME=
+RESOURCE_SUFFIX=
+
+# Generated during provision, you can also add your own variables.
+BOT_ID=
+TEAMS_APP_ID=
+BOT_AZURE_APP_SERVICE_RESOURCE_ID=
+BOT_DOMAIN=

js/samples/08.datasource.azureOpenAI/infra/azure.bicep → js/samples/04.ai-apps/h.datasource-azureOpenAI/infra/azure.bicep

@@ -6,6 +6,18 @@ param resourceBaseName string
 @description('Required when create Azure Bot service')
 param botAadAppClientId string
 
+@secure()
+param azureOpenAIKey string = ''
+
+@secure()
+param azureOpenAIEndpoint string = ''
+
+@secure()
+param azureSearchKey string = ''
+
+@secure()
+param azureSearchEndpoint string = ''
+
 @secure()
 @description('Required by Bot Framework package in your bot project')
 param botAadAppClientSecret string
@@ -60,6 +72,22 @@ resource webApp 'Microsoft.Web/sites@2021-02-01' = {
           name: 'BOT_PASSWORD'
           value: botAadAppClientSecret
         }
+        {
+          name: 'AZURE_OPENAI_KEY'
+          value: azureOpenAIKey
+        }
+        {
+          name: 'AZURE_OPENAI_ENDPOINT'
+          value: azureOpenAIEndpoint
+        }
+        {
+          name: 'AZURE_SEARCH_KEY'
+          value: azureSearchKey
+        }
+        {
+          name: 'AZURE_SEARCH_ENDPOINT'
+          value: azureSearchEndpoint
+        }
       ]
       ftpsState: 'FtpsOnly'
     }

js/samples/04.ai-apps/h.datasource-azureOpenAI/infra/azure.parameters.json

@@ -0,0 +1,33 @@
+{
+    "$schema": "https://schema.management.azure.com/schemas/2015-01-01/deploymentParameters.json#",
+    "contentVersion": "1.0.0.0",
+    "parameters": {
+        "resourceBaseName": {
+            "value": "TeamsAzureOpenAI-${{RESOURCE_SUFFIX}}"
+        },
+        "botAadAppClientId": {
+            "value": "${{BOT_ID}}"
+        },
+        "botAadAppClientSecret": {
+            "value": "${{SECRET_BOT_PASSWORD}}"
+        },
+        "webAppSKU": {
+            "value": "B1"
+        },
+        "botDisplayName": {
+            "value": "TeamsAzureOpenAI"
+        },
+        "azureOpenAIKey": {
+            "value": "${{SECRET_AZURE_OPENAI_KEY}}"
+        },
+        "azureOpenAIEndpoint": {
+            "value": "${{SECRET_AZURE_OPENAI_ENDPOINT}}"
+        },
+        "azureSearchKey": {
+            "value": "${{SECRET_AZURE_SEARCH_KEY}}"
+        },
+        "azureSearchEndpoint": {
+            "value": "${{SECRET_AZURE_SEARCH_ENDPOINT}}"
+        }
+    }
+}

js/samples/08.datasource.azureOpenAI/package.json → js/samples/04.ai-apps/h.datasource-azureOpenAI/package.json

@@ -22,27 +22,30 @@
     },
     "repository": {
         "type": "git",
-        "url": "https://github.com"
+        "url": "https://github.com/microsoft/teams-ai"
     },
     "dependencies": {
         "@azure/search-documents": "12.0.0",
         "@microsoft/teams-ai": "~1.1.3",
         "@microsoft/teamsfx": "^2.3.0",
-        "@types/debug": "^4.1.12",
-        "@types/jsonwebtoken": "^8.5.0",
         "botbuilder": "^4.22.1",
-        "debug": "^4.3.4",
         "dotenv": "^16.4.1",
+        "openai": "4.28.4",
         "replace": "~1.2.0",
         "restify": "~11.1.0",
         "vectra": "^0.7.6"
     },
     "devDependencies": {
-        "@types/dotenv": "6.1.1",
+        "@types/debug": "^4.1.12",
+        "@types/jsonwebtoken": "^8.5.0",
         "@types/node": "^20.12.5",
         "@types/restify": "8.5.12",
+        "@typescript-eslint/eslint-plugin": "^6.21.0",
+        "@typescript-eslint/parser": "^6.21.0",
+        "debug": "^4.3.4",
         "env-cmd": "^10.1.0",
-        "nodemon": "~1.19.4",
+        "eslint": "^8.57.0",
+        "nodemon": "~3.0.1",
         "rimraf": "^3.0.2",
         "ts-node": "^10.9.2",
         "typescript": "^5.4.4"

js/samples/04.ai-apps/h.datasource-azureOpenAI/teamsapp.local.yml

@@ -0,0 +1,59 @@
+# yaml-language-server: $schema=https://aka.ms/teams-toolkit/1.0.0/yaml.schema.json
+# Visit https://aka.ms/teamsfx-v5.0-guide for details on this file
+# Visit https://aka.ms/teamsfx-actions for details on actions
+version: 1.0.0
+
+provision:
+    - uses: teamsApp/create # Creates a Teams app
+      with:
+          name: TeamsAzureOpenAI-${{TEAMSFX_ENV}} # Teams app name
+      writeToEnvironmentFile: # Write the information of installed dependencies into environment file for the specified environment variable(s).
+          teamsAppId: TEAMS_APP_ID
+
+    - uses: botAadApp/create # Creates a new AAD app for bot if BOT_ID environment variable is empty
+      with:
+          name: TeamsAzureOpenAI
+      writeToEnvironmentFile:
+          botId: BOT_ID
+          botPassword: SECRET_BOT_PASSWORD
+
+    - uses: botFramework/create # Create or update the bot registration on dev.botframework.com
+      with:
+          botId: ${{BOT_ID}}
+          name: TeamsAzureOpenAI
+          messagingEndpoint: ${{BOT_ENDPOINT}}/api/messages
+          description: ''
+          channels:
+              - name: msteams
+
+    - uses: teamsApp/validateManifest # Validate using manifest schema
+      with:
+          manifestPath: ./appPackage/manifest.json # Path to manifest template
+
+    - uses: teamsApp/zipAppPackage # Build Teams app package with latest env value
+      with:
+          manifestPath: ./appPackage/manifest.json # Path to manifest template
+          outputZipPath: ./build/appPackage/appPackage.${{TEAMSFX_ENV}}.zip
+          outputJsonPath: ./build/appPackage/manifest.${{TEAMSFX_ENV}}.json
+
+    - uses: teamsApp/update # Apply the Teams app manifest to an existing Teams app in Teams Developer Portal. Will use the app id in manifest file to determine which Teams app to update.
+      with:
+          appPackagePath: ./build/appPackage/appPackage.${{TEAMSFX_ENV}}.zip # Relative path to this file. This is the path for built zip file.
+
+deploy:
+    # Install any dependencies and build the web app using NPM
+    - uses: cli/runNpmCommand
+      name: install dependencies
+      with:
+          args: install --no-audit --workspaces=false
+    # Provides the Teams Toolkit .env file values to the apps runtime so they can be accessed with `process.env`.
+    - uses: file/createOrUpdateEnvironmentFile
+      with:
+          target: ./.env
+          envs:
+              BOT_ID: ${{BOT_ID}}
+              BOT_PASSWORD: ${{SECRET_BOT_PASSWORD}}
+              AZURE_OPENAI_KEY: ${{SECRET_AZURE_OPENAI_KEY}}
+              AZURE_OPENAI_ENDPOINT: ${{SECRET_AZURE_OPENAI_ENDPOINT}}
+              AZURE_SEARCH_KEY: ${{SECRET_AZURE_SEARCH_KEY}}
+              AZURE_SEARCH_ENDPOINT: ${{SECRET_AZURE_SEARCH_ENDPOINT}}