How can I split Bot Framework Dialogs in different files

Question

I am trying to make my bot code a bit more manageable and put some dialogs which belong together in different files.

There is an old, similar question here for javascript.

But I am struggling to do the same with Typescript. Probably this is more a general Typescript question as I am a beginner and still am a bit confused about the different import possibilities, but I didn't find any general solution which I was able to apply to this.

What I tried is this:

//testdialog.ts

export default (bot) => {
bot.dialog("/Test", [
    (session, args, next) => {
        console.log("test".green);
        session.send(`Test Dialog triggered`);
    },
]).triggerAction({ matches: "test" });
}

and then in app.ts import it similar to this:
import testdialog = require("./testdialog")(bot);

But seems like this seems completely wrong compared to an unnamed import with bot as a parameter in JS like this require('./cars.js')(bot);

Answer 1

In my opinion, you can leverage builder.Library() to achieve your requirement.

//testdialog.ts
import * as builder from 'botbuilder';

export const createLibrary = () => {
    let lib = new builder.Library('test');
    lib.dialog('test', (session) => {
        session.send('this is test dialog');
    }).triggerAction({
        matches: /test/
    });
    return lib.clone();
}

//app.ts
import * as restify from 'restify';
import * as builder from 'botbuilder';
import * as testDialog from './testdialog';

let server = restify.createServer({});
server.listen(3978, function () {
    console.log('%s listening to %s', server.name, server.url);
})

let connector = new builder.ChatConnector({});

server.post('/api/messages', connector.listen());
let bot = new builder.UniversalBot(connector);

bot.dialog('/', (session) => {
    session.send('welcome');
})

bot.library(testDialog.createLibrary())