@chat21/chat21-web-widget 5.1.0-rc11 → 5.1.0-rc13

package/CHANGELOG.md

@@ -6,6 +6,12 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
+# 5.1.0-rc13
+- **added**: ability to manage embedded chatbot-panel.html page into an iframe and hide some elements
+
+# 5.1.0-rc12
+- **added**: ability to get all my request from Tiledesk API
+
 # 5.1.0-rc11
 - **bug-fixed**: removed private note msgs
 

package/angular.json

@@ -24,7 +24,7 @@
             "index": "src/index.html",
             "polyfills": [
               "src/polyfills.ts",
-              "@angular/localize/init",
+              "@angular/localize/init"
             ],
             "tsConfig": "tsconfig.app.json",
             "assets": [
@@ -51,7 +51,7 @@
             ],
             "scripts": [
               "src/assets/js/mqtt/4.2.6/mqtt.min.js",
-              "node_modules/bootstrap/dist/js/bootstrap.min.js",
+              "node_modules/bootstrap/dist/js/bootstrap.min.js"
             ],
             "extractLicenses": false,
             "allowedCommonJsDependencies": [

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chat21/chat21-web-widget",
   "author": "Tiledesk SRL",
-  "version": "5.1.0-rc11",
+  "version": "5.1.0-rc13",
   "license": "MIT",
   "homepage": "https://www.tiledesk.com",
   "repository": {

package/src/app/component/conversation-detail/conversation/conversation.component.ts

@@ -363,14 +363,21 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     // this.logger.debug('[CONV-COMP] ------ 5: updateConversationbage ------ ');
     // this.updateConversationBadge();
 
-    this.logger.debug('[CONV-COMP] ------ 6: getConversationDetail ------ ', this.conversationId);
-    this.getConversationDetail((isConversationArchived) => {
-      this.logger.debug('[CONV-COMP] ------ 6: updateConversationbage ------ ');
-      this.updateConversationBadge();
-      return;
-    }) //check if conv is archived or not
+    
+    // this.getConversationDetail((isConversationArchived) => {
+    //   this.logger.debug('[CONV-COMP] ------ 6: updateConversationbage ------ ');
+    //   this.updateConversationBadge();
+    //   return;
+    // }) //check if conv is archived or not
     // this.checkListMessages();
 
+    this.logger.debug('[CONV-COMP] ------ 5: getConversationDetail ------ ', this.conversationId);
+    await this.getConversationDetail();
+    
+    
+    this.logger.debug('[CONV-COMP] ------ 6: updateConversationBadge ------ ');
+    this.updateConversationBadge();
+
     if(this.g.customAttributes){
       this.updateUserInfo(this.g.customAttributes)
     }
@@ -384,7 +391,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
    * @param callback
    * @returns isConversationArchived (status conversation archived: boolean) 
    */
-  getConversationDetail(callback:(isConversationArchived: boolean)=>void){
+  getConversationDetail_old(callback:(isConversationArchived: boolean)=>void){
     // if(!this.isConversationArchived){ 
     //get conversation from 'conversations' firebase node
     this.logger.debug('[CONV-COMP] getConversationDetail: isConversationArchived???', this.isConversationArchived, this.conversationWith)
@@ -414,39 +421,60 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
         })
       }
     });
-    // } else { //get conversation from 'conversations' firebase node
-    //   this.archivedConversationsHandlerService.getConversationDetail(this.conversationId, (conv)=>{
-    //     this.logger.debug('[CONV-COMP] archivedConversationsHandlerService getConversationDetail', this.conversationId, conv, this.isConversationArchived)
-    //     if(conv){
-    //       this.conversation = conv;
-    //       this.isConversationArchived = true;
-    //       callback(this.isConversationArchived) 
-    //     }
-    //     if(!conv){
-    //       this.conversationsHandlerService.getConversationDetail(this.conversationId, (conv)=>{
-    //         this.logger.debug('[CONV-COMP] conversationsHandlerService getConversationDetail', this.conversationId, conv, this.isConversationArchived)
-    //         conv? this.isConversationArchived = false : null  
-    //         this.conversation = conv;
-    //         callback(this.isConversationArchived) 
-    //       })
-    //     }
-    //   })
-    // }
-    
-    // if(!this.isConversationArchived){ //get conversation from 'conversations' firebase node
-    //   this.conversationsHandlerService.getConversationDetail(this.conversationId, (conv)=>{
-    //     this.logger.debug('[CONV-COMP] conversationsHandlerService getConversationDetail', this.conversationId, conv)
-    //     this.conversation = conv;
-    //     callback(this.isConversationArchived)    
-    //   })
-    // }else { //get conversation from 'conversations' firebase node
-    //   this.archivedConversationsHandlerService.getConversationDetail(this.conversationId, (conv)=>{
-    //     this.logger.debug('[CONV-COMP] archivedConversationsHandlerService getConversationDetail', this.conversationId, conv)
-    //     this.conversation = conv;   
-    //     callback(this.isConversationArchived)   
-    //   })
-    // }
-    // this.updateConversationBadge()
+  }
+
+  /**
+   * @description get detail of conversation by uid and then return callback with conversation status
+   * @param callback
+   * @returns isConversationArchived (status conversation archived: boolean) 
+   */
+  async getConversationDetail(): Promise<boolean | null> {
+    this.logger.debug('[CONV-COMP] getConversationDetail: isConversationArchived???', this.isConversationArchived, this.conversationWith);
+  
+    const conv = await new Promise<any>((resolve) => {
+      this.conversationsHandlerService.getConversationDetail(this.conversationWith, resolve);
+    });
+
+    if (conv) {
+      this.logger.debug('[CONV-COMP] getConversationDetail: conversationsHandlerService ', this.conversationWith, conv, this.isConversationArchived);
+      this.conversation = conv;
+      this.isConversationArchived = false;
+      return this.isConversationArchived;
+    }
+  
+    this.logger.debug('[CONV-COMP] getConversationDetail: conv not exist --> search in archived list', this.isConversationArchived, this.conversationWith);
+  
+    const archivedConv = await new Promise<any>((resolve) => {
+      this.archivedConversationsHandlerService.getConversationDetail(this.conversationWith, resolve);
+    });
+  
+    if (archivedConv) {
+      this.logger.debug('[CONV-COMP] getConversationDetail: archivedConversationsHandlerService', this.conversationWith, archivedConv, this.isConversationArchived);
+      this.conversation = archivedConv;
+      this.isConversationArchived = true;
+      return this.isConversationArchived;
+    }
+
+    //FALLBACK TO TILEDESK
+    const requests_list = await this.tiledeskRequestService.getMyRequests().catch(err => {
+      this.logger.error('[CONV-COMP] getConversationDetail: error getting request from Tiledesk', err);
+      this.isConversationArchived=true
+      return { requests: [] }
+    });
+    if (requests_list && requests_list.requests.length > 0) {
+      this.logger.debug('[CONV-COMP] getConversationDetail: request exist on Tiledesk', requests_list);
+      let conversation = requests_list.requests.find((request)=> request.request_id === this.conversationId)
+      if(conversation){
+        this.isConversationArchived = false
+        return this.isConversationArchived
+      }
+      this.logger.debug('[CONV-COMP] getConversationDetail: request NOT EXIST on Tiledesk', requests_list);
+      this.isConversationArchived = true
+      return this.isConversationArchived
+    }
+
+    this.isConversationArchived = true;
+    return null;
   }
 
   /**
@@ -744,6 +772,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       subscribtion = this.conversationHandlerService.messageAdded.pipe(takeUntil(this.unsubscribe$)).subscribe((msg: MessageModel) => {
         this.logger.debug('[CONV-COMP] ***** DETAIL messageAdded *****', msg);
         if (msg) {
+
           that.newMessageAdded(msg);
           this.checkMessagesLegntForTranscriptDownloadMenuOption();
           this.resetTimeout();

package/src/assets/twp/chatbot-panel.html

@@ -108,6 +108,27 @@
             }
         }
 
+        .loading-text {
+            position: absolute;
+            top: 60%;
+            left: 50%;
+            transform: translateX(-50%);
+            font-family: sans-serif;
+            font-size: 18px;
+            color: rgb(224, 106, 88);;
+            animation: blinkText 1.5s infinite ease-in-out;
+            }
+
+            /* Animazione lampeggiante */
+            @keyframes blinkText {
+            0%, 100% {
+                opacity: 1;
+            }
+            50% {
+                opacity: 0;
+            }
+        }
+
         #deferred-styles {
             display: none;
         }
@@ -458,6 +479,23 @@
         }(document, 'script', 'tiledesk-jssdk'));
 
     </script> -->
+
+
+    <script type="application/javascript" id="check_embed">
+        document.addEventListener('DOMContentLoaded', function () {
+          const isEmbedded = window.self !== window.top;
+
+          if (isEmbedded) {
+            //HIDE header and footer elements
+            const header = document.querySelector('header');
+            const footer = document.querySelector('footer');
+            if (header) header.style.display = 'none';
+            if (footer) footer.style.display = 'none';
+          }
+        });
+    </script>
+
+
     <script type="application/javascript">
         window.tiledeskSettings = {
             marginX: "100px",
@@ -654,6 +692,7 @@
 
     <div id="preloader">
         <div class="loader"></div>
+        <!-- <div class="loading-text">Loading . . .</div> -->
     </div>
 
     <header id="header">

package/src/chat21-core/providers/tiledesk/tiledesk-requests.service.ts

@@ -68,4 +68,18 @@ export class TiledeskRequestsService {
       return res
     })
   }
+
+  public getMyRequests(): Promise<{ requests: Array<any>}> {
+    this.tiledeskToken = this.appStorage.getItem('tiledeskToken')
+    const url = this.URL_TILEDESK_REQUEST + '/me?preflight=true'
+    this.logger.log('[TILEDESK-SERVICE] - GET REQUEST url ', url);
+    const httpOptions = {
+      headers: new HttpHeaders({
+        'Content-Type': 'application/json',
+        Authorization: this.tiledeskToken
+      })
+    }
+    
+    return this.http.get<{ requests: Array<any>}>(url, httpOptions).toPromise()
+  }
 }