fix(kb.gbapp): #332 fix STS.

packages/core.gbapp/services/GBMinService.ts

@@ -619,7 +619,7 @@ export class GBMinService {
    * Gets a Speech to Text / Text to Speech token from the provider.
    */
   private async getSTSToken(instance: any) {
-    return null; // TODO: https://github.com/GeneralBots/BotServer/issues/332
+    
     const options = {
       method: 'POST',
       headers: {
@@ -628,7 +628,9 @@ export class GBMinService {
     };
 
     try {
-      return await fetch(instance.speechEndpoint, options);
+
+      const res = await fetch(instance.speechEndpoint, options)
+      return res.text();
     } catch (error) {
       const msg = `Error calling Speech to Text client. Error is: ${error}.`;
 

packages/default.gbui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "default.gbui",
-  "version": "1.0.0",
+  "version": "3.0.0",
   "private": false,
   "repository": "https://github.com/GeneralBots/BotServer",
   "description": "Default web interface for General Bots open-core",

packages/default.gbui/src/GBUIApp.js

@@ -40,11 +40,11 @@ import GBBulletPlayer from './players/GBBulletPlayer.js';
 import SidebarMenu from './components/SidebarMenu.js';
 import SEO from './components/SEO.js';
 import GBCss from './components/GBCss.js';
-import { DirectLine } from 'botframework-directlinejs';
+import { DirectLine, createCognitiveServicesSpeechServicesPonyfillFactory } from 'botframework-directlinejs';
 import { ConnectionStatus } from 'botframework-directlinejs';
 import ReactWebChat from 'botframework-webchat';
 import { UserAgentApplication } from 'msal';
-import StaticContent from '@midudev/react-static-content'
+import StaticContent from '@midudev/react-static-content';
 
 class GBUIApp extends React.Component {
   constructor() {
@@ -77,9 +77,7 @@ class GBUIApp extends React.Component {
   }
 
   send(command) {
-    
+    window.line.postActivity({
-      window.line
-        .postActivity({
       type: 'event',
       name: command,
       locale: 'en-us',
@@ -87,11 +85,9 @@ class GBUIApp extends React.Component {
       timestamp: new Date().toISOString(),
       from: this.getUser()
     });
-    
   }
 
   getUser() {
-
     return { id: 'web@gb', name: 'You' };
   }
 
@@ -129,7 +125,6 @@ class GBUIApp extends React.Component {
   }
 
   authenticate() {
-
     if (this.state.instanceClient.authenticatorClientId === null) {
       return;
     }
@@ -150,8 +145,12 @@ class GBUIApp extends React.Component {
     );
     window.userAgentApplication = userAgentApplication;
 
-    if (!userAgentApplication.isCallback(window.location.hash) && window.parent === window
+    if (
-      && !window.opener && userAgentApplication.getUser) {
+      !userAgentApplication.isCallback(window.location.hash) &&
+      window.parent === window &&
+      !window.opener &&
+      userAgentApplication.getUser
+    ) {
       var user = userAgentApplication.getUser();
       if (user) {
         userAgentApplication.acquireTokenSilent(graphScopes).then(
@@ -177,6 +176,7 @@ class GBUIApp extends React.Component {
 
     line.connectionStatus$.subscribe(connectionStatus => {
       if (connectionStatus === ConnectionStatus.Online) {
+        line.setUserId = null;
         _this_.setState({ instanceClient: instanceClient });
         window['botConnection'] = line;
       }
@@ -211,6 +211,7 @@ class GBUIApp extends React.Component {
     this.configureChat();
   }
 
+  webSpeechPonyfillFactory = 0;
   render() {
     let playerComponent = '';
 
@@ -302,32 +303,24 @@ class GBUIApp extends React.Component {
       </div>
     );
 
+    async function fetchCredentials() {
+      const res = await fetch('/api/authorizationtoken');
 
-    if (this.state.line) {
+      if (res.ok) {
-
+        return {
-      if (this.state.instanceClient) {
+          authorizationToken: await res.text(),
-
+          region: 'westus2'
-        gbCss = <GBCss instance={this.state.instanceClient} />;
+        };
-        seo = <SEO instance={this.state.instanceClient} />;
+      } else {
+        throw new Error('Failed to retrieve authorization token for Cognitive Services.');
+      }
     }
 
-      // let speechOptions;
+    if (this.state.line) {
-      // let token = this.state.instanceClient.speechToken;
+      if (this.state.instanceClient) {
-
+        gbCss = <GBCss instance={this.state.instanceClient} />;
-      // speechOptions = {
+        seo = <SEO instance={this.state.instanceClient} />;
-      //     speechRecognizer: new SpeechRecognizer({
+        const token = this.state.instanceClient.speechToken;
-      //         locale: "pt-br",
-      //         fetchCallback: (authFetchEventId) => getToken(),
-      //         fetchOnExpiryCallback: (authFetchEventId) => getToken()
-      //     }),
-      //     speechSynthesizer: new SpeechSynthesizer({
-      //         fetchCallback: (authFetchEventId) => getToken(),
-      //         fetchOnExpiryCallback: (authFetchEventId) => getToken(),
-      //         gender: SynthesisGender.Male,
-      //         voiceName: 'Microsoft Server Speech Text to Speech Voice (pt-BR, Daniel, Apollo)'
-      //     })
-      // };
-
         chat = (
           <ReactWebChat
             ref={chat => {
@@ -335,11 +328,13 @@ class GBUIApp extends React.Component {
             }}
             locale={'pt-br'}
             directLine={this.state.line}
-          user={this.getUser()}
+            webSpeechPonyfillFactory={window.WebChat.createCognitiveServicesSpeechServicesPonyfillFactory({
-          bot={{ id: 'bot@gb', name: 'Bot' }}
+              credentials: { authorizationToken: token, region: 'westus' }
+            })}
           />
         );
       }
+    }
 
     if (!this.state.instanceClient) {
       sideBar = '';
@@ -352,9 +347,7 @@ class GBUIApp extends React.Component {
           {gbCss}
           {sideBar}
           <div className="player">{playerComponent}</div>
-          <div className="webchat">
+          <div className="webchat">{chat}</div>
-            {chat}
-          </div>
         </div>
       </StaticContent>
     );