@chat21/chat21-ionic 3.4.30-rc3 → 3.4.30

package/CHANGELOG.md

@@ -8,118 +8,18 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
-# 3.4.30-rc3
+# 3.4.30 in PROD
 - **changed**: when the app is in background, play a sound whenever a new message arrives.
 
 # 3.4.29 in PROD
 - **bug-fixed**: web (Chrome >= 144) `ion-content` stopped scrolling on some pages (conversation list / contacts directory / unassigned); removed the forced `--overflow: hidden` and handled scrolling on Ionic’s internal scroll container via `ion-content::part(scroll)`
 
-# 3.4.29-rc2
-- **changed**: minor updates on API to upload file/image into chat
-
-# 3.4.29-rc1
-- **changed**: API for upload a file/image into chat
-
-
 # 3.4.28 in PROD
 - **bug-fixed**: cannot do project subscription if last_project object is not a project_user obj
 
 # 3.4.27 in PROD
 - **bug-fixed**: cannot find route if userFullname contains /
 
-# 3.4.29-rc1
-- **bug-fixed**: web (Chrome >= 144) `ion-content` stopped scrolling on some pages (conversation list / contacts directory / unassigned); removed the forced `--overflow: hidden` and handled scrolling on Ionic’s internal scroll container via `ion-content::part(scroll)`
-
-# 3.4.28-rc1
-- **bug-fixed**: cannot do project subscription if last_project object is not a project_user obj
-
-# 3.4.27-rc26
-- **bug-fixed**: wss push requests twice 
-
-# 3.4.27-rc25
-- **bug-fixed**: projectUserService is not initialized
-
-# 3.4.27-rc24
-- **added**: implementation of multiple message in wss onmessage
-
-# 3.4.27-rc23
-- **added**: keepAlive worker for MQTT connection
-
-# 3.4.27-rc22
-- **added**: new WsWorker to manage iframe chrome throttling while tab is in background or hidden
-
-# 3.4.27-rc21
-- **changed**: new wss reconnect and timeout keepalive 
-- **bug-fixed**: cannot route if senderFullaname contains /
-
-# 3.4.27-rc20
-- **added**: onOpenTicketExternally event in triggerEvents service
-
-# 3.4.27-rc19
-- **added**: window.parent['openTicketOnHDA']
-
-# 3.4.27-rc18
-- **added**: triggerOnUpdateNewConversationBadge to update conversation badge count in parent component
-
-# 3.4.27-rc17
-- **bug-fixed**: setNotification not called when click on a conversation
-
-# 3.4.27-rc16
-- **bug-fixed**: setNotification not called when resolve a conversation
-
-# 3.4.27-rc15
-- **changed**: /images with /img in assets folder
-
-# 3.4.27-rc14
-- **added**: DISPLAY_EDIT_PROFILE brand variable
-- **bug-fixed**: emojii is sent also if is not allowed
-
-# 3.4.27-rc13
-- **added**: ability to mantain logout parameter when redirect to dashboard urls from sidebar component
-
-# 3.4.27-rc12
-- **added**: ability to manage logOut option in sidebar-user-detail with tiledesk_logOut url query params
-
-# 3.4.27-rc11
-- **bug-fixed**: fixed infinite loading in contact list
-
-# 3.4.27-rc10
-- **added**: ability to manage header-conversation-list with roles
-- **bug-fixed**: members in group list not loaded
-
-# 3.4.27-rc9
-- **bug-fixed**: Scrolling to the last message when opening a conversation
-- **bug-fixed**: Loading in the conversation list disabled when removing the last conversation
-
-# 3.4.27-rc8
-- **added**: ability to open ticket to external service
-- **added**: ticketSection env var
-
-# 3.4.27-rc7
-- **bug-fixed**: Scrolling to the last message when opening a conversation
-- **bug-fixed**: Loading in the conversation list disabled when removing the last conversation
-
-# 3.4.27-rc6
-- **bug-fixed**: user for dashboard app is incorrect
-
-# 3.4.27-rc5
-- **added**: managed roles in sidebar e navbar
-- **bug-fixed**: projectId and supportMode url is not saved in localstorage
-
-# 3.4.27-rc4
-- **bug-fixed**: extractUrls function is not able to detect url start with www or without https/http
-- **bug-fixed**: if message is sent with keydown, error on domain check is not showed
-
-# 3.4.27-rc3
-- **bug-fixed**: cannot set user availability if supportMode is enabled and tiledesk_projectID url params is set
-
-# 3.4.27-rc2
-- **bug-fixed**: cannede responses role
-
-# 3.4.27-rc1
-- **added**: managed canned responses with roles
-- **changed**: name in info mesage 
-
 # 3.4.26 in PROD
 
 # 3.4.26-rc2
@@ -128,7 +28,6 @@
 # 3.4.26-rc1
 - **added**: tiledesk_projectID query param to manage user status
 - **added**: token to managane ticket feature
-- **added**: getOsCode login into utils.ts
 
 # 3.4.25 in PROD
 - **changed**: pipe marked to support malicious text input
@@ -151,24 +50,6 @@
 # 3.4.22 in PROD
 - **added**: managed allowed_upload_extentions from project settings
 
-# 3.4.21-rc6
-- **added**: managed allowed_upload_extentions from project settings
-
-# 3.4.21-rc5
-- **added**: setConversation as read when agent click on it
-
-# 3.4.21-rc4
-- **added**: ability to init and decrement new conversation count badge
-
-# 3.4.21-rc3
-- **changed**: badge notification for agentDesktop
-
-# 3.4.21-rc2
-- **added**: count in newConversation handler event
-
-# 3.4.21-rc1
-- **added**:  implement badge notification for agentDesktop sw when new conversation is assigned to logged agent
-
 # 3.4.21 in PROD
 
 # 3.4.20 in PROD
@@ -182,8 +63,8 @@
 - **bug-fixed**: minor fix on ion-texarea element with allowed url domain
 
 # 3.4.19-rc1
-- **added**: ability to check for if emoji is allowd to be sent in message textarea
-- **added**: ability to check for if url domain  is allowd to be sent in message textarea
+- added: ability to check for if emoji is allowd to be sent in message textarea
+- added: ability to check for if url domain  is allowd to be sent in message textarea
 
 # 3.4.18 in PROD
 

package/angular.json

@@ -32,7 +32,6 @@
               "src/chat-config-template.json",
               "src/chat-config.json",
               "src/chat-config-dev.json",
-              "src/chat-config-native-ar.json",
               {
                 "glob": "**/*",
                 "input": "src/assets",

package/package.json

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

package/src/app/app.component.html

@@ -21,9 +21,7 @@
     </div> -->
     
     <div class="user-details-sidebar" [ngClass]="{'hide-sidebar': IS_ONLINE === false || IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false}">
-      <app-sidebar-user-details
-        [logOut]="g?.logOut">
-      </app-sidebar-user-details>
+      <app-sidebar-user-details> </app-sidebar-user-details>
     </div>
  
     <ion-split-pane when="md" contentId="main" [ngClass]="{'mobile': IS_ON_MOBILE_DEVICE, 'sidebar-hidden': IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false}">

package/src/app/app.component.ts

@@ -44,9 +44,6 @@ import { conversationToMessage } from 'src/chat21-core/utils/utils-message';
 import { ProjectService } from './services/projects/project.service';
 import { ContactsService } from './services/contacts/contacts.service';
 import { TiledeskService } from './services/tiledesk/tiledesk.service';
-import { Project } from 'src/chat21-core/models/projects';
-import { BRAND_BASE_INFO } from './utils/utils-resources';
-import { ProjectUsersService } from './services/project_users/project-users.service';
 
 @Component({
   selector: 'app-root',
@@ -122,6 +119,7 @@ export class AppComponent implements OnInit {
     private navService: NavProxyService,
     // public chatPresenceHandler: ChatPresenceHandler,
     public typingService: TypingService,
+    public uploadService: UploadService,
     public appStorageService: AppStorageService,
 
     // public chatConversationsHandler: ChatConversationsHandler,
@@ -144,7 +142,6 @@ export class AppComponent implements OnInit {
     /**TILEDESK SERVICES */
     private tiledeskService: TiledeskService,
     private projectService: ProjectService,
-    private projectUsersService: ProjectUsersService,
     private contactsService: ContactsService
   ) {
 
@@ -171,7 +168,6 @@ export class AppComponent implements OnInit {
     }, { capture: true });
   }
 
-
   listenChatAlreadyOpenWithoutParamsInMobileMode() {
     this.events.subscribe('noparams:mobile', (isAlreadyOpenInMobileMode) => {
       // console.log('[APP-COMP] Chat is Already Open In Mobile Mode ', isAlreadyOpenInMobileMode)
@@ -300,10 +296,6 @@ export class AppComponent implements OnInit {
         this.zone = new NgZone({}); // a cosa serve?
 
         this.SUPPORT_MODE = this.g.supportMode
-        this.logger.info('[APP-COMP] this.SUPPORT_MODE', this.SUPPORT_MODE)
-
-        BRAND_BASE_INFO['LOGOUT_ENABLED'] = this.g.logOut
-        this.logger.info('[APP-COMP] this.logOut', BRAND_BASE_INFO['LOGOUT_ENABLED'])
       }
 
     });
@@ -340,7 +332,7 @@ export class AppComponent implements OnInit {
 
   listenToPostMsgs() {
     window.addEventListener("message", (event) => {
-      // this.logger.log("[APP-COMP] message event ", event);
+      this.logger.log("[APP-COMP] message event ", event);
 
       if (event && event.data && event.data.action && event.data.parameter) {
         if (event.data.action === 'openJoinConversationModal') {
@@ -542,10 +534,10 @@ export class AppComponent implements OnInit {
       this.statusBar.styleLightContent();
       this.navService.init(this.sidebarNav, this.detailNav);
       this.tiledeskAuthService.initialize(this.appConfigProvider.getConfig().apiUrl);
-      
+      this.messagingAuthService.initialize();
+
       // this.currentUserService.initialize();
       this.chatManager.initialize();
-      this.messagingAuthService.initialize();
       this.presenceService.initialize(this.tenant);
       this.typingService.initialize(this.tenant);
 
@@ -555,6 +547,7 @@ export class AppComponent implements OnInit {
       if (pushEngine && pushEngine !== 'none') {
         this.notificationsService.initialize(this.tenant, vap_id_Key, platform)
       }
+      this.uploadService.initialize();
 
       this.setLanguage(null)
       this.initAuthentication();
@@ -871,8 +864,7 @@ export class AppComponent implements OnInit {
       // console.log('[APP-COMP] PLATFORM', PLATFORM_MOBILE, 'route.snapshot', this.route.snapshot);
       if (!IDConv) {
         this.logger.log('[APP-COMP]  navigateByUrl -- conversations-list');
-        const queryString = window.location.search; // restituisce ad es. "?jwt=...&tiledesk_supportMode=false"
-        this.router.navigateByUrl('conversations-list' + queryString);
+        this.router.navigateByUrl('conversations-list')
       }
       // this.router.navigateByUrl(pageUrl);
       // this.navService.setRoot(ConversationListPage, {});
@@ -1123,19 +1115,13 @@ export class AppComponent implements OnInit {
       if (conversation && conversation.is_new === true && this.isInitialized) {
         this.manageTabNotification('conv_added', conversation.sound)
         this.manageEventNewConversation(conversation)
-        //UPDATE NOTIFICATION FOR NEW CONVERSATION COUNT 
-        this.triggerOnUpdateNewConversationBadge(this.conversationsHandlerService.countIsNew());
       }
       if(conversation) this.updateConversationsOnStorage()
     });
 
     this.conversationsHandlerService.conversationChanged.subscribe((conversation: ConversationModel) => {
       // console.log('[APP-COMP] ***** subscribeConversationChanged conversation: ', conversation);
-      if(conversation){
-        this.updateConversationsOnStorage();
-        //UPDATE NOTIFICATION FOR NEW CONVERSATION COUNT 
-        this.triggerOnUpdateNewConversationBadge(this.conversationsHandlerService.countIsNew());
-      }  
+      if(conversation)  this.updateConversationsOnStorage();
     });
 
     this.conversationsHandlerService.conversationChangedDetailed.subscribe((changes: {value: ConversationModel, previousValue: ConversationModel}) => {
@@ -1163,8 +1149,6 @@ export class AppComponent implements OnInit {
       if(conversation) { 
         this.updateConversationsOnStorage();
         this.segmentResolved(conversation);
-        //UPDATE NOTIFICATION FOR NEW CONVERSATION COUNT 
-        this.triggerOnUpdateNewConversationBadge(this.conversationsHandlerService.countIsNew());
         this.router.navigateByUrl('conversation-detail/'); //redirect to basePage
       }
     });
@@ -1198,7 +1182,6 @@ export class AppComponent implements OnInit {
     this.chatManager.setCurrentUser(currentUser);
 
     this.tiledeskService.initialize(serverBaseURL)
-    this.projectUsersService.initialize(serverBaseURL)
     this.projectService.initialize(serverBaseURL)
     this.contactsService.initialize(serverBaseURL)
 
@@ -1206,14 +1189,11 @@ export class AppComponent implements OnInit {
     this.events.publish('go:online', true);
     // this.chatManager.startApp();
 
-
-    //INIT WEBSOCKET
-    this.connetWebsocket(tiledeskToken)
-
     // ----------------------------------------------
     // PUSH NOTIFICATIONS
     // ----------------------------------------------
     const pushEngine = this.appConfigProvider.getConfig().pushEngine
+
     if (currentUser) {
       if (pushEngine && pushEngine !== 'none') {
         this.notificationsService.getNotificationPermissionAndSaveToken(currentUser.uid);
@@ -1235,24 +1215,6 @@ export class AppComponent implements OnInit {
     } catch (err) {
       this.logger.error('[APP-COMP] -> error:', err);
     }
-
-    // ----------------------------------------------
-    // LAST PROJECT FROM URL
-    // ----------------------------------------------
-    if(this.g.projectID){
-      this.projectService.getProjects().subscribe({ next: (projects: Project[]) => {
-        const project = projects.find(prjct => prjct.id_project._id === this.g.projectID)
-        if(project){
-          this.logger.log('[APP-COMP] - GET PROJECT - project found with this.projectID', project);
-          localStorage.setItem('last_project', JSON.stringify(project)) 
-          this.events.publish('storage:last_project', project)
-        }
-      }, error: (error) => {
-        this.logger.log('[APP-COMP] - GET PROJECT - project NOT found with this.projectID', this.g.projectID, error);
-      }, complete: () => {
-
-      }});
-    }
   }
 
 
@@ -1293,21 +1255,9 @@ export class AppComponent implements OnInit {
   }
 
   goToDashboardLogin(){
-    // let DASHBOARD_URL = this.appConfigProvider.getConfig().dashboardUrl + '#/login'
-    // const myWindow = window.open(DASHBOARD_URL, '_self');
-    // myWindow.focus();
-  }
-
-  connetWebsocket(tiledeskToken) {
-
-    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] tiledeskToken ', tiledeskToken)
-    const appconfig = this.appConfigProvider.getConfig();
-    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] wsUrl ', appconfig.wsUrl)
-    const WS_URL = appconfig.wsUrl + '?token=' + tiledeskToken
-    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] wsUrl ', WS_URL)
-    this.webSocketJs.init(
-      WS_URL
-    );
+    let DASHBOARD_URL = this.appConfigProvider.getConfig().dashboardUrl + '#/login'
+    const myWindow = window.open(DASHBOARD_URL, '_self');
+    myWindow.focus();
   }
 
 
@@ -1406,8 +1356,7 @@ export class AppComponent implements OnInit {
 
   subscribeConversationSelected= (conversation: ConversationModel) => {
     if(conversation && conversation.is_new){
-      this.audio_NewConv.pause();
-      this.conversationsHandlerService.setConversationRead(conversation.uid)
+      this.audio_NewConv.pause()
     }
   }
 
@@ -1483,9 +1432,6 @@ export class AppComponent implements OnInit {
         this.logger.debug('[APP-COMP]-CONVS - INIT CONV CONVS 2', conversations)
         this.events.publish('appcompSubscribeToConvs:loadingIsActive', false);
       }
-
-      //INIT NOTIFICATION FOR NEW CONVERSATION COUNT 
-      this.triggerOnUpdateNewConversationBadge(this.conversationsHandlerService.countIsNew());
     });
 
   }
@@ -1768,11 +1714,6 @@ export class AppComponent implements OnInit {
     this.triggerEvents.triggerOnInit(detailOBJ)
   }
 
-  private triggerOnUpdateNewConversationBadge(count: number){
-    const detailOBJ = { event: 'onUpdateNewConversationBadge', count: count.toString() }
-    this.triggerEvents.triggerOnUpdateNewConversationBadge(detailOBJ)
-  }
-
 
   // @HostListener('mouseenter', ['$event']) 
   // onMouseEnter(event: any) {

package/src/app/chatlib/conversation-detail/message/image/image.component.html

@@ -8,6 +8,5 @@
     [height]="height"
     [src]="metadata.src" 
     (load)="onLoaded($event)" 
-    (error)="onError($event)"
     (click)="openImageViewerModal(metadata.src, metadata.name)" />
 </div>

package/src/app/chatlib/conversation-detail/message/image/image.component.ts

@@ -15,7 +15,6 @@ export class ImageComponent implements OnInit {
   loading: boolean = true
   modal: any
   span: any
-  private readonly fallbackSrc = 'assets/img/no_data_found.png'
 
   constructor() { }
 
@@ -27,24 +26,6 @@ export class ImageComponent implements OnInit {
     this.onElementRendered.emit({element: "image", status:true})
   }
 
-  onError(event: Event) {
-    this.loading = false
-    const img = event?.target as HTMLImageElement | null
-    if (!img) {
-      return
-    }
-    // avoid infinite loop if fallback image fails too
-    if (img.src && img.src.includes(this.fallbackSrc)) {
-      return
-    }
-    img.src = this.fallbackSrc
-    // also update metadata so click-to-open uses the fallback consistently
-    if (this.metadata) {
-      this.metadata.src = this.fallbackSrc
-    }
-    this.onElementRendered.emit({ element: 'image', status: true })
-  }
-
   _downloadImage(url: string, fileName: string) {
     // console.log('Image COMP - IMAGE URL ', url) 
     // console.log('Image COMP - IMAGE FILENAME ', fileName) 

package/src/app/components/canned-response/canned-response.component.html

@@ -1,30 +1,20 @@
 <div>
-  <div class="canned-list" *ngIf="!showLoading">
-    <span *ngIf="tagsCannedFilter.length > 0">
-      <ion-item button="true" [ngClass]="{'is_active_item': i == arrowkeyLocation}" lines="none"
-        class="canned-item no-ripple border" id="{{'canned-item_'+ i }}"
-        *ngFor="let canned of tagsCannedFilter; let i = index;"
-        (click)="onClickCannedFN(canned, $event)">
-        <div class="cannedContent">
-          <ion-input [class.readonly]="canned?.disabled" [readonly]="canned?.disabled" type="text" [(ngModel)]="canned.title" class="title" id="{{'titleCanned_'+canned._id}}" #title></ion-input>
-          <ion-input [class.readonly]="canned?.disabled" [readonly]="canned?.disabled" type="text" [(ngModel)]="canned.text"  class="text truncate"></ion-input>
-        </div>
-        <!-- <ion-icon class="canned-item-icon" name="pin" src="assets/img/pin.svg" slot=end *ngIf="canned.pinned" (click)="onPinCanned(canned, $event)"></ion-icon>
-        <ion-icon class="canned-item-icon" name="pin" src="assets/img/pinned.svg" slot=end (click)="onUnPinCanned(canned, $event)"></ion-icon> -->
-        <ion-icon class="canned-item-icon"  name="checkmark-sharp" slot=end *ngIf="(canned.createdBy === loggedUser.uid && !canned.disabled) && roles[PERMISSIONS.CANNED_RESPONSES_UPDATE]" (click)="onConfirmEditCanned(canned, $event)"></ion-icon>
-        <ion-icon class="canned-item-icon"  name="pencil-sharp" slot=end *ngIf="(canned.createdBy === loggedUser.uid && canned.disabled) && roles[PERMISSIONS.CANNED_RESPONSES_UPDATE]" (click)="onEditCanned(canned, $event)"></ion-icon>
-        <ion-icon class="canned-item-icon"  name="trash-bin-outline" slot=end *ngIf="(canned.createdBy === loggedUser.uid) && roles[PERMISSIONS.CANNED_RESPONSES_DELETE]" (click)="onDeleteCanned(canned, $event)"></ion-icon>
-      </ion-item>
-    </span>
-    <div class="no-data" *ngIf="tagsCannedFilter.length === 0">
-      <div class="container">
-        <ion-item button="false" lines="none" class="canned-item no-ripple border">
-          <ion-icon name="cloud-offline" slot="start"></ion-icon>
-          <ion-label>{{translationMap.get('THERE_ARE_NO_CANNED_RESPONSES_AVAILABLE')}}</ion-label>
-        </ion-item>
+  <div class="canned-list" *ngIf="tagsCannedFilter.length > 0">
+    <ion-item button="true" [ngClass]="{'is_active_item': i == arrowkeyLocation}" lines="none"
+      class="canned-item no-ripple border" id="{{'canned-item_'+ i }}"
+      *ngFor="let canned of tagsCannedFilter; let i = index;"
+      (click)="onClickCannedFN(canned, $event)">
+      <div class="cannedContent">
+        <ion-input [class.readonly]="canned?.disabled" [readonly]="canned?.disabled" type="text" [(ngModel)]="canned.title" class="title" id="{{'titleCanned_'+canned._id}}" #title></ion-input>
+        <ion-input [class.readonly]="canned?.disabled" [readonly]="canned?.disabled" type="text" [(ngModel)]="canned.text"  class="text truncate"></ion-input>
       </div>
-    </div>
-    <ion-item *ngIf="roles[PERMISSIONS.CANNED_RESPONSES_CREATE]" class="canned-item add-canned-response-wpr" button="true" lines="none" (click)="onClickAddCannedResponseFN()">
+      <!-- <ion-icon class="canned-item-icon" name="pin" src="assets/img/pin.svg" slot=end *ngIf="canned.pinned" (click)="onPinCanned(canned, $event)"></ion-icon>
+      <ion-icon class="canned-item-icon" name="pin" src="assets/img/pinned.svg" slot=end (click)="onUnPinCanned(canned, $event)"></ion-icon> -->
+      <ion-icon class="canned-item-icon"  name="checkmark-sharp" slot=end *ngIf="canned.createdBy === loggedUser.uid && !canned.disabled" (click)="onConfirmEditCanned(canned, $event)"></ion-icon>
+      <ion-icon class="canned-item-icon"  name="pencil-sharp" slot=end *ngIf="canned.createdBy === loggedUser.uid && canned.disabled" (click)="onEditCanned(canned, $event)"></ion-icon>
+      <ion-icon class="canned-item-icon"  name="trash-bin-outline" slot=end *ngIf="canned.createdBy === loggedUser.uid" (click)="onDeleteCanned(canned, $event)"></ion-icon>
+    </ion-item>
+    <ion-item  class="canned-item add-canned-response-wpr" button="true" lines="none" (click)="onClickAddCannedResponseFN()">
       <ion-icon class="add-canned-response-icon"  name="flash-outline"></ion-icon>
       <span class="add-canned-response-add-icon">+</span>
      <label class="add-canned-response-label" >{{translationMap?.get('AddNewCannedResponse')}}</label> 
@@ -43,5 +33,12 @@
       <div class="label">{{translationMap.get('LABEL_LOADING')}}</div>
     </div>
   </div>
-  
+  <div class="no-data" *ngIf="tagsCannedFilter.length === 0 && !showLoading">
+    <div class="container">
+      <ion-item button="false" lines="none" class="canned-item no-ripple border">
+        <ion-icon name="cloud-offline" slot="start"></ion-icon>
+        <ion-label>{{translationMap.get('THERE_ARE_NO_CANNED_RESPONSES_AVAILABLE')}}</ion-label>
+      </ion-item>
+    </div>
+  </div>
 </div>

package/src/app/components/canned-response/canned-response.component.scss

@@ -278,5 +278,7 @@ ion-item {
         display: flex;
         justify-content: center;
         flex-direction: column;
+        align-items: center;
+
     }
 }

package/src/app/components/canned-response/canned-response.component.ts

@@ -9,7 +9,6 @@ import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk
 import { compareValues, htmlEntities } from 'src/chat21-core/utils/utils';
 import { getProjectIdSelectedConversation } from 'src/chat21-core/utils/utils-message';
 import { PLAN_NAME } from 'src/chat21-core/utils/constants';
-import { PERMISSIONS } from 'src/app/utils/permissions.constants';
 
 @Component({
   selector: 'app-canned-response',
@@ -22,7 +21,7 @@ export class CannedResponseComponent implements OnInit {
   @Input() conversationWith: string;
   @Input() conversationWithFullname: string;
   @Input() currentString: string;
-  @Input() roles: Array<string>;
+  @Input() canShowCanned: boolean = true;
   @Input() stylesMap: Map<string, string>;
   @Input() translationMap: Map<string, string>;
   @Output() onLoadedCannedResponses = new EventEmitter<[any]>();
@@ -37,7 +36,6 @@ export class CannedResponseComponent implements OnInit {
 
   public arrowkeyLocation = -1
 
-  PERMISSIONS = PERMISSIONS
   
   private logger: LoggerService = LoggerInstance.getInstance();
   constructor(

package/src/app/components/conversation-detail/message-text-area/message-text-area.component.html

@@ -22,13 +22,6 @@
           {{translationMap?.get('WHATSAPP.LABEL_TEMPLATES')}}
         </ion-button>
       </div>
-      <!-- OPEN TICKET -->
-      <div *ngIf="ticketSection" class="section-option" id="template" tooltip="{{translationMap?.get('TICKET.OPEN_TICKET')}}" placement="top">
-        <ion-button fill="clear" [class.active]="section==='ticket'" (click)="onOpenSection('ticket')" [disabled]="channelType === 'direct'">
-          <ion-icon name="ticket"></ion-icon>
-          {{translationMap?.get('TICKET.OPEN_TICKET')}}
-        </ion-button>
-      </div>
     </div>
 
     <div class="footerContainerAlert">
@@ -57,22 +50,6 @@
     </ion-col>
   </ion-row>
 
-  <ion-row id="ticket" [style.display]="section==='ticket'? 'flex': 'none'">
-    <ion-col col-auto>
-      <div class="placeholder">{{translationMap.get('TICKET.DESCRIPTION')}}</div>
-      <div class="buttons-container">
-          <ion-button name="add" size="small" (click)="onClickTicket('open')">
-            <ion-icon name="add"></ion-icon>
-            {{translationMap?.get('TICKET.CONFIRM')}}
-          </ion-button>
-          <ion-button size="small" color="danger" (click)="onClickTicket('close')">
-            <ion-icon name="close"></ion-icon>
-            {{translationMap?.get('TICKET.CLOSE')}}
-          </ion-button>
-      </div>
-    </ion-col>
-  </ion-row>
-
   <ion-row id="message-text-area" [style.display]="section==='chat' || section ==='templates' || section ==='copilot'? 'flex': 'none'">
 
     <ion-col col-auto style="display: flex;">
@@ -80,7 +57,7 @@
       <div class="buttons-left">
 
         <!-- CANNED RESPONSES -->
-        <ng-container *ngIf="areVisibleCAR && supportMode && cannedSection">
+        <ng-container *ngIf="areVisibleCAR && supportMode">
           <div class="canned-responses-btn-wpr" tooltip="{{translationMap?.get('CANNED_RESPONSES')}}" placement="top">
             <ion-button ion-button fill="clear" class="canned-responses-btn" (click)="openCannedResponses()"
               [disabled]="!conversationWith?.startsWith(CHANNEL_TYPE.SUPPORT_GROUP) || disableTextarea">

package/src/app/components/conversation-detail/message-text-area/message-text-area.component.scss

@@ -183,36 +183,6 @@
     }
 }
 
-#ticket{
-    text-align: center;
-    font-size: 12px;
-
-    .buttons-container{
-        display: flex;
-        justify-content: center;
-        gap: 10px;
-
-        ion-button{
-            font-size: 12px;
-            --padding-top: 4px;
-            --padding-bottom: 4px;
-            --padding-start: 6px;
-            --padding-end: 6px;
-            --ripple-color: transparent;
-            text-transform: unset;
-            height: auto;
-
-            ion-icon{
-                margin-right: 4px;
-            }
-
-            &[name="add"]{
-                --background: var(--basic-blue);
-            }
-        }
-    }
-}
-
 #fileInput {
     position: absolute;
     opacity: 0;