@snugdesk/whatsapp-widget 0.1.8 → 0.1.9

package/README.md

@@ -25,10 +25,10 @@ npm install @snugdesk/core
 npm install @snugdesk/whatsapp-widget
 ```
 
-The widget expects the host app to provide Amplify packages (peer dependencies). If your app does not already use Amplify, install them explicitly:
+The widget expects the host app to provide Amplify packages (peer dependencies). This library supports Amplify v5 only. If your app does not already use Amplify, install them explicitly:
 
 ```bash
-npm install aws-amplify @aws-amplify/api-graphql
+npm install aws-amplify@^5 @aws-amplify/api-graphql@^3
 ```
 
 Other runtime dependencies are bundled (`@aws-sdk/client-s3`, `@ctrl/ngx-emoji-mart`, `ngx-avatars`, `ngx-infinite-scroll`, `ngx-skeleton-loader`, `moment-timezone`, `libphonenumber-js`, `sort-nested-json`, `uuid`, …).
@@ -177,7 +177,8 @@ Ensure you render the widget only after you have a fresh token to avoid the comp
 The widget can run in two modes without any extra setup from third parties:
 
 - If the host already configured Amplify and its AppSync endpoint matches the widget default (`defaultAppSyncConfig.endpoint`), the widget will **reuse the host config** and **skip** `Amplify.configure`.
-- Otherwise, the widget will **configure Amplify itself** using its default configuration.
+- The widget honors the host AppSync auth mode when it reuses the host config (for example, `API_KEY` vs `AWS_LAMBDA`).
+- Otherwise, the widget will **configure Amplify itself** using its default configuration (`AWS_LAMBDA`).
 
 ---
 

package/fesm2022/snugdesk-whatsapp-widget.mjs

@@ -23,6 +23,7 @@ import { MatSelectModule } from '@angular/material/select';
 import * as i1 from '@snugdesk/core';
 import { CustomValidators, CleanDeep, SnugdeskCoreModule, CustomPipesModule } from '@snugdesk/core';
 import { API, Amplify } from 'aws-amplify';
+import { GRAPHQL_AUTH_MODE } from '@aws-amplify/api-graphql';
 import moment from 'moment-timezone';
 import { lastValueFrom, BehaviorSubject } from 'rxjs';
 import * as i1$1 from '@angular/common/http';
@@ -58,6 +59,7 @@ function provideAppSyncConfig(config) {
 class AppSyncGraphqlService {
     authenticationService;
     configured = false;
+    authMode = GRAPHQL_AUTH_MODE.AWS_LAMBDA;
     config;
     constructor(config, authenticationService) {
         this.authenticationService = authenticationService;
@@ -66,14 +68,13 @@ class AppSyncGraphqlService {
     }
     async query(statement, variables) {
         this.ensureConfigured();
-        const token = this.getToken();
         // console.debug('token: ', token);
         try {
             return (await API.graphql({
                 query: statement,
                 variables,
-                authMode: 'AWS_LAMBDA',
-                authToken: token,
+                authMode: this.authMode,
+                ...(this.authMode === GRAPHQL_AUTH_MODE.AWS_LAMBDA ? { authToken: this.getToken() } : {}),
             }));
         }
         catch (err) {
@@ -105,13 +106,12 @@ class AppSyncGraphqlService {
     }
     subscribe(statement, variables) {
         this.ensureConfigured();
-        const token = this.getToken();
         try {
             return API.graphql({
                 query: statement,
                 variables,
-                authMode: 'AWS_LAMBDA',
-                authToken: token,
+                authMode: this.authMode,
+                ...(this.authMode === GRAPHQL_AUTH_MODE.AWS_LAMBDA ? { authToken: this.getToken() } : {}),
             });
         }
         catch (err) {
@@ -142,7 +142,9 @@ class AppSyncGraphqlService {
         if (this.configured) {
             return;
         }
-        if (this.shouldUseHostConfig()) {
+        const hostConfig = this.getHostConfig();
+        if (hostConfig.useHost) {
+            this.authMode = this.normalizeAuthMode(hostConfig.authMode) ?? GRAPHQL_AUTH_MODE.API_KEY;
             this.configured = true;
             return;
         }
@@ -154,12 +156,12 @@ class AppSyncGraphqlService {
             aws_project_region: region,
             aws_appsync_graphqlEndpoint: endpoint,
             aws_appsync_region: region,
-            aws_appsync_authenticationType: 'AWS_LAMBDA',
+            aws_appsync_authenticationType: GRAPHQL_AUTH_MODE.AWS_LAMBDA,
             API: {
                 GraphQL: {
                     endpoint,
                     region,
-                    defaultAuthMode: 'AWS_LAMBDA',
+                    defaultAuthMode: GRAPHQL_AUTH_MODE.AWS_LAMBDA,
                     graphql_headers: async () => this.buildAuthHeaders(),
                     functionAuthProvider: async () => ({
                         token: this.getToken(),
@@ -167,12 +169,36 @@ class AppSyncGraphqlService {
                 },
             },
         });
+        this.authMode = GRAPHQL_AUTH_MODE.AWS_LAMBDA;
         this.configured = true;
     }
-    shouldUseHostConfig() {
+    getHostConfig() {
         const existing = Amplify.getConfig?.() ?? {};
         const existingEndpoint = existing?.API?.GraphQL?.endpoint ?? existing?.API?.GraphQL?.graphql_endpoint ?? existing?.aws_appsync_graphqlEndpoint;
-        return existingEndpoint === defaultAppSyncConfig.endpoint;
+        const existingAuthMode = existing?.API?.GraphQL?.defaultAuthMode ?? existing?.aws_appsync_authenticationType;
+        return {
+            useHost: existingEndpoint === defaultAppSyncConfig.endpoint,
+            authMode: existingAuthMode,
+        };
+    }
+    normalizeAuthMode(mode) {
+        if (!mode) {
+            return undefined;
+        }
+        switch (mode) {
+            case 'API_KEY':
+                return GRAPHQL_AUTH_MODE.API_KEY;
+            case 'AWS_IAM':
+                return GRAPHQL_AUTH_MODE.AWS_IAM;
+            case 'OPENID_CONNECT':
+                return GRAPHQL_AUTH_MODE.OPENID_CONNECT;
+            case 'AMAZON_COGNITO_USER_POOLS':
+                return GRAPHQL_AUTH_MODE.AMAZON_COGNITO_USER_POOLS;
+            case 'AWS_LAMBDA':
+                return GRAPHQL_AUTH_MODE.AWS_LAMBDA;
+            default:
+                return undefined;
+        }
     }
     buildAuthHeaders() {
         const token = this.getToken();