@chat21/chat21-web-widget 5.1.25 → 5.1.26-rc1

package/.github/workflows/docker-community-push-latest.yml

@@ -1,10 +1,10 @@
 name: Docker Image Community latest CI
 
-on:	
-  push:	 
+on:  
+  push:  
     branches: [ master ]
-  pull_request:	
-    branches: [ master ]	
+  pull_request:  
+    branches: [ master ]  
 
 jobs:
   push_to_registry:
@@ -12,12 +12,22 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-    - uses: actions/checkout@v2	     
-      name: Check out the repo
-    - uses: docker/build-push-action@v1
-      with:	    
-        username: ${{ secrets.DOCKERHUB_USERNAME }}
-        password: ${{ secrets.DOCKERHUB_TOKEN }}
-        repository: chat21/chat21-web-widget
-        push: true
-        tags: latest
+      - name: Check out the repo
+        uses: actions/checkout@v2
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Log in to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: Build and push multiarch Docker image
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          push: true
+          platforms: linux/amd64,linux/arm64
+          tags: chat21/chat21-web-widget:latest

package/.github/workflows/docker-image-tag-community-tag-push.yml

@@ -3,20 +3,30 @@ name: Publish Docker Community image tags
 on:
   push:
     tags:
-      - '**'           # Push events to every tag including hierarchical tags like
-jobs:
+      - '**'  # Trigger su qualsiasi tag
 
+jobs:
   push_to_registry:
     name: Push Docker image to Docker Hub
     runs-on: ubuntu-latest
+
     steps:
-     - name: Check out the repo
-       uses: actions/checkout@v2
-     - name: Push to Docker Hub
-       uses: docker/build-push-action@v1
-       with:
-        username: ${{ secrets.DOCKERHUB_USERNAME }}
-        password: ${{ secrets.DOCKERHUB_TOKEN }}
-        repository: chat21/chat21-web-widget
-        push: true
-        tag_with_ref: true
+      - name: Check out the repo
+        uses: actions/checkout@v2
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Log in to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      - name: Build and push multiarch Docker image
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          push: true
+          platforms: linux/amd64,linux/arm64
+          tags: chat21/chat21-web-widget:${{ github.ref_name }}

package/CHANGELOG.md

@@ -6,26 +6,33 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
-# 5.1.25
+# 5.1.26-rc1
+- **bug fixed**: improved audio recording/upload flow by ignoring empty recorder chunks, preserving the recorder MIME type when creating the audio blob/file, and uploading audio directly without Base64 conversion
+
+
+# 5.1.25-rc1
 - **bug fixed**: attachment buttons in messages now respect the container max width and wrap/break long labels instead of being clipped
 
-# 5.1.24
+# 5.1.24-rc2
+- **bug fixed**: minor fix in marked pipe to avoid rendering html tags
+
+# 5.1.24-rc1
 - **security**: hardened Markdown link rendering by blocking dangerous protocols (e.g. `javascript:`, `data:`, `vbscript:`) and preventing unsafe links from being rendered as anchors
 - **changed**: refactored `MarkedPipe` to simplify Markdown parsing, improve link rendering via a custom `marked` renderer, and streamline newline handling (`\\n` → `\n`)
 
-# 5.1.23
-- **changed**: API for upload a file/iamges
-
-# 5.1.22
-- **changed**: Updated Launch.js for Wix and Shopify by bypassing scrdoc
-
-# 5.1.21 
+# 5.1.20-rc3 
 - **bug fixed**: saved the widget's size state to local storage (in HP conversations)
 
-# 5.1.20
+# 5.1.20-rc2
+- **changed**: API for upload a file/iamges
 - **changed**: marked pipe do not render /n 
 
+# 5.1.20-rc1
+- **changed**: API for upload a file/iamges
+
 # 5.1.19 
+
+# 5.1.19-rc1 
 - **bug fixed**: show bottom scroll button and unread message badge only when I'm not at the bottom of the page
 - **changed**: allow HTML code to be inserted into messages, but do not parse the code. Ensure coexistence with Markdown.
 - **bug fixed**: after sending a multi-line message, the text area remains open on multiple lines.
@@ -35,6 +42,7 @@
 - **changed**: saved the widget's size state to local storage. The parameter flow is (default → storage → settings → URL)
 
 # 5.1.18
+# 5.1.15-rc3
 - **added**: Implemented Shadow DOM in the text component to isolate HTML and Markdown rendering in a safe and protected context
 - **changed**: Adapted text component styles to support Shadow DOM (removed ::ng-deep, added styles for common markdown elements)
 - **security**: HTML/Markdown content is now rendered in an isolated Shadow DOM, improving security and preventing interference with the rest of the application
@@ -45,6 +53,12 @@
 # 5.1.16
 - **changed**: "close chat" header conversation menu button enabled in chatbot-panel.html 
 
+# 5.1.15-rc2
+- **bug-fixed**: Bug fix for ifame message width
+ 
+# 5.1.15-rc1
+- **changed**: Load local translations before remote ones
+
 # 5.1.15 
 - **changed**: Load local translations before remote ones
 
@@ -53,14 +67,56 @@
 
 # 5.1.13 
 - **bug-fixed**: set default widget size
+
+# 5.1.7-rc16
+- **bug-fixed**: set default widget size
+
+# 5.1.7-rc15
+- **bug-fixed**: set the color of the buttons with visibility control to the font color
+
+# 5.1.7-rc14
+- **bug-fixed**: departmentId and departmentName is incorrect in attributes
+
+# 5.1.7-rc13
+- **changed**: Force authentication if ageChangeVisibilityDesktop or PageChangeVisibilityMobile is OPEN
+
+# 5.1.7-rc12
+- **changed**: Set the default autoStart value to false
+- **added**: Added the open widget loading spinner
+- **changed**: Load the widget without authentication and display the speech bubble
+
+# 5.1.7-rc11
+- **changed**: set default value autoStart false
+- **added**:added loading spinner
+
+# 5.1.7-rc10
+- **changed**: load widget without authentication and display the balloon
+
+# 5.1.7-rc9
+- **removed**: 'DOMAIN_NOT_ALLOWED' in textarea footer component
+
+# 5.1.7-rc8
+# changes in the branch 
+- **changed**: Load local translations before remote ones
+- **bug-fixed**: set default widget size
 - **changed**: Updated the translations of the tooltips in the footer-component
 - **changed**: Refactored the network-offline component and made it generic for displaying errors (now error-alert.component)
-- **bug-fixed**: set the color of the buttons with visibility control to the font color (setButtonColors function)
+
+# 5.1.7-rc7
+- **bug-fixed**: button new_conversation always appear. added subscription to conversationAdded
+
+# 5.1.7-rc6
+- **added**: Added MAX_ATTACHMENT_ERROR error message when uploading a file larger than 10 MB
 
 # 5.1.12
 - **bug-fixed**: check showEmojiFooterButton to enable/disable emojii
 - **bug-fixed**: markdown is fired as an emojii and blocked by isEmojii check fn
 
+# 5.1.7-rc7
+- **bug-fixed**: button new_conversation always appear. added subscription to conversationAdded
+
+# 5.1.7-rc6
+- **added**: Added MAX_ATTACHMENT_ERROR error message when uploading a file larger than 10 MB
 
 # 5.1.7-rc5
 - **bug-fixed**: bug fixed BUTTON STYLES

package/Dockerfile

@@ -1,7 +1,7 @@
 ### STAGE 1: Build ###
 
 # We label our stage as ‘builder’
-FROM node:20.12.2-alpine3.19 as builder
+FROM --platform=$BUILDPLATFORM node:20.12.2-alpine3.19 as builder
 
 COPY package.json package-lock.json ./
 
@@ -15,12 +15,11 @@ COPY . .
 
 ## Build the angular app in production mode and store the artifacts in dist folder
 
-RUN npx ng build --configuration="prod" --output-path=dist --base-href=./ --output-hashing=none
 
+RUN npx ng build --configuration="prod" --output-path=dist --base-href=./ --output-hashing=none
 
 ### STAGE 2: Setup ###
-
-FROM nginx:1.14.1-alpine
+FROM --platform=$BUILDPLATFORM nginx:1.14.1-alpine
 
 ## Copy our default nginx config
 COPY nginx.conf /etc/nginx/nginx.conf
@@ -33,4 +32,4 @@ COPY --from=builder /ng-app/dist/browser /usr/share/nginx/html
 
 RUN echo "Chat21 Web Widget Started!!"
 
-CMD ["/bin/sh",  "-c",  "envsubst < /usr/share/nginx/html/widget-config-template.json > /usr/share/nginx/html/widget-config.json && exec nginx -g 'daemon off;'"]
+CMD ["/bin/sh", "-c", "envsubst < /usr/share/nginx/html/widget-config-template.json > /usr/share/nginx/html/widget-config.json && exec nginx -g 'daemon off;'"]

package/angular.json

@@ -44,7 +44,8 @@
               "src/environments/real_data/widget-config-docker.json",
               "src/environments/real_data/widget-config-native-mqtt.json",
               "src/environments/real_data/widget-config-native-prod.json",
-              "src/environments/real_data/widget-config-aws-stage.json"
+              "src/environments/real_data/widget-config-aws-stage.json",
+              "src/environments/real_data/widget-config-aws-aruba.json"
             ],
             "styles": [
               "src/app/sass/styles.scss"

package/deploy_amazon_beta.sh

@@ -2,8 +2,16 @@
 version=`node -e 'console.log(require("./package.json").version)'`
 echo "version $version"
 
+npm i
+
+cp src/environments/real_data/environment.pre.ts src/environments/environment.pre.ts
+
 ng build --configuration="pre" --aot=true --base-href
 
+### SET HASHING : START ###
+cp ./src/launch_template.js ./dist/browser/launch.js
+node ./src/build_launch.js
+### SET HASHING : END ###
 
 # ########## --->>>> NATIVE-MQTT folder START <<<<<------ ########## #
 
@@ -23,15 +31,17 @@ ng build --configuration="pre" --aot=true --base-href
 
 
 # ########## --->>>> FIREBASE folder START <<<<<------ ########## #
-cd dist
-aws s3 sync . s3://tiledesk-widget-pre/v5/$version/ --cache-control max-age=300
-aws s3 sync . s3://tiledesk-widget-pre/v5/ --cache-control max-age=300
-cd ..
-
-#aws  cloudfront create-invalidation --distribution-id E3EJDWEHY08CZZ --paths "/*"
-cd ..
+cd dist/browser
+aws s3 sync . s3://tiledesk-widget-pre/v5/$version/ --cache-control max-age=300 --exclude='launch.js' #7days
+aws s3 sync . s3://tiledesk-widget-pre/v5/$version/ --cache-control "no-store,no-cache,private" --exclude='*' --include='launch.js'
+aws s3 sync . s3://tiledesk-widget-pre/v5/ --cache-control max-age=300 --exclude='launch.js' #7days
+aws s3 sync . s3://tiledesk-widget-pre/v5/ --cache-control "no-store,no-cache,private" --exclude='*' --include='launch.js'
+cd ../..
 
 aws  cloudfront create-invalidation --distribution-id E2V5O0YPR61V8P --paths "/*"
+
+git restore src/environments/environment.pre.ts
+
 # echo new version deployed $NEW_VER/$NEW_BUILD/ on s3://tiledesk-widget-pre/v2
 echo new version deployed $version/ on s3://tiledesk-widget-pre/v5 and s3://tiledesk-widget-pre/v5/$version/
 echo available on https://s3.eu-west-1.amazonaws.com/tiledesk-widget-pre/v5/index.html

package/package.json

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

package/src/app/app.component.html

@@ -145,5 +145,12 @@
   <chat-launcher-button *ngIf="isInitialized" 
     (onButtonClicked)="onOpenCloseWidget($event)">
   </chat-launcher-button>
-  
+
+  <!-- Loading Spinner -->
+  <div *ngIf="loading" class="tiledesk-loading-overlay">
+    <div class="tiledesk-loading-spinner">
+      <div class="spinner-circle"></div>
+      <div class="loading-text">{{ translationMap.get('LABEL_LOADING') }}</div>
+    </div>
+  </div>
 </div>

package/src/app/app.component.scss

@@ -761,4 +761,63 @@ chat-root {
         }
     }
 
+    // ========= BEGIN: LOADING SPINNER ========= //
+    .tiledesk-loading-overlay {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background-color: rgba(248, 249, 250, 0.95);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        z-index: 9999;
+        backdrop-filter: blur(2px);
+    }
+
+    .tiledesk-loading-spinner {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 16px;
+    }
+
+    .spinner-circle {
+        width: 50px;
+        height: 50px;
+        border: 4px solid rgba(59, 130, 246, 0.2);
+        border-top-color: #3b82f6;
+        border-radius: 50%;
+        animation: spin 0.8s linear infinite;
+    }
+
+    @keyframes spin {
+        0% {
+            transform: rotate(0deg);
+        }
+        100% {
+            transform: rotate(360deg);
+        }
+    }
+
+    .loading-text {
+        font-family: var(--font-family-bubble-message, 'Roboto', 'Google Sans', Helvetica, Arial, sans-serif);
+        font-size: 14px;
+        font-weight: 500;
+        color: #3b82f6;
+        letter-spacing: 0.5px;
+        animation: pulse 1.5s ease-in-out infinite;
+    }
+
+    @keyframes pulse {
+        0%, 100% {
+            opacity: 1;
+        }
+        50% {
+            opacity: 0.5;
+        }
+    }
+    // ========= END: LOADING SPINNER ========= //
+
 }

package/src/app/app.component.ts

@@ -106,6 +106,10 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
   
   forceDisconnect: boolean = false;
 
+  //network status
+  isOnline: boolean = true;
+  loading: boolean = false;
+  
   // alert error message 
   isShowErrorMessage: boolean = false;
   errorMessage: string = '';
@@ -149,7 +153,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.logger.info('[APP-CONF]---------------- ngAfterViewInit: APP.COMPONENT ---------------- ')
         
         // Initialize translation map and enable buttons
-        const keys = ['MAXIMIZE', 'MINIMIZE', 'CENTER', 'BUTTON_CLOSE_TO_ICON'];
+        const keys = ['MAXIMIZE', 'MINIMIZE', 'CENTER', 'BUTTON_CLOSE_TO_ICON', 'LABEL_LOADING'];
         this.translationMap = this.translateService.translateLanguage(keys);
         this.isButtonsDisabled = false;
         
@@ -316,8 +320,15 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     this.g.setIsOpen(isOpen)
                     this.appStorageService.setItem('isOpen', isOpen)
                 }
-                
-                
+
+                if(this.g.onPageChangeVisibilityDesktop === 'last'){
+                    this.logger.debug('[APP-COMP2] ------this.g.isOpen: ', this.g.isOpen)
+                    if(this.g.isOpen){
+                        this.g.autoStart = true;
+                    }
+                }
+
+
                 /**CHECK IF JWT IS IN URL PARAMETERS */
                 this.logger.debug('[APP-COMP] check if token is passed throw url: ', this.g.jwt);
                 if (this.g.jwt) {
@@ -354,10 +365,6 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.subscriptions.push(obsSettingsService);
         this.globalSettingsService.initWidgetParamiters(this.g, this.el);
 
-        // SET AUDIO
-        this.audio = new Audio();
-        this.audio.src = this.g.baseLocation + URL_SOUND_LIST_CONVERSATION;
-        this.audio.load();
     }
 
     private initAll() {
@@ -448,7 +455,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                 that.triggerOnAuthStateChanged(that.stateLoggedUser);
                 that.logger.debug('[APP-COMP]  1 - IMPOSTO STATO CONNESSO UTENTE ', autoStart);
                 
-                
+                this.initAudioNotification()
 
                 new Promise(async (resolve, reject)=> {
                     that.typingService.initialize(this.g.tenant);
@@ -474,26 +481,30 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     that.listenToWidgetClick()
                 }
 
+                /** DDP IF AUTOSTART IS FALSE, SHOW WIDGET */
+                if(!autoStart){
+                    that.logger.info('[APP-COMP] AUTOSTART IS FALSE AND LOGGED SUCCESSFULLY ');
+                    this.g.setParameter('isShown', true, true);
+                }
 
 
             } else if (state && state === AUTH_STATE_OFFLINE && !this.forceDisconnect) {
                 /** non sono loggato */
                 that.logger.info('[APP-COMP] OFFLINE - NO CURRENT USER AUTENTICATE: ');
                 that.g.setParameter('isLogged', false);
-                that.hideWidget();
+                // that.hideWidget();
                 // that.g.setParameter('isShown', false, true);
                 that.triggerOnAuthStateChanged(that.stateLoggedUser);
-                if (autoStart) {
+                if (autoStart || this.g.onPageChangeVisibilityDesktop === 'open' || this.g.onPageChangeVisibilityMobile === 'open') {
                     that.authenticate();
                 }
-            }else if(state && state === AUTH_STATE_CLOSE ){
+            } else if(state && state === AUTH_STATE_CLOSE ){
                 that.logger.info('[APP-COMP] CLOSE - CHANNEL CLOSED: ', this.chatManager);
                 if(this.g.recipientId){
                     this.chatManager.removeConversationHandler(this.g.recipientId)
                     this.g.recipientId = null;
                 }
-            }
-
+            }  
 
         });
         this.subscriptions.push(subAuthStateChanged);
@@ -738,6 +749,8 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         //         divWidgetContainer.style.display = 'block';
         //     }
         // }, 500);
+
+        this.loading = false;
     }
     // ========= end:: START UI ============//
 
@@ -846,7 +859,13 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.appStorageService.setItem('attributes', JSON.stringify(attributes));
         return attributes;
     }
-
+    
+    // SET AUDIO
+    private initAudioNotification(){
+        this.audio = new Audio();
+        this.audio.src = this.g.baseLocation + URL_SOUND_LIST_CONVERSATION;
+        this.audio.load();
+    }
 
     private async initConversationsHandler(tenant: string, senderId: string) {
         this.logger.debug('[APP-COMP] initialize: ListConversationsComponent');
@@ -1605,23 +1624,46 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.f21_close();
     }
 
+
+    /** DDP reload widget */
+    async reloadWidget() { 
+        this.openCloseWidget();
+        this.logger.debug('[APP-COMP-1] AAA - hideWidget');
+        await Promise.all([
+                this.authenticate(),
+                // this.initAll()
+            ]);
+        this.logger.debug('[APP-COMP-1] CCC - showWidget');
+    }
+
+
     /**
      * LAUNCHER BUTTON:
      * onClick button open/close widget
      */
     onOpenCloseWidget($event) {
+        this.logger.debug('[APP-COMP] onOpenCloseWidget', $event, this.g.isLogged);
+        if(!this.g.isLogged){
+            this.reloadWidget();
+        } else {
+            this.openCloseWidget();
+        }
+    }
+
+    /** DDP show widget */
+    openCloseWidget() {
         this.g.setParameter('displayEyeCatcherCard', 'none');
         // const conversationActive: ConversationModel = JSON.parse(this.appStorageService.getItem('activeConversation'));
         const recipientId : string = this.appStorageService.getItem('recipientId')
         this.g.setParameter('recipientId', recipientId);
         this.logger.debug('[APP-COMP] openCloseWidget', recipientId, this.g.isOpen, this.g.startFromHome);
+
         if (this.g.isOpen === false) {
             if(this.forceDisconnect){
                 this.logger.log('[FORCE] onOpenCloseWidget --> reconnect', this.forceDisconnect)
                 this.messagingAuthService.createCustomToken(this.g.tiledeskToken)
                 this.forceDisconnect = false;
             }
-
             if (!recipientId) {
                 if(this.g.singleConversation){
                     this.isOpenHome = false;
@@ -1641,29 +1683,22 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                 this.isOpenHome = false;
                 this.isOpenConversation = true;
                 this.startUI()
-                // this.isOpenSelectionDepartment = false;
             }
-            // if (!conversationActive && !this.g.startFromHome) {
-            //     this.isOpenHome = false;
-            //     this.isOpenConversation = true;
-            //     this.startNwConversation();
-            // } else if (conversationActive) {
-            //     this.isOpenHome = false;
-            //     this.isOpenConversation = true;
-            // }
-            // this.g.startFromHome = true;
             this.triggerOnOpenEvent();
-            
         } else {
             this.triggerOnCloseEvent();
         }
         //change status to the widget
         this.g.setIsOpen(!this.g.isOpen);
         this.appStorageService.setItem('isOpen', this.g.isOpen);
-
+        //show loading if widget is open and user is not logged
+        if(this.g.isOpen === true && !this.g.isLogged){
+            this.loading = true;
+        }
         // this.saveBadgeNewConverstionNumber();
     }
 
+
     /**
      * MODAL SELECTION DEPARTMENT:
      * selected department

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

@@ -470,7 +470,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       return this.isConversationArchived;
     }
 
-    //FALLBACK TO TILEDESK
+    //   //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
@@ -488,9 +488,9 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       return this.isConversationArchived
     }
 
-    this.isConversationArchived = true;
-    return null;
-  }
+      this.isConversationArchived = false;
+      return null;
+    }
 
   /**
     * this.g.recipientId:
@@ -840,6 +840,20 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       this.subscriptions.push(subscribe);
     }
 
+    subscribtionKey = 'conversationsAdded';
+    subscribtion = this.subscriptions.find(item => item.key === subscribtionKey);
+    if(!subscribtion){
+
+      subscribtion = this.chatManager.conversationsHandlerService.conversationChanged.pipe(takeUntil(this.unsubscribe$)).subscribe((conversation) => {
+        this.logger.debug('[CONV-COMP] ***** DATAIL conversationsChanged *****', conversation, this.conversationWith, this.isConversationArchived);
+        if(conversation && conversation.recipient === this.conversationId){
+          this.isConversationArchived = false
+        }
+      });
+      const subscribe = {key: subscribtionKey, value: subscribtion };
+      this.subscriptions.push(subscribe);
+    }
+
     subscribtionKey = 'messageWait';
     subscribtion = this.subscriptions.find(item => item.key === subscribtionKey);
     if (!subscribtion) {

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

@@ -38,19 +38,32 @@ export class ConversationAudioRecorderComponent {
     this.startTime = Date.now();
     navigator.mediaDevices.getUserMedia({ audio: true })
       .then(stream => {
+
+        this.audioChunks = [];
+
         this.mediaRecorder = new MediaRecorder(stream);
         this.mediaRecorder.start();
         this.isRecording = true;
         this.startRecordingEvent.emit();
         this.mediaRecorder.addEventListener('dataavailable', (event) => {
-          this.audioChunks.push(event.data);
+          if (event.data && event.data.size > 0) {
+            this.audioChunks.push(event.data);
+          }
         });
 
         this.mediaRecorder.addEventListener('stop', () => {
-          this.audioBlob = new Blob(this.audioChunks, { type: 'audio/mpeg' });
+          // ✅ MIME REALE del recorder
+          const mimeType = this.mediaRecorder.mimeType;
+          this.audioBlob = new Blob(this.audioChunks, {
+            type: mimeType
+          });
+
+          // ⭐ chiude microfono
+          stream.getTracks().forEach(track => track.stop());
+
+          this.audioChunks = [];
           this.rawAudioUrl = URL.createObjectURL(this.audioBlob);
           this.audioUrl = this.sanitizer.bypassSecurityTrustUrl(this.rawAudioUrl);
-          this.audioChunks = []; 
           this.endRecordingEvent.emit(this.audioBlob);
         });
       })

package/src/app/component/conversation-detail/conversation-footer/conversation-footer.component.scss

@@ -419,3 +419,28 @@ textarea:active{
     border: none;
     // margin: -2px -2px 0px;
 }
+
+
+// aggiungi un'animazione di fade in e fade out quando .star-rating-widget è visibile con transition
+.star-rating-widget {
+    transition: all 0.5s ease-in-out;
+}
+
+.star-rating-widget {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: -52px;
+    height: 100%;
+    width: 100%;
+    flex-direction: row;
+    justify-content: center;
+    background-color: rgb(255, 255, 255);
+    flex-wrap: nowrap;
+    &.active {
+        bottom: 0px;
+    }
+    &.inactive {
+        bottom: -52px;
+    }
+}

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

@@ -87,6 +87,7 @@ export class ConversationFooterComponent implements OnInit, OnChanges {
 
   file_size_limit = FILE_SIZE_LIMIT;
   attachmentTooltip: string = '';
+  isErrorNetwork: boolean = false;
 
 
   convertColorToRGBA = convertColorToRGBA;
@@ -513,14 +514,46 @@ export class ConversationFooterComponent implements OnInit, OnChanges {
   onSendRecording(audioBlob: Blob | null) {
     this.isStartRec = false;
     if (audioBlob) {
-      this.convertBlobToBase64(audioBlob);
+      this.prepareAndUpload(audioBlob);
+      // this.convertBlobToBase64(audioBlob);
       this.isStopRec = false;
     } else {
       this.isStopRec = false;
     }
   }
 
+  prepareAndUpload(audioBlob: Blob) {
 
+    this.isFilePendingToUpload = true;
+    
+    // ⭐ NON modificare il MIME
+    const mimeType = audioBlob.type;
+
+    const size = audioBlob.size;
+    const uid = Date.now().toString(36);
+
+    // estensione coerente col MIME REALE
+    let ext = 'mp3';
+    const fileName = `audio-${uid}.${ext}`;
+  
+    const file = new File([audioBlob], fileName, {
+      type: mimeType,
+      lastModified: Date.now()
+    });
+  
+    // ✅ metadata SENZA base64
+    const metadata = {
+      name: fileName,
+      type: 'audio/mp3',
+      uid: uid,
+      size: size
+    };
+    
+    this.logger.log('[UPLOAD] metadata:', metadata);
+  
+    // stesso metodo che già usi
+    this.uploadSingle(metadata, file, '');
+  }
 
   // Funzione per convertire Blob in Base64 usando FileReader
   async convertBlobToBase64(audioBlob: Blob) {

package/src/app/component/launcher-button/launcher-button.component.html

@@ -1,7 +1,7 @@
 <!-- tabindex="000"-->
 
 <button aflauncherbutton #aflauncherbutton id="c21-launcher-button" class="c21-button-clean scale-in-center" 
-    *ngIf="g.isLogged == true && g.isOpen == false" 
+    *ngIf="g.isOpen == false" 
     [ngClass]="{'c21-align-left' : g.align === 'left', 'c21-align-right' : g.align !== 'left'}"
     [ngStyle]="{ 'background-color': g.baloonImage? null: g.themeColor, 'bottom': g.marginY+'px!important', 'left':(g.align==='left')?g.marginX+'px!important':'', 'right':(g.align==='right')?g.marginX+'px!important':'', 'width': g.launcherWidth, 'height': g.launcherHeight, 'border-radius': g.baloonShape}"
     (click)="openCloseWidget()"

package/src/app/component/launcher-button/launcher-button.component.ts

@@ -67,8 +67,9 @@ export class LauncherButtonComponent implements OnInit, AfterViewInit {
       // this.g.isOpen = !this.g.isOpen;
       // this.g.setIsOpen(!this.g.isOpen);
       // this.appStorageService.setItem('isOpen', this.g.isOpen);
-      this.onButtonClicked.emit( this.g.isOpen );
-    }
+     
+    } 
+    this.onButtonClicked.emit( this.g.isOpen );
   }
 
 }

package/src/app/component/message-attachment/message-attachment.component.scss

@@ -1,5 +1,5 @@
 #buttons-in-message {
-    text-align: right;
+    // text-align: right;
     display: block;
     // margin-right: 16px; //align attachment-buttons to bubble sent message
     height: auto;

package/src/app/providers/translator.service.ts

@@ -302,6 +302,7 @@ export class TranslatorService {
       'CLOSED',
       'LABEL_PREVIEW',
       'MAX_ATTACHMENT',
+      'MAX_ATTACHMENT_ERROR',
       'EMOJI'
     ];
 
@@ -358,6 +359,7 @@ export class TranslatorService {
       globals.LABEL_PREVIEW = res['LABEL_PREVIEW']
       globals.LABEL_ERROR_FIELD_REQUIRED= res['LABEL_ERROR_FIELD_REQUIRED']
       globals.MAX_ATTACHMENT = res['MAX_ATTACHMENT']
+      globals.MAX_ATTACHMENT_ERROR = res['MAX_ATTACHMENT_ERROR']
       globals.EMOJI = res['EMOJI']
       
       

package/src/app/utils/globals.ts

@@ -247,7 +247,7 @@ export class Globals {
 
     // ============ BEGIN: SET EXTERNAL PARAMETERS ==============//
     this.baseLocation = 'https://widget.tiledesk.com/v2';
-    this.autoStart = true;
+    this.autoStart = false;
     /** start Authentication and startUI */
     this.startHidden = false;
     /** show/hide all widget -> js call: showAllWidget */

package/src/assets/i18n/en.json

@@ -96,5 +96,6 @@
     "EMOJI_NOT_ELLOWED":"Emoji not allowed",
     "DOMAIN_NOT_ALLOWED":"URL contains a non-allowed domain",
     "MAX_ATTACHMENT": "Max allowed size {{FILE_SIZE_LIMIT}}Mb",
+    "MAX_ATTACHMENT_ERROR": "The file exceeds the maximum allowed size",
     "EMOJI": "Emoji"
 }

package/src/assets/i18n/es.json

@@ -96,5 +96,6 @@
     "EMOJI_NOT_ELLOWED":"Emoji no permitido",
     "DOMAIN_NOT_ALLOWED":"La URL contiene un dominio no permitido",
     "MAX_ATTACHMENT": "Tamaño máximo permitido {{FILE_SIZE_LIMIT}}Mb",
+    "MAX_ATTACHMENT_ERROR": "El archivo supera el tamaño máximo permitido",
     "EMOJI": "Emoji"
 }

package/src/assets/i18n/fr.json

@@ -96,5 +96,6 @@
     "EMOJI_NOT_ELLOWED":"Emoji non autorisé",
     "DOMAIN_NOT_ALLOWED":"L'URL contient un domaine non autorisé",
     "MAX_ATTACHMENT": "Taille maximale autorisée {{FILE_SIZE_LIMIT}}Mo",
+    "MAX_ATTACHMENT_ERROR": "Le fichier dépasse la taille maximale autorisée",
     "EMOJI": "Emoji"
 }

package/src/assets/i18n/it.json

@@ -94,5 +94,6 @@
     "EMOJI_NOT_ELLOWED":"Emoji non consentiti",
     "DOMAIN_NOT_ALLOWED":"L'URL contiene un dominio non consentito",
     "MAX_ATTACHMENT": "Dimensione massima consentita {{FILE_SIZE_LIMIT}}Mb",
+    "MAX_ATTACHMENT_ERROR": "Il file supera la dimensione massima consentita",
     "EMOJI": "Emoji"
 }

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

@@ -71,7 +71,7 @@ export class TiledeskRequestsService {
 
   public getMyRequests(): Promise<{ requests: Array<any>}> {
     this.tiledeskToken = this.appStorage.getItem('tiledeskToken')
-    const url = this.URL_TILEDESK_REQUEST + '/me?preflight=true'
+    const url = this.URL_TILEDESK_REQUEST + 'me?preflight=true'
     this.logger.log('[TILEDESK-SERVICE] - GET REQUEST url ', url);
     const httpOptions = {
       headers: new HttpHeaders({

package/src/chat21-core/utils/utils.ts

@@ -773,6 +773,11 @@ export function isAllowedUrlInText(text: string, allowedUrls: string[]) {
   return nonWhitelistedDomains.length === 0;
 }
 
+// function extractUrls(text: string): string[] {
+//   const urlRegex = /https?:\/\/[^\s]+/g;
+//   return text.match(urlRegex) || [];
+// }
+
 function extractUrls(text: string): string[] {
   // Rileva URL con o senza protocollo (http/https)
   const urlRegex = /\b((https?:\/\/)?(www\.)?[a-z0-9.-]+\.[a-z]{2,})(\/[^\s]*)?/gi;
@@ -787,5 +792,3 @@ function extractUrls(text: string): string[] {
 }
 
 
-
-

package/src/iframe-style.css

@@ -13,7 +13,7 @@
     bottom: 0px;
     width: auto;   
     height: auto;
-    display: none;
+    display: block;
     z-index: 3000000000; /*999999*/; 
 }
 
@@ -84,12 +84,12 @@
     max-width: 1024px;
     max-height: 100%;
 
-    transition: 
+    /* transition: 
     width 300ms, 
     height 300ms, 
     max-height 300ms, 
     transform 300ms cubic-bezier(0, 1.2, 1, 1), 
-    opacity 300ms ease-out;
+    opacity 300ms ease-out; */
     /* per migliorare le prestazioni quando si usa transform */
     will-change: transform, opacity, width, height;
 }
@@ -175,14 +175,14 @@
 }
 
 #tiledesk-container.open #tiledeskdiv.min-size {
-    transition: width 200ms, height 200ms, max-height 200ms, transform 300ms cubic-bezier(0, 1.2, 1, 1), opacity 83ms ease-out;
+    /* transition: width 200ms, height 200ms, max-height 200ms, transform 300ms cubic-bezier(0, 1.2, 1, 1), opacity 83ms ease-out; */
     width: var(--iframeMinWidth);
     height: var(--iframeMinHeight);
 }
 
 #tiledesk-container.open #tiledeskdiv.max-size {
     /* transition: width 1s, height 1s; */
-    transition: width 200ms, height 200ms, max-height 200ms, transform 300ms cubic-bezier(0, 1.2, 1, 1), opacity 83ms ease-out;
+    /* transition: width 200ms, height 200ms, max-height 200ms, transform 300ms cubic-bezier(0, 1.2, 1, 1), opacity 83ms ease-out; */
     width: var(--iframeMaxWidth);
     height: var(--iframeMaxHeight);
 }

package/src/launch.js

@@ -217,68 +217,13 @@ function loadIframe(tiledeskScriptBaseLocation) {
 
     iDiv.appendChild(ifrm);
 
-    // Funzione helper per caricare iframe con fallback per compatibilità CSP (Wix, etc.)
-    // Usa Blob URL come metodo principale (più compatibile con CSP) con fallback a srcdoc e document.write
-    function loadIframeContent(iframe, htmlContent, baseLocation) {
-        var isLocalhost = baseLocation.includes('localhost');
-        var blobUrl = null;
-        
-        // Metodo 1: Blob URL (più compatibile con CSP di Wix e altre piattaforme)
-        // Usa Blob URL come metodo principale perché è meno spesso bloccato da CSP rispetto a srcdoc
-        if (typeof Blob !== 'undefined' && typeof URL !== 'undefined' && URL.createObjectURL) {
-            try {
-                var blob = new Blob([htmlContent], { type: 'text/html;charset=utf-8' });
-                blobUrl = URL.createObjectURL(blob);
-                iframe.src = blobUrl;
-                
-                // Cleanup del blob URL dopo il caricamento per liberare memoria
-                var originalOnload = iframe.onload;
-                iframe.onload = function() {
-                    // Revoca il blob URL dopo un delay per assicurarsi che tutto sia caricato
-                    setTimeout(function() {
-                        if (blobUrl) {
-                            try {
-                                URL.revokeObjectURL(blobUrl);
-                                blobUrl = null;
-                            } catch(e) {
-                                console.warn('Error revoking blob URL:', e);
-                            }
-                        }
-                    }, 1000);
-                    if (originalOnload) originalOnload.call(this);
-                };
-                return; // Blob URL impostato con successo
-            } catch(e) {
-                console.warn('Blob URL not available, trying srcdoc:', e);
-            }
-        }
-        
-        // Metodo 2: srcdoc (fallback se Blob URL non disponibile)
-        // Skip per localhost (usa document.write per compatibilità sviluppo)
-        if (!isLocalhost && 'srcdoc' in iframe) {
-            try {
-                iframe.srcdoc = htmlContent;
-                return; // srcdoc impostato
-            } catch(e) {
-                console.warn('srcdoc not allowed, trying document.write:', e);
-            }
-        }
-        
-        // Metodo 3: document.write (fallback finale, funziona su localhost e browser vecchi)
-        if (isLocalhost || (iframe.contentWindow && iframe.contentWindow.document)) {
-            try {
-                iframe.contentWindow.document.open();
-                iframe.contentWindow.document.write(htmlContent);
-                iframe.contentWindow.document.close();
-                return; // document.write completato
-            } catch(e) {
-                console.error('All iframe loading methods failed:', e);
-            }
-        }
+    if(tiledeskScriptBaseLocation.includes('localhost')){
+      ifrm.contentWindow.document.open();
+      ifrm.contentWindow.document.write(srcTileDesk);
+      ifrm.contentWindow.document.close();
+    }else {
+      ifrm.srcdoc = srcTileDesk
     }
-    
-    // Carica il contenuto dell'iframe con fallback automatico
-    loadIframeContent(ifrm, srcTileDesk, tiledeskScriptBaseLocation);
 
 
 }

package/src/launch_template.js

@@ -218,68 +218,13 @@ function loadIframe(tiledeskScriptBaseLocation) {
 
     iDiv.appendChild(ifrm);
 
-    // Funzione helper per caricare iframe con fallback per compatibilità CSP (Wix, etc.)
-    // Usa Blob URL come metodo principale (più compatibile con CSP) con fallback a srcdoc e document.write
-    function loadIframeContent(iframe, htmlContent, baseLocation) {
-        var isLocalhost = baseLocation.includes('localhost');
-        var blobUrl = null;
-        
-        // Metodo 1: Blob URL (più compatibile con CSP di Wix e altre piattaforme)
-        // Usa Blob URL come metodo principale perché è meno spesso bloccato da CSP rispetto a srcdoc
-        if (typeof Blob !== 'undefined' && typeof URL !== 'undefined' && URL.createObjectURL) {
-            try {
-                var blob = new Blob([htmlContent], { type: 'text/html;charset=utf-8' });
-                blobUrl = URL.createObjectURL(blob);
-                iframe.src = blobUrl;
-                
-                // Cleanup del blob URL dopo il caricamento per liberare memoria
-                var originalOnload = iframe.onload;
-                iframe.onload = function() {
-                    // Revoca il blob URL dopo un delay per assicurarsi che tutto sia caricato
-                    setTimeout(function() {
-                        if (blobUrl) {
-                            try {
-                                URL.revokeObjectURL(blobUrl);
-                                blobUrl = null;
-                            } catch(e) {
-                                console.warn('Error revoking blob URL:', e);
-                            }
-                        }
-                    }, 1000);
-                    if (originalOnload) originalOnload.call(this);
-                };
-                return; // Blob URL impostato con successo
-            } catch(e) {
-                console.warn('Blob URL not available, trying srcdoc:', e);
-            }
-        }
-        
-        // Metodo 2: srcdoc (fallback se Blob URL non disponibile)
-        // Skip per localhost (usa document.write per compatibilità sviluppo)
-        if (!isLocalhost && 'srcdoc' in iframe) {
-            try {
-                iframe.srcdoc = htmlContent;
-                return; // srcdoc impostato
-            } catch(e) {
-                console.warn('srcdoc not allowed, trying document.write:', e);
-            }
-        }
-        
-        // Metodo 3: document.write (fallback finale, funziona su localhost e browser vecchi)
-        if (isLocalhost || (iframe.contentWindow && iframe.contentWindow.document)) {
-            try {
-                iframe.contentWindow.document.open();
-                iframe.contentWindow.document.write(htmlContent);
-                iframe.contentWindow.document.close();
-                return; // document.write completato
-            } catch(e) {
-                console.error('All iframe loading methods failed:', e);
-            }
-        }
+    if(tiledeskScriptBaseLocation.includes('localhost')){
+      ifrm.contentWindow.document.open();
+      ifrm.contentWindow.document.write(srcTileDesk);
+      ifrm.contentWindow.document.close();
+    }else {
+      ifrm.srcdoc = srcTileDesk
     }
-    
-    // Carica il contenuto dell'iframe con fallback automatico
-    loadIframeContent(ifrm, srcTileDesk, tiledeskScriptBaseLocation);
 
 
 }

package/deploy_amazon_prod.sh

@@ -1,41 +0,0 @@
-# npm version patch
-version=`node -e 'console.log(require("./package.json").version)'`
-echo "version $version"
-
-npm i
-
-cp src/environments/real_data/environment.prod.ts src/environments/environment.prod.ts
-
-# --build-optimizer=false if localstorage is disabled (webview) appears https://github.com/firebase/angularfire/issues/970
-ng build --configuration="prod" --aot=true
-##--base-href='./v5/' --output-hashing none
-
-### SET HASHING : START ###
-cp ./src/launch_template.js ./dist/browser/launch.js
-node ./src/build_launch.js
-### SET HASHING : END ###
-
-#### FIREBASE #####
-# cd dist
-# # aws s3 sync . s3://tiledesk-widget/v5/latest/
-# aws s3 sync . s3://tiledesk-widget/v5/$version/ --cache-control max-age=300
-# aws s3 sync . s3://tiledesk-widget/v5/ --cache-control max-age=300
-# cd ..
-
-# #### MQTT #####
-cd dist/browser
-# aws s3 sync . s3://tiledesk-widget/v5/latest/
-aws s3 sync . s3://tiledesk-widget/v6/$version/ --cache-control max-age=86400 --exclude='launch.js' #8days
-aws s3 sync . s3://tiledesk-widget/v6/$version/ --cache-control "no-store,no-cache,private" --exclude='*' --include='launch.js'
-aws s3 sync . s3://tiledesk-widget/v6/ --cache-control max-age=86400 --exclude='launch.js' #8days
-aws s3 sync . s3://tiledesk-widget/v6/ --cache-control "no-store,no-cache,private" --exclude='*' --include='launch.js'
-cd ../..
-
-aws  cloudfront create-invalidation --distribution-id E3EJDWEHY08CZZ --paths "/*"
-
-git restore src/environments/environment.prod.ts
-
-echo new version deployed $version on s3://tiledesk-widget/v6
-echo available on https://s3.eu-west-1.amazonaws.com/tiledesk-widget/v6/index.html
-echo https://widget.tiledesk.com/v6/index.html
-echo https://widget.tiledesk.com/v6/$version/index.html