Bug Fix: WP not opening direct line channel at initial load (#133)

* Bug Fix: WP not opening direct line channel at initial load

* Package Version / Readme Updates

* Readme fix

samples/react-bot-framework/README.md

@@ -40,12 +40,15 @@ under the [vs2015-bot-application](./vs2015-bot-application) folder. This is sim
 Solution|Author(s)
 --------|---------
 bot-framework | Gary Pretty ([@garypretty](http://www.twitter.com/garypretty), [garypretty.co.uk](www.garypretty.co.uk))
+RC0 Update / BugFixing | Raul Garita ([Raul.Garita@buildingi.com](mailto:raul.garita@buildingi.com), [Buildingi](http://www.buildingi.com))
 
 ## Version history
 
 Version|Date|Comments
 -------|----|--------
 1.0|October 11th, 2016|Initial release
+1.1|Jan 24th, 2017|Updated to RC0
+1.2|Feb 23rd, 2017|Initial load bug fix
 
 ## Disclaimer
 **THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**

samples/react-bot-framework/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sp-bot-chat-webpart",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "private": true,
   "engines": {
     "node": ">=0.10.0"

samples/react-bot-framework/src/webparts/botFrameworkChat/components/BotFrameworkChat.tsx

@@ -38,38 +38,13 @@ export default class BotFrameworkChat extends React.Component<IBotFrameworkChatP
     );
   }
 
+  public componentDidMount(){
+    this.bindDirectLineSecret();
+  }
+
   public componentDidUpdate(prevProps: IBotFrameworkChatWebPartProps, prevState: {}, prevContext: any): void {
     if (this.props.directLineSecret !== prevProps.directLineSecret) {
-      if (this.props.directLineSecret) {
+      this.bindDirectLineSecret();
-        var Swagger = require('swagger-client');
-        var directLineSpec = require('./directline-swagger.json');
-
-        this.directLineClientSwagger = new Swagger(
-          {
-            spec: directLineSpec,
-            usePromise: true,
-          }).then((client) => {
-            client.clientAuthorizations.add('AuthorizationBotConnector', new Swagger.ApiKeyAuthorization('Authorization', 'BotConnector ' + this.props.directLineSecret, 'header'));
-            console.log('DirectLine client generated');
-            return client;
-          }).catch((err) =>
-            console.error('Error initializing DirectLine client', err));
-
-        this.directLineClientSwagger.then((client) => {
-          client.Conversations.Conversations_NewConversation()
-            .then((response) => response.obj.conversationId)
-            .then((conversationId) => {
-
-              this.conversationId = conversationId;
-              this.pollMessages(client, conversationId);
-              this.directLineClient = client;
-            });
-        });
-
-        this.sendAsUserName = this.props.context.pageContext.user.loginName;
-
-        this.printMessage = this.printMessage.bind(this);
-      }
     }
   }
 
@@ -111,6 +86,39 @@ export default class BotFrameworkChat extends React.Component<IBotFrameworkChatP
     }
   }
 
+  protected bindDirectLineSecret(){
+    if (this.props.directLineSecret) {
+      var Swagger = require('swagger-client');
+      var directLineSpec = require('./directline-swagger.json');
+
+      this.directLineClientSwagger = new Swagger(
+        {
+          spec: directLineSpec,
+          usePromise: true,
+        }).then((client) => {
+          client.clientAuthorizations.add('AuthorizationBotConnector', new Swagger.ApiKeyAuthorization('Authorization', 'BotConnector ' + this.props.directLineSecret, 'header'));
+          console.log('DirectLine client generated');
+          return client;
+        }).catch((err) =>
+          console.error('Error initializing DirectLine client', err));
+
+      this.directLineClientSwagger.then((client) => {
+        client.Conversations.Conversations_NewConversation()
+          .then((response) => response.obj.conversationId)
+          .then((conversationId) => {
+
+            this.conversationId = conversationId;
+            this.pollMessages(client, conversationId);
+            this.directLineClient = client;
+          });
+      });
+
+      this.sendAsUserName = this.props.context.pageContext.user.loginName;
+
+      this.printMessage = this.printMessage.bind(this);
+    }
+  }
+
   protected pollMessages(client, conversationId) {
     console.log('Starting polling message for conversationId: ' + conversationId);
     var watermark = null;