misc: upgrade agent sdk (#99)

gulpfile.js

@@ -21,6 +21,10 @@ const evAgentConfig = {
   isSecureSocket: true,
   allowMultiSocket: true,
   authHost: process.env.ENGAGE_VOICE_AUTH_SERVER,
+  clientAppType: "RCX_Embeddable",
+  clientAppVersion: "0.2.0",
+  componentName: "EAG",
+  isI18nEnabled: false,
 };
 
 const authConfig = {
@@ -131,7 +135,8 @@ export async function devServer() {
       publicPath: '/',
     },
     port,
-    hot: true,
+    hot: false,
+    webSocketServer: false,
   }, compiler);
   await server.start();
   console.log(`Brand: ${brand}: server listening to ${port}...`);

package.json

@@ -99,6 +99,10 @@
     "react-router-redux": "^4.0.7",
     "redux": "^4.0.4",
     "ringcentral-client": "^1.0.0-beta.2",
+    "sip.js": "0.13.5",
     "styled-components": "^5.3.3"
+  },
+  "resolutions": {
+    "sip.js": "0.13.5"
   }
 }

src/app.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { createStore } from 'redux';
-
+import './lib/patch';
 import './lib/BroadcastChannel.polyfill';
 
 import { createPhone } from './modules/Phone';
@@ -40,7 +40,9 @@ if (rcServer) {
 }
 if (evServer) {
   evSdkConfig.authHost = evServer;
+  window.evAuthHost = evServer;
 }
+
 // @ts-ignore
 const phone = createPhone({
   sdkConfig,

src/lib/getWebpackConfig.js

@@ -23,7 +23,7 @@ function getWebpackConfig({
   const base = getBaseWebpackConfig({
     mode: environment,
     themeFolder: brandFolder,
-    babelLoaderExcludes: /node_modules|engage-voice-agent/
+    babelLoaderExcludes: /node_modules|vendor/
   });
   const scssLoader = base.module.rules.find((rule) => rule.test.test('x.scss'));
   // TODO: fix scss syntax error in widgets
@@ -34,6 +34,16 @@ function getWebpackConfig({
       replace: 'and (max-width',
     },
   });
+  base.module.rules.push({
+    test: /agentLibrary\.js$/,
+    use: {
+      loader: 'string-replace-loader',
+      options: {
+        search: 'window.location.origin',
+        replace: 'window.evAuthHost',
+      },
+    }
+  });
   return {
     ...base,
     entry: {

src/lib/patch.ts

@@ -0,0 +1,2 @@
+// @ts-ignore
+window.evAuthHost = process.env.AGENT_CONFIG.authHost; // For hack EV SDK

src/modules/EvClient/index.ts

@@ -1,11 +1,24 @@
 import { EvClient as EvClientBase } from '@ringcentral-integration/engage-voice-widgets/lib/EvClient';
-import { EvCallbackTypes } from '@ringcentral-integration/engage-voice-widgets/lib/EvClient/enums/callbackTypes';
+import { EvCallbackTypes, evStatus } from '@ringcentral-integration/engage-voice-widgets/lib/EvClient/enums';
 import { Module } from '@ringcentral-integration/commons/lib/di';
 
+import type {
+  EvACKResponse,
+  EvAuthenticateAgentWithRcAccessTokenRes,
+  EvTokenType,
+  RawEvAuthenticateAgentWithRcAccessTokenRes,
+} from '@ringcentral-integration/engage-voice-widgets/lib/EvClient/interfaces';
+
+const AGENT_TYPES = {
+  AGENT: 'agent',
+  SUPERVISOR: 'supervisor',
+};
+
 @Module({
   name: 'EvClient',
   deps: [
     { dep: 'Environment' },
+    { dep: 'Locale' },
     { dep: 'EvClientOptions', optional: true }
   ],
 })
@@ -51,4 +64,39 @@ export class EvClient extends EvClientBase {
       dialDest,
     });
   }
+
+  authenticateAgent(rcAccessToken: string, tokenType: EvTokenType) {
+    return new Promise<EvAuthenticateAgentWithRcAccessTokenRes>((resolve) => {
+      this.setAppStatus(evStatus.LOGIN);
+      this._sdk.authenticateAgentWithRcAccessToken(
+        rcAccessToken,
+        tokenType,
+        async (res: RawEvAuthenticateAgentWithRcAccessTokenRes) => {
+          // For Session in Agent SDK
+          localStorage.setItem('engage-auth:tokenType', res.tokenType);
+          localStorage.setItem('engage-auth:accessToken', res.accessToken);
+          localStorage.setItem('engage-auth:refreshToken', res.refreshToken);
+          // here just auth with engage access token, not need handle response data, that handle by Agent SDK.
+          await this.authenticateAgentWithEngageAccessToken(res.accessToken);
+
+          let locale = res.regionalSettings?.language;
+          if (locale) {
+            this._deps.locale.setLocale(locale);
+            this._eventEmitter.emit('setLocale', locale);
+          }
+          this.setAppStatus(evStatus.LOGINED);
+          const _agents = (res || {}).agents || [];
+          const agents = _agents.map((agent) => ({
+            ...agent,
+            agentId: agent && agent.agentId ? `${agent.agentId}` : '',
+            agentType: AGENT_TYPES[agent.agentType],
+          }));
+          resolve({
+            ...res,
+            agents,
+          });
+        },
+      );
+    });
+  }
 }