@microsoft/teamsfx-core 2.0.2-alpha.eebec21dd.0 → 2.0.2

package/templates/bicep/azureWebApp.provision.module.bicep

@@ -0,0 +1,85 @@
+@secure()
+param provisionParameters object
+param userAssignedIdentityId string
+
+var resourceBaseName = provisionParameters.resourceBaseName
+var serverfarmsName = contains(provisionParameters, 'webAppServerfarmsName') ? provisionParameters['webAppServerfarmsName'] : '${resourceBaseName}{{scenarioInLowerCase}}' // Try to read name for App Service Plan from parameters
+{{#if (equals "Bot" scenario)}}
+var webAppSKU = contains(provisionParameters, 'webAppSKU') ? provisionParameters['webAppSKU'] : 'B1' // Try to read SKU for Azure Web App from parameters
+{{else}}
+var webAppSKU = contains(provisionParameters, 'webAppSKU') ? provisionParameters['webAppSKU'] : 'F1' // Try to read SKU for Azure Web App from parameters
+{{/if}}
+var webAppName = contains(provisionParameters, 'webAppSitesName') ? provisionParameters['webAppSitesName'] : '${resourceBaseName}{{scenarioInLowerCase}}' // Try to read name for Azure Web App from parameters
+
+// Compute resources for your Web App
+resource serverfarm 'Microsoft.Web/serverfarms@2021-02-01' = {
+  kind: 'app'
+  location: resourceGroup().location
+  name: serverfarmsName
+  sku: {
+    name: webAppSKU
+  }
+  properties: {}
+}
+
+// Web App that hosts your app
+resource webApp 'Microsoft.Web/sites@2021-02-01' = {
+  kind: 'app'
+  location: resourceGroup().location
+  name: webAppName
+  properties: {
+    serverFarmId: serverfarm.id
+    keyVaultReferenceIdentity: userAssignedIdentityId // Use given user assigned identity to access Key Vault
+    httpsOnly: true
+    siteConfig: {
+      {{#if (equals "Bot" scenario)}}
+      alwaysOn: true
+      {{/if}}
+      appSettings: [
+        {{#if (contains "node" configs)}}
+        {
+          name: 'WEBSITE_NODE_DEFAULT_VERSION'
+          value: '~18' // Set NodeJS version to 18.x for your site
+        }
+        {
+          name: 'SCM_SCRIPT_GENERATOR_ARGS'
+          value: '--node' // Register as node server
+        }
+        {
+          name: 'RUNNING_ON_AZURE'
+          value: '1'
+        }
+        {{else}}
+          {{#if (equals "Tab" scenario)}}
+        {
+          name: 'WEBSITE_RUN_FROM_PACKAGE'
+          value: '1'
+        }
+          {{else}}
+        {
+          name: 'SCM_DO_BUILD_DURING_DEPLOYMENT'
+          value: 'true' // Execute build steps on your site during deployment
+        }
+        {
+          name: 'RUNNING_ON_AZURE'
+          value: '1'
+        }
+          {{/if}}
+        {{/if}}
+      ]
+    }
+  }
+  identity: {
+    type: 'UserAssigned'
+    userAssignedIdentities: {
+      '${userAssignedIdentityId}': {} // The identity is used to access other Azure resources
+    }
+  }
+}
+
+output skuName string = webAppSKU
+output siteName string = webAppName
+output domain string = webApp.properties.defaultHostName
+output appServicePlanName string = serverfarmsName
+output resourceId string = webApp.id
+output siteEndpoint string = 'https://${webApp.properties.defaultHostName}'

package/templates/bicep/azureWebApp.provision.orchestration.bicep

@@ -0,0 +1,27 @@
+// Resources web app
+module azureWebApp{{scenario}}Provision './provision/azureWebApp{{scenario}}.bicep' = {
+  name: 'azureWebApp{{scenario}}Provision'
+  params: {
+    provisionParameters: provisionParameters
+    userAssignedIdentityId: {{identity.resourceId}}
+  }
+}
+
+
+output azureWebApp{{scenario}}Output object = {
+  teamsFxPluginId: '{{componentId}}'
+  skuName: azureWebApp{{scenario}}Provision.outputs.skuName
+  siteName: azureWebApp{{scenario}}Provision.outputs.siteName
+  domain: azureWebApp{{scenario}}Provision.outputs.domain
+  appServicePlanName: azureWebApp{{scenario}}Provision.outputs.appServicePlanName
+  resourceId: azureWebApp{{scenario}}Provision.outputs.resourceId
+  siteEndpoint: azureWebApp{{scenario}}Provision.outputs.siteEndpoint
+  {{#if (equals "Tab" scenario )}}
+  endpoint: azureWebApp{{scenario}}Provision.outputs.siteEndpoint
+  {{/if}}
+}
+
+output {{scenario}}Output object = {
+  domain: azureWebApp{{scenario}}Provision.outputs.domain
+  endpoint: azureWebApp{{scenario}}Provision.outputs.siteEndpoint
+}

package/templates/bicep/botService.parameters.json

@@ -0,0 +1,4 @@
+{
+  "botAadAppClientId": "{{state.teams-bot.botId}}",
+  "botAadAppClientSecret": "{{state.teams-bot.botPassword}}"
+}

package/templates/bicep/botService.provision.module.bicep

@@ -0,0 +1,33 @@
+@secure()
+param provisionParameters object
+param botEndpoint string
+var resourceBaseName = provisionParameters.resourceBaseName
+var botAadAppClientId = provisionParameters['botAadAppClientId'] // Read AAD app client id for Azure Bot Service from parameters
+var botServiceName = contains(provisionParameters, 'botServiceName') ? provisionParameters['botServiceName'] : '${resourceBaseName}' // Try to read name for Azure Bot Service from parameters
+var botServiceSku = contains(provisionParameters, 'botServiceSku') ? provisionParameters['botServiceSku'] : 'F0' // Try to read SKU for Azure Bot Service from parameters
+var botDisplayName = contains(provisionParameters, 'botDisplayName') ? provisionParameters['botDisplayName'] : '${resourceBaseName}' // Try to read display name for Azure Bot Service from parameters
+
+// Register your web service as a bot with the Bot Framework
+resource azureBot 'Microsoft.BotService/botServices@2021-03-01' = {
+  kind: 'azurebot'
+  location: 'global'
+  name: botServiceName
+  properties: {
+    displayName: botDisplayName
+    endpoint: uri(botEndpoint, '/api/messages')
+    msaAppId: botAadAppClientId
+  }
+  sku: {
+    name: botServiceSku // You can follow https://aka.ms/teamsfx-bicep-add-param-tutorial to add botServiceSku property to provisionParameters to override the default value "F0".
+  }
+}
+
+// Connect the bot service to Microsoft Teams
+resource botServiceMsTeamsChannel 'Microsoft.BotService/botServices/channels@2021-03-01' = {
+  parent: azureBot
+  location: 'global'
+  name: 'MsTeamsChannel'
+  properties: {
+    channelName: 'MsTeamsChannel'
+  }
+}

package/templates/bicep/botService.provision.orchestration.bicep

@@ -0,0 +1,8 @@
+// Merge TeamsFx configurations to Bot service
+module botProvision './provision/botService.bicep' = {
+  name: 'botProvision'
+  params: {
+    provisionParameters: provisionParameters
+    botEndpoint: {{endpointVarName}}
+  }
+}

package/templates/bicep/config.bicep

@@ -0,0 +1,3 @@
+@secure()
+param provisionParameters object
+param provisionOutputs object

package/templates/bicep/identity.provision.module.bicep

@@ -0,0 +1,15 @@
+@secure()
+param provisionParameters object
+var resourceBaseName = provisionParameters.resourceBaseName
+var identityName = contains(provisionParameters, 'userAssignedIdentityName') ? provisionParameters['userAssignedIdentityName'] : '${resourceBaseName}' // Try to read name for user assigned identity from parameters
+
+// user assigned identity will be used to access other Azure resources
+resource managedIdentity 'Microsoft.ManagedIdentity/userAssignedIdentities@2018-11-30' = {
+  name: identityName
+  location: resourceGroup().location
+}
+
+output identityName string = identityName
+output identityClientId string = managedIdentity.properties.clientId
+output identityResourceId string = managedIdentity.id
+output identityPrincipalId string = managedIdentity.properties.principalId

package/templates/bicep/identity.provision.orchestration.bicep

@@ -0,0 +1,14 @@
+// Resources for identity
+module userAssignedIdentityProvision './provision/identity.bicep' = {
+  name: 'userAssignedIdentityProvision'
+  params: {
+    provisionParameters: provisionParameters
+  }
+}
+
+output identityOutput object = {
+  teamsFxPluginId: 'identity'
+  identityName: userAssignedIdentityProvision.outputs.identityName
+  identityResourceId: userAssignedIdentityProvision.outputs.identityResourceId
+  identityClientId: userAssignedIdentityProvision.outputs.identityClientId
+}

package/templates/bicep/keyVault.provision.module.bicep

@@ -0,0 +1,57 @@
+@secure()
+param provisionParameters object
+param userAssignedIdentityObjectId string // User assigned identity that will be grant Key Vault access permission
+
+var resourceBaseName = provisionParameters.resourceBaseName
+var keyVaultName = contains(provisionParameters, 'keyVaultName') ? provisionParameters['keyVaultName'] : '${resourceBaseName}' // Try to read name for Key Vault from parameters
+var tenantId = subscription().tenantId
+var m365ClientSecretName = 'm365ClientSecret' // Secret name of AAD app client secret
+var m365ClientSecret = contains(provisionParameters, 'm365ClientSecret') ? provisionParameters['m365ClientSecret'] : '' // Try to read AAD app client secret from parameters
+var botClientSecretName = 'botClientSecret' // Secret name of bot's AAD app client secret
+var botClientSecret = contains(provisionParameters, 'botAadAppClientSecret') ? provisionParameters['botAadAppClientSecret'] : '' // Try to read bot's AAD app client secret from parameters
+var keyVaultSkuName = contains(provisionParameters, 'keyVaultSkuName') ? provisionParameters['keyVaultSkuName'] : 'standard' // Try to read SKU for Key Vault from parameters
+
+resource keyVault 'Microsoft.KeyVault/vaults@2019-09-01' = {
+  name: keyVaultName
+  location: resourceGroup().location
+  properties: {
+    tenantId: tenantId
+    accessPolicies: [
+      {
+        tenantId: tenantId
+        objectId: userAssignedIdentityObjectId
+        permissions: {
+          secrets: [
+            'get'
+          ]
+        }
+      }
+    ]
+    sku: {
+      name: keyVaultSkuName // You can follow https://aka.ms/teamsfx-bicep-add-param-tutorial to add "keyVaultSkuName" property to provisionParameters to override the default value "standard".
+      family: 'A'
+    }
+  }
+}
+
+// Set or update AAD app client secret if it's not empty in parameters
+resource clientSecretKv 'Microsoft.KeyVault/vaults/secrets@2019-09-01' = if (length(m365ClientSecret) != 0) {
+  parent: keyVault
+  name: m365ClientSecretName
+  properties: {
+    value: m365ClientSecret
+  }
+}
+
+// Set or update bot's AAD app client secret if it's not empty in parameters
+resource botClientSecretKv 'Microsoft.KeyVault/vaults/secrets@2019-09-01' = if (length(botClientSecret) != 0) {
+  parent: keyVault
+  name: botClientSecretName
+  properties: {
+    value: botClientSecret
+  }
+}
+
+output keyVaultResourceId string = keyVault.id
+output m365ClientSecretReference string = '@Microsoft.KeyVault(VaultName=${keyVaultName};SecretName=${m365ClientSecretName})'
+output botClientSecretReference string = '@Microsoft.KeyVault(VaultName=${keyVaultName};SecretName=${botClientSecretName})'

package/templates/bicep/keyVault.provision.orchestration.bicep

@@ -0,0 +1,15 @@
+// Resources for Azure Key Vault
+module keyVaultProvision './provision/keyVault.bicep' = {
+  name: 'keyVaultProvision'
+  params: {
+    provisionParameters: provisionParameters
+    userAssignedIdentityObjectId: {{identity.principalId}}
+  }
+}
+
+output keyVaultOutput object = {
+  teamsFxPluginId: 'key-vault'
+  keyVaultResourceId: keyVaultProvision.outputs.keyVaultResourceId
+  m365ClientSecretReference: keyVaultProvision.outputs.m365ClientSecretReference
+  botClientSecretReference: keyVaultProvision.outputs.botClientSecretReference
+}

package/templates/bicep/main.bicep

@@ -0,0 +1,18 @@
+@secure()
+param provisionParameters object
+
+module provision './provision.bicep' = {
+  name: 'provisionResources'
+  params: {
+    provisionParameters: provisionParameters
+  }
+}
+output provisionOutput object = provision
+module config './config.bicep' = {
+  name: 'configureResources'
+  params: {
+    provisionParameters: provisionParameters
+    provisionOutputs: provision
+  }
+}
+output configOutput object = contains(reference(resourceId('Microsoft.Resources/deployments', config.name), '2020-06-01'), 'outputs') ? config : {}

package/templates/bicep/provision.bicep

@@ -0,0 +1,2 @@
+@secure()
+param provisionParameters object

package/templates/core/v3Migration/csharp.app.local.yml

@@ -1,7 +1,7 @@
-# yaml-language-server: $schema=https://aka.ms/teams-toolkit/1.1.0/yaml.schema.json
+# 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.1.0
+version: 1.0.0
 
 provision:
 {{#if activePlugins.fx-resource-aad-app-for-teams}}
@@ -41,7 +41,7 @@ provision:
   - uses: file/createOrUpdateJsonFile
     with:
       target: ./appsettings.Development.json
-      content:
+      appsettings:
         BOT_ID: $\{{BOT_ID}}
         BOT_PASSWORD: $\{{SECRET_BOT_PASSWORD}}
   {{#if activePlugins.fx-resource-aad-app-for-teams}}
@@ -63,7 +63,7 @@ provision:
   - uses: file/createOrUpdateJsonFile
     with:
       target: ./appsettings.Development.json
-      content:
+      appsettings:
         TeamsFx:
           Authentication:
             ClientId: $\{{AAD_APP_CLIENT_ID}}

package/templates/plugins/resource/aad/bicep/parameters.json

@@ -0,0 +1,6 @@
+{
+  "m365ClientId": "{{state.fx-resource-aad-app-for-teams.clientId}}",
+  "m365ClientSecret": "{{state.fx-resource-aad-app-for-teams.clientSecret}}",
+  "m365TenantId": "{{state.fx-resource-aad-app-for-teams.tenantId}}",
+  "m365OauthAuthorityHost": "{{state.fx-resource-aad-app-for-teams.oauthHost}}"
+}

package/templates/plugins/resource/apiconnector/package.json

@@ -0,0 +1,5 @@
+{
+    "dependencies": {
+        "@microsoft/teamsfx": "^2.0.0"
+    }
+}

package/templates/plugins/resource/apiconnector/sample/footerComment.template

@@ -0,0 +1,20 @@
+/* 
+Setting API configuration for cloud environment: 
+We have set configuration in `.env.teamsfx.local` based on your answers. 
+Before you deploy your code to Azure using TeamsFx, follow https://aka.ms/teamsfx-add-appsettings to add the following configuration (with their appropriate values) to your Azure environment: 
+TEAMSFX_API_{{capitalName}}_ENDPOINT
+{{#if (equals config.AuthConfig.AuthType "basic")}}
+TEAMSFX_API_{{capitalName}}_USERNAME
+TEAMSFX_API_{{capitalName}}_PASSWORD
+{{else if (equals config.AuthConfig.AuthType "aad")}}
+    {{#if (equals config.AuthConfig.ReuseTeamsApp false)}}
+TEAMSFX_API_{{capitalName}}_TENANT_ID
+TEAMSFX_API_{{capitalName}}_CLIENT_ID
+TEAMSFX_API_{{capitalName}}_CLIENT_SECRET
+    {{/if}}
+{{else if (equals config.AuthConfig.AuthType "apikey")}}
+TEAMSFX_API_{{capitalName}}_API_KEY
+{{/if}}
+
+Refer to https://aka.ms/teamsfx-connect-api to learn more. 
+*/

package/templates/plugins/resource/apiconnector/sample/headerComment.template

@@ -0,0 +1,52 @@
+// This file is auto generated by Teams Toolkit to provide you instructions and reference code to call your API.
+
+/*
+Next steps:
+1. Run npm install. We added the @microsoft/teamsfx to your package.json.
+   You need to run the command under the "{{component}}" folder (instead of your project root folder).
+{{#if (equals config.AuthConfig.AuthType "basic")}}
+2. Add your user password to TEAMSFX_API_{{capitalName}}_PASSWORD in `{{component}}/.env.teamsfx.local`.
+{{else if (equals config.AuthConfig.AuthType "aad")}}
+    {{#if (equals config.AuthConfig.ReuseTeamsApp false)}}
+2. Replace "<your-api-scope>" in this file with actual scope required by the API.
+3. Set `TEAMSFX_API_{{capitalName}}_CLIENT_SECRET` to your client secret in the file `{{component}}/.env.teamsfx.local`.
+    {{else}}
+2. Replace "<your-api-scope>" in this file with actual scope required by the API.
+3. Refer https://aka.ms/teamsfx-connect-api-with-aad for configuring AAD app and consent scopes.
+    {{/if}}
+{{else if (equals config.AuthConfig.AuthType "apikey")}}
+2. Set `TEAMSFX_API_{{capitalName}}_API_KEY` to your API key in the file `{{component}}/.env.teamsfx.local`.
+{{else if (equals config.AuthConfig.AuthType "cert")}}
+2. Add code to read your certificate content and replace "<your-cert>" and "<your-private-key>" with the actual values.
+{{else if (equals config.AuthConfig.AuthType "custom")}}
+2. Refer to the sample code and comments in this file to implement your custom auth provider.
+{{/if}}
+
+{{#if (equals languageExt "js")}}
+It is also recommended to put all the configurations into config.js file.
+{{else}}
+It is also recommended to put all the configurations into config.ts file.
+{{/if}}
+
+You can import the API client (an Axios instance) in another file and call {{config.APIName}} APIs and authentication is now handled for you automatically.
+
+Here is an example for a GET request to "relative_path_of_target_api":
+```
+{{#if (equals languageExt "js")}}
+const { {{config.APIName}}Client } = require("relative_path_to_this_file");
+{{else}}
+import { {{config.APIName}}Client } from "relative_path_to_this_file";
+{{/if}}
+
+const response = await {{config.APIName}}Client.get("relative_path_of_target_api");
+// You only need to enter the relative path for your API.
+// For example, if you want to call api https://my-api-endpoint/test and you configured https://my-api-endpoint as the API endpoint,
+// your code will be: const response = await {{config.APIName}}Client.get("test");
+
+const responseBody = response.data;
+```
+
+If you added this API while local debugging, stop local debugging and start again because local debugging will not hot reload changes to `.env.teamsfx.local`.
+
+Refer to https://aka.ms/teamsfx-connect-api to learn more. 
+*/

package/templates/plugins/resource/apiconnector/sample/js/aad.template

@@ -0,0 +1,31 @@
+const teamsfxSdk = require("@microsoft/teamsfx");
+
+// Load application configuration. This sample uses the client credential flow to acquire a token for your API.
+{{#if (equals config.AuthConfig.ReuseTeamsApp true)}}
+const teamsFx = new teamsfxSdk.TeamsFx(teamsfxSdk.IdentityType.App, {
+  authorityHost: process.env.M365_AUTHORITY_HOST,
+  tenantId: process.env.M365_TENANT_ID,
+  clientId: process.env.M365_CLIENT_ID,
+  clientSecret: process.env.M365_CLIENT_SECRET,
+});
+{{else}}
+const teamsFx = new teamsfxSdk.TeamsFx(teamsfxSdk.IdentityType.App, {
+  // You can replace the default authorityHost URL
+  authorityHost: "https://login.microsoftonline.com",
+  tenantId: process.env.TEAMSFX_API_{{capitalName}}_TENANT_ID,
+  clientId: process.env.TEAMSFX_API_{{capitalName}}_CLIENT_ID,
+  // This references the client secret that you must add in the file `.env.teamsfx.local`.
+  clientSecret: process.env.TEAMSFX_API_{{capitalName}}_CLIENT_SECRET,
+});
+{{/if}}
+// Initialize a new axios instance to call {{config.APIName}}
+const appCredential = teamsFx.getCredential();
+const authProvider = new teamsfxSdk.BearerTokenAuthProvider(
+  // TODO: Replace '<your-api-scope>' with your required API scope
+  async () => (await appCredential.getToken("<your-api-scope>")).token
+);
+const {{config.APIName}}Client = teamsfxSdk.createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+module.exports.{{config.APIName}}Client = {{config.APIName}}Client;

package/templates/plugins/resource/apiconnector/sample/js/apikey.template

@@ -0,0 +1,19 @@
+const teamsfxSdk = require("@microsoft/teamsfx");
+
+// Load application configuration
+const teamsFx = new teamsfxSdk.TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new teamsfxSdk.ApiKeyProvider(
+  "{{config.AuthConfig.Name}}",
+  process.env.TEAMSFX_API_{{capitalName}}_API_KEY,
+{{#if (equals config.AuthConfig.Location "request header")}}
+  teamsfxSdk.ApiKeyLocation.Header
+{{else}}
+  teamsfxSdk.ApiKeyLocation.QueryParams
+{{/if}}
+);
+const {{config.APIName}}Client = teamsfxSdk.createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+module.exports.{{config.APIName}}Client = {{config.APIName}}Client;

package/templates/plugins/resource/apiconnector/sample/js/basic.template

@@ -0,0 +1,14 @@
+const teamsfxSdk = require("@microsoft/teamsfx");
+
+// Load application configuration
+const teamsFx = new teamsfxSdk.TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new teamsfxSdk.BasicAuthProvider(
+  process.env.TEAMSFX_API_{{capitalName}}_USERNAME,
+  process.env.TEAMSFX_API_{{capitalName}}_PASSWORD
+);
+const {{config.APIName}}Client = teamsfxSdk.createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+module.exports.{{config.APIName}}Client = {{config.APIName}}Client;

package/templates/plugins/resource/apiconnector/sample/js/cert.template

@@ -0,0 +1,17 @@
+const teamsfxSdk = require("@microsoft/teamsfx");
+
+// Load application configuration
+const teamsFx = new teamsfxSdk.TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new teamsfxSdk.CertificateAuthProvider(
+  // TODO: 
+  // 1. Add code to read your certificate and private key.
+  // 2. Replace "<your-cert>" and "<your-private-key>" with your actual certificate and private key values
+  // If you have a .pfx certificate, you can use the `createPfxCertOption` function to initialize your certificate
+  teamsfxSdk.createPemCertOption("<your-cert>", "<your-private-key>")
+);
+const {{config.APIName}}Client = teamsfxSdk.createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+module.exports.{{config.APIName}}Client = {{config.APIName}}Client;

package/templates/plugins/resource/apiconnector/sample/js/custom.template

@@ -0,0 +1,39 @@
+const teamsfxSdk = require("@microsoft/teamsfx");
+
+// A custom authProvider implements the `AuthProvider` interface.
+// This sample authProvider implementation will set a custom property in the request header
+class CustomAuthProvider {
+  customProperty;
+  customValue;
+
+  constructor(customProperty, customValue) {
+    this.customProperty = customProperty;
+    this.customValue = customValue;
+  }
+
+  // Replace the sample code with your own logic.
+  AddAuthenticationInfo = async (config) => {
+    if (!config.headers) {
+      config.headers = {};
+    }
+    config.headers[this.customProperty] = this.customValue;
+    return config;
+  };
+}
+
+// Load application configuration
+const teamsFx = new teamsfxSdk.TeamsFx();
+
+const authProvider = new CustomAuthProvider(
+  // You can also add configuration to the file `.env.teamsfx.local` and use `process.env.{setting_name}` to read the configuration. For example:
+  //  process.env.TEAMSFX_API_{{capitalName}}_CUSTOM_PROPERTY,
+  //  process.env.TEAMSFX_API_{{capitalName}}_CUSTOM_VALUE
+  "customPropery",
+  "customValue"
+);
+// Initialize a new axios instance to call {{config.APIName}}
+const {{config.APIName}}Client = teamsfxSdk.createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+module.exports.{{config.APIName}}Client = {{config.APIName}}Client;

package/templates/plugins/resource/apiconnector/sample/ts/aad.template

@@ -0,0 +1,36 @@
+import {
+  TeamsFx,
+  createApiClient,
+  BearerTokenAuthProvider,
+  IdentityType,
+} from "@microsoft/teamsfx";
+
+// Load application configuration. This sample uses the client credential flow to acquire a token for your API.
+{{#if (equals config.AuthConfig.ReuseTeamsApp true)}}
+const teamsFx = new TeamsFx(IdentityType.App, {
+  authorityHost: process.env.M365_AUTHORITY_HOST!,
+  tenantId: process.env.M365_TENANT_ID!,
+  clientId: process.env.M365_CLIENT_ID!,
+  clientSecret: process.env.M365_CLIENT_SECRET!,
+});
+{{else}}
+const teamsFx = new TeamsFx(IdentityType.App, {
+  // You can replace the default authorityHost URL
+  authorityHost: "https://login.microsoftonline.com",
+  tenantId: process.env.TEAMSFX_API_{{capitalName}}_TENANT_ID!,
+  clientId: process.env.TEAMSFX_API_{{capitalName}}_CLIENT_ID!,
+  // This references the client secret that you must add in the file `.env.teamsfx.local`.
+  clientSecret: process.env.TEAMSFX_API_{{capitalName}}_CLIENT_SECRET!,
+});
+{{/if}}
+// Initialize a new axios instance to call {{config.APIName}}
+const appCredential = teamsFx.getCredential();
+const authProvider = new BearerTokenAuthProvider(
+  // TODO: Replace '<your-api-scope>' with your required API scope
+  async () => (await appCredential.getToken("<your-api-scope>"))!.token
+);
+const {{config.APIName}}Client = createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+export { {{config.APIName}}Client };

package/templates/plugins/resource/apiconnector/sample/ts/apikey.template

@@ -0,0 +1,16 @@
+import { TeamsFx, createApiClient, ApiKeyProvider, ApiKeyLocation } from "@microsoft/teamsfx";
+
+// Load application configuration
+const teamsFx = new TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new ApiKeyProvider(
+  "{{config.AuthConfig.Name}}",
+  process.env.TEAMSFX_API_{{capitalName}}_API_KEY,
+{{#if (equals config.AuthConfig.Location "request header")}}
+  ApiKeyLocation.Header
+{{else}}
+  ApiKeyLocation.QueryParams
+{{/if}}
+);
+const {{config.APIName}}Client = createApiClient(process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT, authProvider);
+export { {{config.APIName}}Client };

package/templates/plugins/resource/apiconnector/sample/ts/basic.template

@@ -0,0 +1,14 @@
+import { TeamsFx, createApiClient, BasicAuthProvider } from "@microsoft/teamsfx";
+
+// Load application configuration
+const teamsFx = new TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new BasicAuthProvider(
+  process.env.TEAMSFX_API_{{capitalName}}_USERNAME,
+  process.env.TEAMSFX_API_{{capitalName}}_PASSWORD
+);
+const {{config.APIName}}Client = createApiClient(
+  process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT,
+  authProvider
+);
+export { {{config.APIName}}Client };

package/templates/plugins/resource/apiconnector/sample/ts/cert.template

@@ -0,0 +1,19 @@
+import {
+  TeamsFx,
+  createApiClient,
+  CertificateAuthProvider,
+  createPemCertOption,
+} from "@microsoft/teamsfx";
+
+// Load application configuration
+const teamsFx = new TeamsFx();
+// Initialize a new axios instance to call {{config.APIName}}
+const authProvider = new CertificateAuthProvider(
+  // TODO: 
+  // 1. Add code to read your certificate and private key.
+  // 2. Replace "<your-cert>" and "<your-private-key>" with your actual certificate and private key values
+  // If you have a .pfx certificate, you can use the `createPfxCertOption` function to initialize your certificate
+  createPemCertOption("<your-cert>", "<your-private-key>")
+);
+const {{config.APIName}}Client = createApiClient(process.env.TEAMSFX_API_{{capitalName}}_ENDPOINT, authProvider);
+export { {{config.APIName}}Client };