@chat21/chat21-ionic 3.1.0-rc1 → 3.1.0-rc2

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # chat21-ionic ver 3.0
 
+### 3.1.0-rc2
+- changed: leadStyle storage property from appStorageService to localstorage 'custom_style' property
+- bug-fixed: projects dropdown don't truncate long project name text
+
 ### 3.1.0-rc1
 - added: INFO_MESSAGE_TYPE enum added to manage info message keys into message.attributes object
 - changed: route to main page ('/conversation-detail') when a conversation is closed or abandoned

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@chat21/chat21-ionic",
     "author": "Tiledesk SRL",
-    "version": "3.1.0-rc1",
+    "version": "3.1.0-rc2",
     "license": "MIT License",
     "homepage": "https://tiledesk.com/",
     "repository": {

package/src/app/app.component.ts

@@ -320,7 +320,7 @@ export class AppComponent implements OnInit {
     this.loadCustomScript(appconfig)
     this.listenToPostMsgs();
 
-    this.loadStyle(JSON.parse(this.appStorageService.getItem('style')))
+    this.loadStyle(JSON.parse(localStorage.getItem('custom_style')))
   }
 
 
@@ -412,7 +412,7 @@ export class AppComponent implements OnInit {
 
   async loadStyle(data){
     console.log('[APP-COMPO] event: style ...', data)
-    this.appStorageService.setItem('style', JSON.stringify(data))
+    localStorage.setItem('custom_style', JSON.stringify(data))
     if(!data || !data.parameter){
 
       /** remove class from chat-IFRAME */
@@ -458,7 +458,7 @@ export class AppComponent implements OnInit {
       
 
       /** remove style INFO from storage */
-      this.appStorageService.removeItem('style')
+      localStorage.removeItem('custom_style')
 
       return;
     } 

package/src/app/components/conversation-info/info-support-group/info-support-group.component.ts

@@ -16,7 +16,6 @@ export class InfoSupportGroupComponent implements OnInit {
 
   private logger: LoggerService = LoggerInstance.getInstance();
   constructor(
-    private appStorageService: AppStorageService,
     private events : EventsService
   ) { }
 
@@ -32,15 +31,15 @@ export class InfoSupportGroupComponent implements OnInit {
   }
 
   onLoad(iframe){
-    let styleData = this.appStorageService.getItem('style')
-    this.logger.log('[InfoSupportGroupComponent] styleeeeee', styleData)
+    let styleData = localStorage.getItem('custom_style')
+    this.logger.log('[InfoSupportGroupComponent] onLoad style', styleData)
     if(styleData && styleData !== 'undefined'){
       this.loadStyle(JSON.parse(styleData))
     }
   }
   async loadStyle(data){
     var iframeWin = <HTMLIFrameElement>document.getElementById("iframeConsole")
-    if(!data.parameter){
+    if(!data || !data.parameter){
       let className = iframeWin.contentDocument.body.className.replace(new RegExp(/style-\S*/gm), '')
       iframeWin.contentDocument.body.className = className
       iframeWin.contentWindow.document.body.classList.remove('light')
@@ -61,7 +60,7 @@ export class InfoSupportGroupComponent implements OnInit {
     link.type = 'text/css';
     link.media='all';
     
-    console.log('linkkkk', link, iframeWin.contentWindow.document)
+    this.logger.log('[InfoSupportGroupComponent] loadStyle element', link, iframeWin.contentWindow.document)
     let head = iframeWin.contentWindow.document.getElementsByTagName('head')[0];
     head.appendChild(link);
     iframeWin.contentWindow.document.body.classList.add(data.type) //ADD class to body element as theme type ('light', 'dark', 'custom')

package/src/app/components/navbar/navbar.component.html

@@ -17,7 +17,7 @@
             <li>
               <button class="btn dropdown-toggle project-dropdown" (click)="openDropdownProjects = !openDropdownProjects">
                 <i class="material-icons" style="margin-right: 3px;">keyboard_arrow_down</i>
-                <span style="text-transform: none"> {{ project?.id_project?.name }} </span>
+                <span class="project-dropdown" style="text-transform: none"> {{ project?.id_project?.name }} </span>
               </button>
               <div class="ripple-container"></div>
               <div id="navbar_dropdown" class="dropdown-menu" [ngClass]="{'open': openDropdownProjects}">

package/src/app/pages/unassigned-conversations/unassigned-conversations.page.scss

@@ -8,7 +8,8 @@ ion-toolbar {
       border-bottom: 1px solid rgba(0, 0, 0, 0.05);
   }
 
-  ion-button{
+  ion-button,
+  ion-title{
       --color: var(--icon-color);
   }
 }

package/src/app/pages/unassigned-conversations/unassigned-conversations.page.ts

@@ -36,7 +36,6 @@ export class UnassignedConversationsPage implements OnInit {
     private navService: NavProxyService,
     private sanitizer: DomSanitizer,
     private translateService: CustomTranslateService,
-    private appStorageService: AppStorageService,
     private events : EventsService
   ) { }
 
@@ -119,15 +118,15 @@ export class UnassignedConversationsPage implements OnInit {
   }
 
   onLoad(iframe){
-    let styleData = this.appStorageService.getItem('style')
-    console.log('[UNASSIGNED-CONVS-PAGE] styleeeeee', styleData)
+    let styleData = localStorage.getItem('custom_style')
     if(styleData && styleData !== 'undefined'){
       this.loadStyle(JSON.parse(styleData))
     }
   }
+  
   async loadStyle(data){
     var iframeWin = <HTMLIFrameElement>document.getElementById("unassigned-convs-iframe")
-    if(!data.parameter){
+    if(!data || !data.parameter){
       let className = iframeWin.contentDocument.body.className.replace(new RegExp(/style-\S*/gm), '')
       iframeWin.contentDocument.body.className = className
       iframeWin.contentWindow.document.body.classList.remove('light')

package/src/assets/test.html

@@ -20,12 +20,12 @@
   </div>
 
   <iframe id="myIFrame" frameBorder="0" width="100%" style="display: flex; height: 95vh" onload="onLoad()"
-  src="http://localhost:8080/#/conversation-detail?tiledesk_supportMode=false&jwt=JWT eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZmQzNGU0MjQ5NjEwZTAwMzQ5ODUwNzgiLCJlbWFpbCI6ImdhYnJpZWxlLnBhbmljb0Bmcm9udGllcmUyMS5pdCIsImZpcnN0bmFtZSI6IkdhYnJpZWxlMiIsImxhc3RuYW1lIjoiUGFuaWNvIC1wcmUiLCJlbWFpbHZlcmlmaWVkIjp0cnVlLCJpYXQiOjE2OTgzMzYyMTMsImF1ZCI6Imh0dHBzOi8vdGlsZWRlc2suY29tIiwiaXNzIjoiaHR0cHM6Ly90aWxlZGVzay5jb20iLCJzdWIiOiJ1c2VyIiwianRpIjoiNjAzZGY3NDQtZWY0OS00Mjg2LWJlMWQtYWM5OGYyYTNkMTJiIn0.bof5QPQP262yCQfpeSjqyoYPkSCttg5NQFkcV8d634xzeq7wJBdhtiO7IJY6hS81a1YyXrAsxlK7RiNS-UZdYiTXR81UXurQd1fnE9jtaggB82tyNL8vmiZEOs6xh4TqO3-kkBzRxQIp74bY53fk_mu5RmNbAjIgUWEufaNDiv8"></iframe>
+  src="http://localhost:8080/#/conversation-detail?tiledesk_supportMode=true&jwt=JWT eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZmQzNGU0MjQ5NjEwZTAwMzQ5ODUwNzgiLCJlbWFpbCI6ImdhYnJpZWxlLnBhbmljb0Bmcm9udGllcmUyMS5pdCIsImZpcnN0bmFtZSI6IkdhYnJpZWxlMiIsImxhc3RuYW1lIjoiUGFuaWNvIC1wcmUiLCJlbWFpbHZlcmlmaWVkIjp0cnVlLCJpYXQiOjE2OTgzMzYyMTMsImF1ZCI6Imh0dHBzOi8vdGlsZWRlc2suY29tIiwiaXNzIjoiaHR0cHM6Ly90aWxlZGVzay5jb20iLCJzdWIiOiJ1c2VyIiwianRpIjoiNjAzZGY3NDQtZWY0OS00Mjg2LWJlMWQtYWM5OGYyYTNkMTJiIn0.bof5QPQP262yCQfpeSjqyoYPkSCttg5NQFkcV8d634xzeq7wJBdhtiO7IJY6hS81a1YyXrAsxlK7RiNS-UZdYiTXR81UXurQd1fnE9jtaggB82tyNL8vmiZEOs6xh4TqO3-kkBzRxQIp74bY53fk_mu5RmNbAjIgUWEufaNDiv8"></iframe>
   
   <script>        
-    window.addEventListener('message', event => {
-        console.log('[CHAT-IONIC] test page event::', event)
-    });
+    // window.addEventListener('message', event => {
+    //     console.log('[CHAT-IONIC] test page event::', event)
+    // });
 
     function onLoad(){
       // var cssLink = document.createElement("style");