Merge pull request #770 from aws-samples/feature/sdk-3

Feature/sdk 3

Author: atjohns

lex-web-ui/package-lock.json

@@ -20,7 +20,13 @@
   "dependencies": {
     "aws-amplify": "^5.3.26",
     "amazon-connect-chatjs": "^2.3.0",
-    "aws-sdk": "^2.1354.0",
+    "@aws-sdk/client-cognito-identity": "3.470.0",
+    "@aws-sdk/client-connect": "3.470.0",
+    "@aws-sdk/client-lex-runtime-service": "3.470.0",
+    "@aws-sdk/client-lex-runtime-v2": "3.470.0",
+    "@aws-sdk/client-polly": "3.470.0",
+    "@aws-sdk/client-s3": "3.470.0",
+    "@aws-sdk/credential-providers": "3.470.0",
     "browserify-zlib": "^0.2.0",
     "buffer": "^6.0.3",
     "core-js": "^3.6.5",

lex-web-ui/package.json

@@ -73,11 +73,12 @@ import MinButton from '@/components/MinButton';
 import ToolbarContainer from '@/components/ToolbarContainer';
 import MessageList from '@/components/MessageList';
 import InputContainer from '@/components/InputContainer';
-import LexRuntime from 'aws-sdk/clients/lexruntime';
-import LexRuntimeV2 from 'aws-sdk/clients/lexruntimev2';
+// import { fromCognitoIdentityPool } from '@aws-sdk/credential-providers';
+import { LexRuntimeServiceClient } from '@aws-sdk/client-lex-runtime-service';
+import { LexRuntimeV2Client } from '@aws-sdk/client-lex-runtime-v2';
+import { PollyClient } from '@aws-sdk/client-polly';
+
 
-import { Config as AWSConfig, CognitoIdentityCredentials }
-  from 'aws-sdk/global';
 
 export default {
   name: 'lex-web',
@@ -156,7 +157,7 @@ export default {
     if (!this.isMobile) {
       document.documentElement.style.overflowY = 'hidden';
     }
-
+    
     this.initConfig()
       .then(() => Promise.all([
         this.$store.dispatch(
@@ -191,44 +192,25 @@ export default {
         if (!poolId) {
           return Promise.reject(new Error('no cognito.poolId found in config'))
         }
+        
 
-        const AWSConfigConstructor = (window.AWS && window.AWS.Config) ?
-          window.AWS.Config :
-          AWSConfig;
-
-        const CognitoConstructor =
-          (window.AWS && window.AWS.CognitoIdentityCredentials) ?
-            window.AWS.CognitoIdentityCredentials :
-            CognitoIdentityCredentials;
-
-        const LexRuntimeConstructor = (window.AWS && window.AWS.LexRuntime) ?
-          window.AWS.LexRuntime :
-          LexRuntime;
-
-        const LexRuntimeConstructorV2 = (window.AWS && window.AWS.LexRuntimeV2) ?
-          window.AWS.LexRuntimeV2 :
-          LexRuntimeV2;
-
-        const credentials = new CognitoConstructor(
-          { IdentityPoolId: poolId },
-          { region: region },
-        );
-
-        const awsConfig = new AWSConfigConstructor({
+        const awsConfig = {
           region: region,
-          credentials,
-        });
+          credentials: this.$lexWebUi.awsConfig.credentials,
+        };
 
-        this.$lexWebUi.lexRuntimeClient = new LexRuntimeConstructor(awsConfig);
-        this.$lexWebUi.lexRuntimeV2Client = new LexRuntimeConstructorV2(awsConfig);
+        this.$lexWebUi.lexRuntimeClient = new LexRuntimeServiceClient(awsConfig);
+        this.$lexWebUi.lexRuntimeV2Client = new LexRuntimeV2Client(awsConfig);
+        this.$lexWebUi.pollyClient = new PollyClient(awsConfig)
         /* eslint-disable no-console */
-        console.log(`lexRuntimeV2Client : ${JSON.stringify(this.$lexWebUi.lexRuntimeV2Client)}`);
+        // console.log('this.$store.state', this.$store.state);
+        // console.log(`lexRuntimeV2Client : ${JSON.stringify(this.$lexWebUi.lexRuntimeV2Client)}`);
 
         const promises = [
           this.$store.dispatch('initMessageList'),
-          this.$store.dispatch('initPollyClient', this.$lexWebUi.pollyClient),
+          this.$store.dispatch('initPollyClient', this.$lexWebUi.pollyClient, this.$lexWebUi.awsConfig.credentials),
           this.$store.dispatch('initLexClient', {
-            v1client: this.$lexWebUi.lexRuntimeClient, v2client: this.$lexWebUi.lexRuntimeV2Client,
+            v1client: this.$lexWebUi.lexRuntimeClient, v2client: this.$lexWebUi.lexRuntimeV2Client, credentials: this.$lexWebUi.awsConfig.credentials
           }),
         ];
         console.info('CONFIG : ', this.$store.state.config);
@@ -589,4 +571,4 @@ NOTE: not using var() for different heights due to IE11 compatibility
 
 html { font-size: 14px !important; } 
 
-</style>
+</style>

lex-web-ui/src/components/LexWeb.vue

@@ -18,14 +18,9 @@ License for the specific language governing permissions and limitations under th
  * Exports Loader as the plugin constructor
  * and Store as store that can be used with Vuex.Store()
  */
-import Vue from 'vue';
-import Vuex from 'vuex';
-import { Config as AWSConfig, CognitoIdentityCredentials }
-  from 'aws-sdk/global';
-import LexRuntime from 'aws-sdk/clients/lexruntime';
-import LexRuntimeV2 from 'aws-sdk/clients/lexruntimev2';
-import Polly from 'aws-sdk/clients/polly';
-
+import { LexRuntimeServiceClient } from '@aws-sdk/client-lex-runtime-service';
+import { LexRuntimeV2Client } from '@aws-sdk/client-lex-runtime-v2';
+import { PollyClient } from '@aws-sdk/client-polly';
 import LexWeb from '@/components/LexWeb';
 import VuexStore from '@/store';
 
@@ -162,62 +157,35 @@ export class Loader {
     this.app = app;
 
     const mergedConfig = mergeConfig(defaultConfig, config);
-
-    const AWSConfigConstructor = (window.AWS && window.AWS.Config) ?
-      window.AWS.Config :
-      AWSConfig;
-
-    const CognitoConstructor =
-      (window.AWS && window.AWS.CognitoIdentityCredentials) ?
-        window.AWS.CognitoIdentityCredentials :
-        CognitoIdentityCredentials;
-
-    const PollyConstructor = (window.AWS && window.AWS.Polly) ?
-      window.AWS.Polly :
-      Polly;
-
-    const LexRuntimeConstructor = (window.AWS && window.AWS.LexRuntime) ?
-      window.AWS.LexRuntime :
-      LexRuntime;
-
-    const LexRuntimeConstructorV2 = (window.AWS && window.AWS.LexRuntimeV2) ?
-      window.AWS.LexRuntimeV2 :
-      LexRuntimeV2;
-
-    if (!AWSConfigConstructor || !CognitoConstructor || !PollyConstructor
-        || !LexRuntimeConstructor || !LexRuntimeConstructorV2) {
-      throw new Error('unable to find AWS SDK');
+    let credentials;
+    if (mergedConfig.cognito.poolId != '' || localStorage.getItem('poolId')) {
+      credentials = this.store.dispatch('getCredentials', mergedConfig).then((creds) => {
+        return creds;
+      });
     }
 
-    const credentials = new CognitoConstructor(
-      { IdentityPoolId: mergedConfig.cognito.poolId },
-      { region: mergedConfig.region || mergedConfig.cognito.poolId.split(':')[0] || 'us-east-1' },
-    );
-
-    const awsConfig = new AWSConfigConstructor({
+    const awsConfig = {
       region: mergedConfig.region || mergedConfig.cognito.poolId.split(':')[0] || 'us-east-1',
       credentials,
-    });
+    };
 
-    const lexRuntimeClient = new LexRuntimeConstructor(awsConfig);
-    const lexRuntimeV2Client = new LexRuntimeConstructorV2(awsConfig);
-    /* eslint-disable no-console */
-    const pollyClient = (
-      typeof mergedConfig.recorder === 'undefined' ||
-      (mergedConfig.recorder && mergedConfig.recorder.enable !== false)
-    ) ? new PollyConstructor(awsConfig) : null;
+    const lexRuntimeClient = new LexRuntimeServiceClient(awsConfig);
+    const lexRuntimeV2Client = new LexRuntimeV2Client(awsConfig);
+    const pollyClient = new PollyClient(awsConfig);
 
+    // /* eslint-disable no-console */
     app.use(Plugin, {
         config: mergedConfig,
         awsConfig,
         lexRuntimeClient,
         lexRuntimeV2Client,
-        pollyClient,
+        pollyClient
     });
     this.app = app;
   }
 }
 
+// comment out for prod build
 if(process.env.NODE_ENV === "development")
 {
   const lexWeb = new Loader();