Fix TS issues in JS samples

samples/javascript_nodejs/02.echo-bot/bot.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler, MessageFactory } = require('botbuilder');
 
 class EchoBot extends ActivityHandler {
@@ -15,7 +17,7 @@ class EchoBot extends ActivityHandler {
         });
 
         this.onMembersAdded(async (context, next) => {
-            const membersAdded = context.activity.membersAdded;
+            const membersAdded = context.activity.membersAdded ?? [];
             const welcomeText = 'Hello and welcome!';
             for (let cnt = 0; cnt < membersAdded.length; ++cnt) {
                 if (membersAdded[cnt].id !== context.activity.recipient.id) {

samples/javascript_nodejs/02.echo-bot/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const path = require('path');
 
 const dotenv = require('dotenv');

samples/javascript_nodejs/03.welcome-users/bots/welcomeBot.js

@@ -1,16 +1,20 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 // Import required Bot Framework classes.
 const { ActionTypes, ActivityHandler, CardFactory } = require('botbuilder');
 
+/** @import { UserState } from 'botbuilder' */
+
 // Welcomed User property name
 const WELCOMED_USER = 'welcomedUserProperty';
 
 class WelcomeBot extends ActivityHandler {
     /**
      *
-     * @param {UserState} User state to persist boolean flag to indicate
+     * @param {UserState} userState to persist boolean flag to indicate
      *                    if the bot had already welcomed the user
      */
     constructor(userState) {

samples/javascript_nodejs/03.welcome-users/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 // Import required packages
 const path = require('path');
 

samples/javascript_nodejs/05.multi-turn-prompt/bots/dialogBot.js

@@ -1,14 +1,19 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler } = require('botbuilder');
 
+/** @import { ConversationState, UserState } from 'botbuilder' */
+/** @import { UserProfileDialog } from '../dialogs/userProfileDialog' */
+
 class DialogBot extends ActivityHandler {
     /**
      *
      * @param {ConversationState} conversationState
      * @param {UserState} userState
-     * @param {Dialog} dialog
+     * @param {UserProfileDialog} dialog
      */
     constructor(conversationState, userState, dialog) {
         super();

samples/javascript_nodejs/05.multi-turn-prompt/dialogs/userProfileDialog.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { MessageFactory } = require('botbuilder');
 const {
     AttachmentPrompt,
@@ -112,7 +114,7 @@ class UserProfileDialog extends ComponentDialog {
         // We can send messages to the user at any point in the WaterfallStep.
         await step.context.sendActivity(msg);
 
-        if (step.context.activity.channelId === Channels.msteams) {
+        if (step.context.activity.channelId === Channels.Msteams) {
             // This attachment prompt example is not designed to work for Teams attachments, so skip it in this case
             await step.context.sendActivity('Skipping attachment prompt in Teams channel...');
             return await step.next(undefined);

samples/javascript_nodejs/05.multi-turn-prompt/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const restify = require('restify');
 const path = require('path');
 

samples/javascript_nodejs/05.multi-turn-prompt/userProfile.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 class UserProfile {
     constructor(transport, name, age, picture) {
         this.transport = transport;

samples/javascript_nodejs/06.using-cards/bots/dialogBot.js

@@ -1,8 +1,13 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler } = require('botbuilder');
 
+/** @import { ConversationState, UserState } from 'botbuilder' */
+/** @import { MainDialog } from '../dialogs/mainDialog' */
+
 /**
  * This IBot implementation can run any type of Dialog. The use of type parameterization is to allows multiple different bots
  * to be run at different endpoints within the same project. This can be achieved by defining distinct Controller types
@@ -15,7 +20,7 @@ class DialogBot extends ActivityHandler {
      *
      * @param {ConversationState} conversationState
      * @param {UserState} userState
-     * @param {Dialog} dialog
+     * @param {MainDialog} dialog
      */
     constructor(conversationState, userState, dialog) {
         super();

samples/javascript_nodejs/06.using-cards/bots/richCardsBot.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { MessageFactory } = require('botbuilder');
 const { DialogBot } = require('./dialogBot');
 
@@ -13,7 +15,7 @@ class RichCardsBot extends DialogBot {
         super(conversationState, userState, dialog);
 
         this.onMembersAdded(async (context, next) => {
-            const membersAdded = context.activity.membersAdded;
+            const membersAdded = context.activity.membersAdded ?? [];
             for (let cnt = 0; cnt < membersAdded.length; cnt++) {
                 if (membersAdded[cnt].id !== context.activity.recipient.id) {
                     const reply = MessageFactory.text('Welcome to CardBot. ' +

samples/javascript_nodejs/06.using-cards/dialogs/mainDialog.js

@@ -1,12 +1,16 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { AttachmentLayoutTypes, CardFactory } = require('botbuilder');
 const { ChoicePrompt, ComponentDialog, DialogSet, DialogTurnStatus, WaterfallDialog } = require('botbuilder-dialogs');
 const AdaptiveCard = require('../resources/adaptiveCard.json');
 
 const MAIN_WATERFALL_DIALOG = 'mainWaterfallDialog';
 
+/** @import { WaterfallStepContext } from 'botbuilder-dialogs' */
+
 class MainDialog extends ComponentDialog {
     constructor() {
         super('MainDialog');
@@ -206,6 +210,7 @@ class MainDialog extends ComponentDialog {
             {
                 subtitle: 'Star Wars: Episode V - The Empire Strikes Back',
                 text: 'The Empire Strikes Back (also known as Star Wars: Episode V – The Empire Strikes Back) is a 1980 American epic space opera film directed by Irvin Kershner. Leigh Brackett and Lawrence Kasdan wrote the screenplay, with George Lucas writing the film\'s story and serving as executive producer. The second installment in the original Star Wars trilogy, it was produced by Gary Kurtz for Lucasfilm Ltd. and stars Mark Hamill, Harrison Ford, Carrie Fisher, Billy Dee Williams, Anthony Daniels, David Prowse, Kenny Baker, Peter Mayhew and Frank Oz.',
+                // @ts-ignore
                 image: 'https://upload.wikimedia.org/wikipedia/en/3/3c/SW_-_Empire_Strikes_Back.jpg'
             }
         );
@@ -250,12 +255,14 @@ class MainDialog extends ComponentDialog {
                 {
                     title: 'Data Transfer',
                     price: '$38.45',
+                    // @ts-ignore
                     quantity: 368,
                     image: { url: 'https://github.com/amido/azure-vector-icons/raw/master/renders/traffic-manager.png' }
                 },
                 {
                     title: 'App Service',
                     price: '$45.00',
+                    // @ts-ignore
                     quantity: 720,
                     image: { url: 'https://github.com/amido/azure-vector-icons/raw/master/renders/cloud-service.png' }
                 }

samples/javascript_nodejs/06.using-cards/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 // index.js is used to setup and configure your bot
 
 // Import required packages

samples/javascript_nodejs/07.using-adaptive-cards/bots/adaptiveCardsBot.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler, CardFactory } = require('botbuilder');
 
 // Import AdaptiveCard content.
@@ -25,7 +27,7 @@ class AdaptiveCardsBot extends ActivityHandler {
     constructor() {
         super();
         this.onMembersAdded(async (context, next) => {
-            const membersAdded = context.activity.membersAdded;
+            const membersAdded = context.activity.membersAdded ?? [];
             for (let cnt = 0; cnt < membersAdded.length; cnt++) {
                 if (membersAdded[cnt].id !== context.activity.recipient.id) {
                     await context.sendActivity(`Welcome to Adaptive Cards Bot  ${ membersAdded[cnt].name }. ${ WELCOME_TEXT }`);

samples/javascript_nodejs/07.using-adaptive-cards/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const path = require('path');
 
 // Read botFilePath and botFileSecret from .env file.

samples/javascript_nodejs/08.suggested-actions/bots/suggestedActionsBot.js

@@ -1,9 +1,13 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler, MessageFactory } = require('botbuilder');
 const { ActionTypes } = require('botframework-schema');
 
+/** @import { TurnContext } from 'botbuilder' */
+
 class SuggestedActionsBot extends ActivityHandler {
     constructor() {
         super();
@@ -65,21 +69,21 @@ class SuggestedActionsBot extends ActivityHandler {
                 type: ActionTypes.PostBack,
                 title: 'Red',
                 value: 'Red',
-                image: 'https://via.placeholder.com/20/FF0000?text=R',
+                image: 'https://placehold.co/20/red/red?text=R',
                 imageAltText: 'R'
             },
             {
                 type: ActionTypes.PostBack,
                 title: 'Yellow',
                 value: 'Yellow',
-                image: 'https://via.placeholder.com/20/FFFF00?text=Y',
+                image: 'https://placehold.co/20/yellow/yellow?text=Y',
                 imageAltText: 'Y'
             },
             {
                 type: ActionTypes.PostBack,
                 title: 'Blue',
                 value: 'Blue',
-                image: 'https://via.placeholder.com/20/0000FF?text=B',
+                image: 'https://placehold.co/20/blue/blue?text=B',
                 imageAltText: 'B'
             }
         ];

samples/javascript_nodejs/08.suggested-actions/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const path = require('path');
 
 // Read botFilePath and botFileSecret from .env file.

samples/javascript_nodejs/12.customQABot/bots/CustomQABot.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler, ActivityTypes } = require('botbuilder');
 const { CustomQuestionAnswering } = require('botbuilder-ai');
 
@@ -10,21 +12,22 @@ class CustomQABot extends ActivityHandler {
 
         try {
             this.qnaMaker = new CustomQuestionAnswering({
-                knowledgeBaseId: process.env.ProjectName,
-                endpointKey: process.env.LanguageEndpointKey,
-                host: process.env.LanguageEndpointHostName
+                knowledgeBaseId: process.env.ProjectName ?? '',
+                endpointKey: process.env.LanguageEndpointKey ?? '',
+                host: process.env.LanguageEndpointHostName ?? ''
             });
         } catch (err) {
             console.warn(`QnAMaker Exception: ${ err } Check your QnAMaker configuration in .env`);
         }
 
         // If a new user is added to the conversation, send them a greeting message
         this.onMembersAdded(async (context, next) => {
-            const membersAdded = context.activity.membersAdded;
+            const membersAdded = context.activity.membersAdded ?? [];
             for (let cnt = 0; cnt < membersAdded.length; cnt++) {
                 if (membersAdded[cnt].id !== context.activity.recipient.id) {
                     const DefaultWelcomeMessageFromConfig = process.env.DefaultWelcomeMessage;
-                    await context.sendActivity(DefaultWelcomeMessageFromConfig?.length > 0 ? DefaultWelcomeMessageFromConfig : 'Hello and Welcome');
+                    const welcomeMessage = DefaultWelcomeMessageFromConfig && DefaultWelcomeMessageFromConfig.length > 0 ? DefaultWelcomeMessageFromConfig : 'Hello and Welcome';
+                    await context.sendActivity(welcomeMessage);
                 }
             }
 
@@ -45,10 +48,10 @@ class CustomQABot extends ActivityHandler {
 
                 const enablePreciseAnswer = process.env.EnablePreciseAnswer === 'true';
                 const displayPreciseAnswerOnly = process.env.DisplayPreciseAnswerOnly === 'true';
-                const response = await this.qnaMaker.getAnswers(context, { enablePreciseAnswer: enablePreciseAnswer });
+                const response = await this.qnaMaker?.getAnswers(context, { enablePreciseAnswer: enablePreciseAnswer });
 
                 // If an answer was received from CQA, send the answer back to the user.
-                if (response.length > 0) {
+                if (response && response.length > 0) {
                     var activities = [];
 
                     var answerText = response[0].answer;

samples/javascript_nodejs/12.customQABot/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 // index.js is used to setup and configure your bot
 
 // Import required packages

samples/javascript_nodejs/15.handling-attachments/bots/attachmentsBot.js

@@ -1,17 +1,19 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const { ActivityHandler, ActionTypes, ActivityTypes, CardFactory } = require('botbuilder');
 const path = require('path');
-const axios = require('axios');
+const axios = require('axios').default;
 const fs = require('fs');
 
 class AttachmentsBot extends ActivityHandler {
     constructor() {
         super();
 
         this.onMembersAdded(async (context, next) => {
-            const membersAdded = context.activity.membersAdded;
+            const membersAdded = context.activity.membersAdded ?? [];
             for (let cnt = 0; cnt < membersAdded.length; cnt++) {
                 if (membersAdded[cnt].id !== context.activity.recipient.id) {
                     // If the Activity is a ConversationUpdate, send a greeting message to the user.
@@ -82,7 +84,6 @@ class AttachmentsBot extends ActivityHandler {
         // Use content.downloadURL if available as that contains needed auth token for working with ms teams
         const url = attachment.content?.downloadUrl || attachment.contentUrl;
 
-
         // Local file path for the bot to save the attachment.
         const localFileName = path.join(__dirname, attachment.name);
 

samples/javascript_nodejs/15.handling-attachments/index.js

@@ -1,6 +1,8 @@
 // Copyright (c) Microsoft Corporation. All rights reserved.
 // Licensed under the MIT License.
 
+// @ts-check
+
 const path = require('path');
 
 // Read botFilePath and botFileSecret from .env file.