Wednesday, 22 February 2017

Botframework: Building a proactive Bot

In this post I'll walk you through a quick demo I prepare for MS ignite Australia 2017. Although it was the last demo and I didn't have the chance to actually make it work in front of a lot of live audience. I decided -what the hell- I'm going back home and I'll record this sh*t and I'll put it out there.

First thing you need to know, is to make the bot start a conversation or send a message proactively, you need to save the conversation address object which consist of the following:
  • Bot Object
    • Bot ID
    • Bot Name
  • User Object
    • User ID (base64 encoded value not email)
  • Service URL ( points to local host when running the bot using the emulator)

from the above it's hard to reconstruct the address object, so I start looking at a way of saving this address. There is couple of events triggered:
  1. conversationUpdate: When a user or bot start exchanging messages
  2. contactRelationUpdate: When a user add bot to his/her contact list

I see the second event is more convenient to tab into and to store the user address somewhere. 
Once you stored the user address you can either create a new conversation or send a new message within an existing conversation. This message can be triggered by any external event and can be published as another end-point of the bot service itself.
Note: you can easily construct the address if you are working with the botframework emulator

And this is how it looks like

Tuesday, 7 February 2017

SharePoint Framework: Multiple webpart instances within the same page Angular2


In August 2016, I've added a quick guide to how to build an angular2 webpart using the awesome new -back then- SharePoint framework
http://www.sharepointtweaks.com/2016/08/sharepoint-framework-angular2-sample.html
also it was basically to demonstrate what can be done in a context of a github issue https://github.com/SharePoint/sp-dev-docs/issues/7.

As Andrew Connell pointed out it's rather an angular limitation , which if we search for any work around , we can easily find that there is a workaround shared by Christoph Krautz here https://github.com/angular/angular/issues/7136


Sounds easy right. However, trying out this workaround in the SPFx world isn't that straight forward. You will get an error as the first dependency of your AppModule  is not recognized by CompileMetadataResolver


My first thought was, how can I get the componentFactoryResolver without even passing it. I've used the _componentFactoryReolver member of the ApplicationRef object

Now I can create the Factory and update the selector to match the webpart ID.
My second problem is how to distinguish different webparts if I passed the selector to the module constructor it will have the same value for all the webparts on the page. which leads also to only single bootstrapped webpart.
I've added an id to the main component to use it in addition to the tagName as selector and used the description field to represent the id value
However, that didn't solve the problem as the value injected to the AppModule constructor was the same.

What to do next?? I ran out of ideas, not really I came up with a stupid one but it works  instead of the selector I've passed the Document object and in the consturctor I'll search all the elements that matches the webpart main component selector and voila!
it works !



DISCLAIMER :  this is a hack for experiment purpose only I'm no Angular2 expert I'm actually learning how to use this thing at the moment of writing these words.

the code can be found https://github.com/ministainer/Angular2MultipleSampleSPFx