@chat21/chat21-ionic 3.4.31 → 3.4.32-rc10

package/src/app/modals/create-ticket/create-ticket.page.ts

@@ -9,6 +9,7 @@ import * as uuid from 'uuid';
 import { EventsService } from 'src/app/services/events-service'
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
+import { ProjectUsersService } from 'src/app/services/project_users/project-users.service'
 
 @Component({
   selector: 'app-create-ticket',
@@ -64,6 +65,7 @@ export class CreateTicketPage implements OnInit {
   logger: LoggerService = LoggerInstance.getInstance();
   constructor(
     public modalController: ModalController,
+    public projectUsersService: ProjectUsersService,
     public tiledeskService: TiledeskService,
     public appConfigProvider: AppConfigProvider,
     public events: EventsService
@@ -104,7 +106,7 @@ export class CreateTicketPage implements OnInit {
   // Create the array of the project-users and contacts displayed in the combo box  "Requester"
   // -------------------------------------------------------------------------------------------
   getProjectUsersAndContacts(projctid: string) {
-    const projectUsers = this.tiledeskService.getProjectUsersByProjectId(projctid)
+    const projectUsers = this.projectUsersService.getProjectUsersByProjectId(projctid)
     const leads = this.tiledeskService.getAllLeadsActiveWithLimit(projctid,10000)
 
     zip(projectUsers, leads).subscribe(
@@ -243,7 +245,7 @@ export class CreateTicketPage implements OnInit {
   // -------------------------------------------------------------------------------------------------------------------
   getProjectUserBotsAndDepts(projctid: string) {
     // this.loadingAssignee = true;
-    const projectUsers = this.tiledeskService.getProjectUsersByProjectId( projctid)
+    const projectUsers = this.projectUsersService.getProjectUsersByProjectId( projctid)
     const bots = this.tiledeskService.getAllBotByProjectId(projctid)
     const depts = this.tiledeskService.getDeptsByProjectId(projctid)
 

package/src/app/pages/conversation-detail/conversation-detail.page.html

@@ -173,7 +173,7 @@
             <!-- ----------------------------------------------------------- -->
             <app-canned-response *ngIf="SHOW_CANNED_RESPONSES"
               id="canned"
-              [canShowCanned]="canShowCanned"
+              [roles]="rolesCanned"
               [conversationWith]="conversationWith"
               [conversationWithFullname]="conversationWithFullname"
               [currentString]="messageStr"
@@ -201,7 +201,8 @@
             <!-- [tagsCannedFilter]="tagsCannedFilter" -->
             <!-- openInfoConversation   {{openInfoConversation}} - isMobile {{isMobile}} -->
             <app-message-text-area *ngIf="(openInfoConversation === false && isMobile === true) || (openInfoConversation === true && isMobile === false) || (openInfoConversation === false && isMobile === false)"
-              [loggedUser]="loggedUser" 
+              [loggedUser]="loggedUser"
+              [projectUser]="projectUser"
               [conversationWith]="conversationWith" 
               [channelType]="channelType"
               [channel]="conversation?.attributes?.request_channel"
@@ -213,8 +214,10 @@
               [fileUploadAccept]="fileUploadAccept"
               [emailSection]="isEmailEnabled"
               [offlineMsgEmail]="offlineMsgEmail"
+              [cannedSection]="canShowCanned"
               [whatsappTemplatesSection]="isWhatsappTemplatesEnabled"
               [isOpenInfoConversation]="openInfoConversation" 
+              [ticketSection]="isTicketEnabled"
               [stylesMap]="styleMap"
               [translationMap]="translationsMap"
               [dropEvent]="dropEvent"
@@ -223,7 +226,8 @@
               (onClickOpenCannedResponses)="onClickOpenCannedResponses($event)"
               (eventSendMessage)="returnSendMessage($event)" 
               (onPresentModalScrollToBottom)="onPresentModalScrollToBottom($event)"
-              (onOpenFooterSection)="onOpenFooterSection($event)">
+              (onOpenFooterSection)="onOpenFooterSection($event)"
+              (onOpenTicket)="onOpenTicket($event)">
             </app-message-text-area>
             <!-- [events]="eventsReplaceTexareaText.asObservable()" -->
           </ion-row>

package/src/app/pages/conversation-detail/conversation-detail.page.ts

@@ -83,8 +83,12 @@ import { WebsocketService } from 'src/app/services/websocket/websocket.service';
 import { Project } from 'src/chat21-core/models/projects';
 import { Globals } from 'src/app/utils/globals';
 import { ProjectService } from 'src/app/services/projects/project.service';
-import { getOSCode } from 'src/app/utils/utils';
 import { UploadService } from 'src/chat21-core/providers/abstract/upload.service';
+import { ProjectUsersService } from 'src/app/services/project_users/project-users.service';
+import { ProjectUser } from 'src/chat21-core/models/projectUsers';
+import { getOSCode, hasRole } from 'src/app/utils/utils';
+import { PERMISSIONS } from 'src/app/utils/permissions.constants';
+import { TriggerEvents } from 'src/app/services/triggerEvents/triggerEvents';
 
 @Component({
   selector: 'app-conversation-detail',
@@ -109,6 +113,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   private subscriptions: Array<any>
   public tenant: string;
   public loggedUser: UserModel
+  public projectUser: ProjectUser;
   public conversationWith: string
   public conversationWithFullname: string
   public messages: Array<MessageModel> = []
@@ -138,6 +143,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   public tagsCannedFilter: Array<any> = [];
   public SHOW_CANNED_RESPONSES: boolean = false
   public canShowCanned: boolean = true
+  public rolesCanned: { [key: string]: boolean }
 
   public SHOW_COPILOT_SUGGESTIONS: boolean = false;
 
@@ -172,6 +178,10 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   copilotQuestion: string = '';
   /**COPILOT : end */
 
+  /** TICKET: start */
+  isTicketEnabled: boolean = false;
+  /** TICKET: end */
+
   isMine = isMine
   isInfo = isInfo
   isFirstMessage = isFirstMessage
@@ -242,18 +252,20 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     public toastController: ToastController,
     public tiledeskService: TiledeskService,
     public projectService: ProjectService,
+    public projectUsersService: ProjectUsersService,
     private networkService: NetworkService,
     private events: EventsService,
     private webSocketService: WebsocketService,
     public projectPlanUtils: ProjectPlanUtils,
+    public triggerEvents: TriggerEvents,
     private g: Globals,
   ) {
     // Change list on date change
     this.route.paramMap.subscribe((params) => {
       this.logger.log('[CONVS-DETAIL] - constructor -> params: ', params)
       this.conversationWith = params.get('IDConv')
-      this.conversationWithFullname = params.get('FullNameConv')
-      this.conv_type = params.get('Convtype')
+      this.conversationWithFullname = decodeURIComponent(params.get('FullNameConv'))
+      this.conv_type = decodeURIComponent(params.get('Convtype'))
 
       this.events.publish('supportconvid:haschanged', this.conversationWith)
     })
@@ -420,6 +432,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   ionViewDidEnter() {
     this.logger.log('[CONVS-DETAIL] > ionViewDidEnter')
     // this.info_content_child_enabled = true;
+    // Scroll to bottom to show the last message without animation
+    this.scrollToLastMessage()
   }
 
   // Unsubscibe when new page transition end
@@ -479,6 +493,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     this.messages = [] // list messages of conversation
     this.isFileSelected = false // indicates if a file has been selected (image to upload)
     this.isEmailEnabled = (this.appConfigProvider.getConfig().emailSection === 'true' || this.appConfigProvider.getConfig().emailSection === true) ? true : false;
+    this.isTicketEnabled = (this.appConfigProvider.getConfig().ticketSection === 'true' || this.appConfigProvider.getConfig().ticketSection === true) ? true : false;
     this.isWhatsappTemplatesEnabled = (this.appConfigProvider.getConfig().whatsappTemplatesSection === 'true' || this.appConfigProvider.getConfig().whatsappTemplatesSection === true) ? true : false;
     this.fileUploadAccept = this.appConfigProvider.getConfig().fileUploadAccept
     
@@ -538,7 +553,6 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
         this.logger.log('[CONVS-DETAIL] - GET PROJECTID BY CONV RECIPIENT * COMPLETE *',)
       })
     }else {
-      this.canShowCanned = false;
       this.offlineMsgEmail = false;
     }
     
@@ -549,10 +563,13 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       this.logger.log('[CONVS-DETAIL] - GET PROJECTID BY CONV RECIPIENT RES', project)
       if (project) {
         const projectId = project.id_project
-        this.canShowCanned = this.projectPlanUtils.checkPlanIsExpired(project)
+        this.projectUser = await this.projectUsersService.getProjectUserByProjectId(project._id)
         this.offlineMsgEmail = this.checkOfflineMsgEmailIsEnabled(project)
         this.isCopilotEnabled = this.projectPlanUtils.checkProjectProfileFeature(project, 'copilot');
         this.fileUploadAccept = this.checkAcceptedUploadFile(project)
+        this.rolesCanned = this.checkCannedResponsesRoles()
+        this.canShowCanned = this.checkCannedResponses(project)
+        this.logger.log('[CONVS-DETAIL] this.rolesCanned ', this.canShowCanned)
       }
     }, (error) => {
       this.logger.error('[CONVS-DETAIL] - GET PROJECTID BY CONV RECIPIENT - ERROR  ', error)
@@ -590,6 +607,40 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     return this.appConfigProvider.getConfig().fileUploadAccept
   }
 
+  checkCannedResponses(project: Project): boolean {
+    let expires = this.projectPlanUtils.checkPlanIsExpired(project)
+    this.logger.log('[CONVS-DETAIL] checkCannedResponses expires ', expires)
+    if(expires){
+      return false
+    }
+
+    let hasRoleToShowCanned = this.rolesCanned[PERMISSIONS.CANNED_RESPONSES_READ]
+    this.logger.log('[CONVS-DETAIL] checkCannedResponses hasRoleToShowCanned ', hasRoleToShowCanned)
+    if(!hasRoleToShowCanned){
+      return false
+    }
+
+    return true
+  }
+
+  checkCannedResponsesRoles(): { [key: string]: boolean } {
+    const permissionKeys = [
+      'CANNED_RESPONSES_CREATE',
+      'CANNED_RESPONSES_READ',
+      'CANNED_RESPONSES_UPDATE',
+      'CANNED_RESPONSES_DELETE',
+    ] as const;
+
+    const roles: { [key: string]: boolean } = {};
+    for (const key of permissionKeys) {
+      const permission = PERMISSIONS[key];
+      roles[permission] = hasRole(this.projectUser, permission);
+    }
+
+    return roles;
+
+  }
+
   // getProjectIdSelectedConversation(conversationWith: string): string{
   //   const conversationWith_segments = conversationWith.split('-')
   //   // Removes the last element of the array if is = to the separator
@@ -673,6 +724,11 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       "WHATSAPP.ERROR_WHATSAPP_NOT_INSTALLED",
       "WHATSAPP.ERROR_WHATSAPP_GENERIC_ERROR",
 
+      "TICKET.OPEN_TICKET",
+      "TICKET.DESCRIPTION",
+      "TICKET.CONFIRM",
+      "TICKET.CLOSE",
+
       "COPILOT.ASK_AI",
       "COPILOT.NO_SUGGESTIONS_PRESENT",
 
@@ -1888,6 +1944,11 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   }
 
 
+  onOpenTicket(event) {
+    this.logger.debug('[CONVS-DETAIL] openTicketOnExternalService - conversationWith ', this.conversationWith)
+    const detailOBJ = { event: 'onOpenTicketExternally', request_id: this.conversationWith, conversation: this.conversation }
+    this.triggerEvents.triggerOnOpenTicketExternally(detailOBJ)
+  }
   // -------------- START SCROLL/RESIZE  -------------- //
   /** */
   resizeTextArea() {
@@ -1931,6 +1992,29 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
   }
 
+  /**
+   * Scroll to last message without animation using requestAnimationFrame
+   * This is a best practice alternative to setTimeout
+   */
+  private scrollToLastMessage() {
+    this.showIonContent = true
+    if (this.ionContentChatArea) {
+      // Use requestAnimationFrame for better performance
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          // Double RAF ensures DOM is fully rendered
+          this.ionContentChatArea.scrollToBottom(0).then(() => {
+            this.logger.log('[CONVS-DETAIL] scroll posizionato all\'ultimo messaggio')
+          }).catch((error) => {
+            this.logger.error('[CONVS-DETAIL] errore durante lo scroll:', error)
+          })
+        })
+      })
+    } else {
+      this.logger.warn('[CONVS-DETAIL] ionContentChatArea non disponibile')
+    }
+  }
+
   /**
    * detectBottom
    */

package/src/app/pages/conversations-list/conversations-list.module.ts

@@ -19,8 +19,7 @@ import { ProfileInfoPageModule } from '../profile-info/profile-info.module';
 // import { ConversationDetailPageModule } from '../conversation-detail/conversation-detail.module';
 import { SharedModule } from 'src/app/shared/shared.module';
 import { ScrollbarThemeModule } from '../../utils/scrollbar-theme.directive';
-import { ListConversationsComponent } from 'src/app/chatlib/list-conversations-component/list-conversations/list-conversations.component';
-import { IonListConversationsComponent } from 'src/app/chatlib/list-conversations-component/ion-list-conversations/ion-list-conversations.component';
+import { ListConversationsModule } from 'src/app/chatlib/list-conversations-component/list-conversations.module';
 import { HeaderConversationsList } from 'src/app/components/conversations-list/header-conversations-list/header-conversations-list.component';
 import { HeaderConversationsListArchived } from 'src/app/components/conversations-list/header-conversations-list-archived/header-conversations-list-archived.component';
 import { HeaderConversationsListUnassigned } from 'src/app/components/conversations-list/header-conversations-list-unassigned/header-conversations-list-unassigned.component';
@@ -46,14 +45,13 @@ import { MomentModule } from 'ngx-moment';
       }
     }),
     SharedModule,
-    MomentModule
+    MomentModule,
+    ListConversationsModule
   ],
   // entryComponents: [DdpHeaderComponent],
   declarations: [
     ConversationListPage,
     //******** COMPONENTS - init ********//
-    ListConversationsComponent,
-    IonListConversationsComponent,
     HeaderConversationsList,
     HeaderConversationsListArchived,
     HeaderConversationsListUnassigned,

package/src/app/pages/conversations-list/conversations-list.page.html

@@ -7,6 +7,8 @@
     [sound_btn]="sound_btn"
     [isMobile]="isMobile"
     [isVisibleTKT]="isVisibleTKT"
+    [isVisibleCNT]="isVisibleCNT"
+    [roles]="rolesHeader"
     (onSoundChange)="onSoundChange($event)"
     (openContactsDirectory)=openContactsDirectory($event) 
     (openProfileInfo)=openProfileInfo($event)>

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

@@ -53,7 +53,13 @@ import { Globals } from 'src/app/utils/globals';
 import { TriggerEvents } from 'src/app/services/triggerEvents/triggerEvents';
 import { MessageModel } from 'src/chat21-core/models/message';
 import { Project } from 'src/chat21-core/models/projects';
-import { getOSCode } from 'src/app/utils/utils';
+import { getOSCode, hasRole } from 'src/app/utils/utils';
+import { PERMISSIONS } from 'src/app/utils/permissions.constants';
+import { ProjectUser } from 'src/chat21-core/models/projectUsers';
+import { ProjectUsersService } from 'src/app/services/project_users/project-users.service';
+import { ProjectService } from 'src/app/services/projects/project.service';
+
+import { PROJECTS_STORAGE_KEY } from 'src/chat21-core/utils/constants';
 
 @Component({
   selector: 'app-conversations-list',
@@ -82,6 +88,7 @@ export class ConversationListPage implements OnInit {
   public archived_btn: boolean
   public sound_btn: string
   public isVisibleTKT: boolean = true;
+  public isVisibleCNT: boolean = true;;
   public convertMessage = convertMessage
   private isShowMenuPage = false
   private logger: LoggerService = LoggerInstance.getInstance()
@@ -104,6 +111,9 @@ export class ConversationListPage implements OnInit {
   public isMobile: boolean = false;
   public isInitialized: boolean = false;
 
+  public projectUser: ProjectUser;
+  public rolesHeader: { [key: string]: boolean }
+
   // PROJECT AVAILABILITY INFO: start
   project: Project
   profile_name_translated: string;
@@ -130,10 +140,14 @@ export class ConversationListPage implements OnInit {
     private translateService: CustomTranslateService,
     public tiledeskService: TiledeskService,
     public tiledeskAuthService: TiledeskAuthService,
+    public projectUsersService: ProjectUsersService,
+    public projectService: ProjectService,
     public appConfigProvider: AppConfigProvider,
     public platform: Platform,
     public wsService: WebsocketService,
     public g: Globals,
+    public appStorageService: AppStorageService,
+    private triggerEvents: TriggerEvents,
   ) {
     this.checkPlatform();
     this.translations();
@@ -207,8 +221,45 @@ export class ConversationListPage implements OnInit {
   // @ Lifehooks
   // -----------------------------------------------
   ngOnInit() {
-    this.getAppConfigToHideDiplayBtns()
+    this.getAppConfigToHideDiplayBtns();
     this.getOSCODE();
+    this.loadAndStoreProjects();
+  }
+
+  /**
+   * Recupera tutti i progetti con getProjects e li salva in AppStorage.
+   * Prima di salvare verifica che la chiave non esista già e che non contenga già ogni singolo progetto.
+   */
+  private loadAndStoreProjects() {
+    const token = this.tiledeskAuthService.getTiledeskToken();
+    if (!token) return;
+    this.projectService.getProjects().subscribe((projects: Project[]) => {
+        if (!projects?.length) return;
+        let projectsMap: Record<string, Project> = {};
+        const stored = this.appStorageService.getItem(PROJECTS_STORAGE_KEY);
+        if (stored) {
+          try {
+            projectsMap = JSON.parse(stored) || {};
+          } catch (e) {
+            this.logger.warn('[CONVS-LIST-PAGE] loadAndStoreProjects - failed to parse stored projects', e);
+          }
+        }
+        let hasChanges = false;
+        projects.forEach((project) => {
+          const projectId =  project.id_project?._id || project.id_project?.id;
+          if (!projectId) return;
+          if (!projectsMap[projectId]) {
+            projectsMap[projectId] = project.id_project;
+            hasChanges = true;
+          }
+        });
+        if (hasChanges) {
+          this.appStorageService.setItem(PROJECTS_STORAGE_KEY, JSON.stringify(projectsMap));
+          this.logger.log('[CONVS-LIST-PAGE] loadAndStoreProjects - saved', Object.keys(projectsMap).length, 'projects');
+        }
+      },
+      (err) => this.logger.error('[CONVS-LIST-PAGE] loadAndStoreProjects - error', err)
+    );
   }
 
   ngOnChanges() {
@@ -294,17 +345,19 @@ export class ConversationListPage implements OnInit {
   // ---------------------------------------------------------
   // Opens the Unassigned Conversations iframe
   // ---------------------------------------------------------
-  openUnassignedConversations(IFRAME_URL: string, event) {
+  openUnassignedConversations(IFRAME_URL: string, event: { event: string; data: ConversationModel[] }) {
+    const unassignedConversations = event?.data ?? [];
+    const params = {
+      iframe_URL: IFRAME_URL,
+      callerBtn: event.event,
+      unassignedConversations,
+      stylesMap: this.stylesMap,
+      translationMapConversation: this.translationMapConversation,
+    };
     if (checkPlatformIsMobile()) {
-      presentModal(this.modalController, UnassignedConversationsPage, {
-        iframe_URL: IFRAME_URL,
-        callerBtn: event,
-      })
+      presentModal(this.modalController, UnassignedConversationsPage, params);
     } else {
-      this.navService.push(UnassignedConversationsPage, {
-        iframe_URL: IFRAME_URL,
-        callerBtn: event,
-      })
+      this.navService.push(UnassignedConversationsPage, params);
     }
   }
 
@@ -371,6 +424,11 @@ export class ConversationListPage implements OnInit {
     // save conversationHandler in chatManager
     this.chatManager.setConversationsHandler(this.conversationsHandlerService)
     this.showPlaceholder = false
+    
+    // Hide loading spinner if there are no conversations
+    if (this.conversations.length === 0) {
+      this.loadingIsActive = false
+    }
   }
 
   // private manageStoredConversations() {
@@ -471,7 +529,7 @@ export class ConversationListPage implements OnInit {
   }
 
   listenToCurrentStoredProject() {
-    this.events.subscribe('storage:last_project', projectObjct => {
+    this.events.subscribe('storage:last_project', async(projectObjct) => {
       if (projectObjct && projectObjct !== 'undefined') {
         this.logger.log('[CONVS-LIST-PAGE] - GET STORED PROJECT ', projectObjct)
 
@@ -496,6 +554,10 @@ export class ConversationListPage implements OnInit {
         } else if (this.project.profile.type === 'payment' && this.project.profile.name === 'enterprise') {
           this.profile_name_translated = this.translationMapHeader.get('PaydPlanNameEnterprise');
         }
+
+        this.projectUser = await this.projectUsersService.getProjectUserByProjectId(this.project._id)
+        this.rolesHeader = this.checkCannedResponsesRoles();
+        this.logger.log('[CONVS-LIST-PAGE] - GET PROJECT USER ROLES ', this.rolesHeader)
       }
     })
   }
@@ -631,8 +693,24 @@ export class ConversationListPage implements OnInit {
     const public_Key = this.appConfigProvider.getConfig().t2y12PruGU9wUtEGzBJfolMIgK
     this.logger.log('[CONVS-LIST-PAGE] AppConfigService getAppConfig public_Key', public_Key)
     this.isVisibleTKT = getOSCode("TKT", public_Key);
+    this.isVisibleCNT = getOSCode("CNT", public_Key);
   }
 
+  checkCannedResponsesRoles(): { [key: string]: boolean } {
+      const permissionKeys = [
+        'LEADS_READ',
+      ] as const;
+  
+      const roles: { [key: string]: boolean } = {};
+      for (const key of permissionKeys) {
+        const permission = PERMISSIONS[key];
+        roles[permission] = hasRole(this.projectUser, permission);
+      }
+  
+      return roles;
+  
+    }
+
   onBackButtonFN(event) {
     this.conversationType = 'active'
 
@@ -760,6 +838,7 @@ export class ConversationListPage implements OnInit {
       this.logger.log('[CONVS-LIST-PAGE] onConversationSelected active conversation.uid ', conversation.uid)
       this.events.publish('convList:onConversationSelected', conversation)
     }
+    this.triggerEvents.triggerOnConversationChanged(conversation)
   }
 
   onImageLoaded(conversation: any) {
@@ -827,22 +906,32 @@ export class ConversationListPage implements OnInit {
       }
     }
     
-    if(conversation.attributes && conversation.attributes['projectId']){
-      let project = localStorage.getItem(conversation.attributes['projectId'])
-      if(project){
-        project = JSON.parse(project)
-        conversation.attributes.project_name = project['name']
-      }
-    }else if(conversation.attributes){
-      const projectId = getProjectIdSelectedConversation(conversation.uid)
-      let project = localStorage.getItem(projectId)
-      if(project){
-        project = JSON.parse(project)
-        conversation.attributes.projectId = project['_id']
-        conversation.attributes.project_name = project['name']
-      }
+    const project = this.getProjectFromStorage(conversation);
+    if (project) {
+      if (!conversation.attributes) conversation.attributes = {};
+      conversation.attributes.projectId = project._id;
+      conversation.attributes.project_name = project.name;
     }
+  }
 
+  /** Recupera il progetto dalla chiave di storage (all_projects) */
+  private getProjectFromStorage(conversation: ConversationModel): Project | null {
+    let projectId: string | undefined;
+    if (conversation.attributes?.['projectId']) {
+      projectId = conversation.attributes['projectId'];
+    } else if (conversation.attributes) {
+      projectId = getProjectIdSelectedConversation(conversation.uid);
+    }
+    if (!projectId) return null;
+    const stored = this.appStorageService.getItem(PROJECTS_STORAGE_KEY);
+    this.logger.log('[CONVS-LIST-PAGE] getProjectFromStorage - stored', stored);
+    if (!stored) return null;
+    try {
+      const projectsMap: Record<string, Project> = JSON.parse(stored);
+      return projectsMap[projectId] || null;
+    } catch {
+      return null;
+    }
   }
 
   // isMarkdownLink(last_message_text) {
@@ -883,6 +972,10 @@ export class ConversationListPage implements OnInit {
 
     this.logger.log('[CONVS-LIST-PAGE] navigateByUrl this.uidConvSelected ', this.uidConvSelected)
 
+    const queryParams = this.route.snapshot.queryParams;
+    const queryString = new URLSearchParams(queryParams).toString();
+    
+
     this.setUidConvSelected(uidConvSelected, converationType)
     if (checkPlatformIsMobile()) {
       this.logger.log('[CONVS-LIST-PAGE] checkPlatformIsMobile(): ', checkPlatformIsMobile())
@@ -900,6 +993,7 @@ export class ConversationListPage implements OnInit {
       if (this.conversationSelected && this.conversationSelected.conversation_with_fullname) {
         pageUrl = 'conversation-detail/' + this.uidConvSelected + '/' + encodeURIComponent(this.conversationSelected.conversation_with_fullname) + '/' + converationType
       }
+      pageUrl += queryString ? `?${queryString}` : '';
       this.logger.log('[CONVS-LIST-PAGE] setUidConvSelected navigateByUrl--->: ', pageUrl)
       // replace(/\(/g, '%28').replace(/\)/g, '%29') -> used for the encoder of any round brackets
       this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29'), {replaceUrl: true})

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

@@ -1,22 +1,34 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
+import { HttpClient } from '@angular/common/http';
 
 import { IonicModule } from '@ionic/angular';
+import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
+import { createTranslateLoader } from 'src/chat21-core/utils/utils';
 
 import { UnassignedConversationsPageRoutingModule } from './unassigned-conversations-routing.module';
 
 import { UnassignedConversationsPage } from './unassigned-conversations.page';
+import { ListConversationsModule } from 'src/app/chatlib/list-conversations-component/list-conversations.module';
+import { MomentModule } from 'ngx-moment';
 
 @NgModule({
   imports: [
     CommonModule,
     FormsModule,
     IonicModule,
-    UnassignedConversationsPageRoutingModule
+    UnassignedConversationsPageRoutingModule,
+    MomentModule,
+    ListConversationsModule,
+    TranslateModule.forChild({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: createTranslateLoader,
+        deps: [HttpClient],
+      },
+    }),
   ],
-  declarations: [
-    UnassignedConversationsPage,
-  ]
+  declarations: [UnassignedConversationsPage]
 })
 export class UnassignedConversationsPageModule {}

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

@@ -1,27 +1,53 @@
-<ion-header>
-  <ion-toolbar [class.mobile]="isMobile">
-    <ion-buttons slot="start">
-      <ion-button ion-button fill="clear" (click)="onClose()">
-        <ion-icon slot="icon-only" name="close"></ion-icon>
-      </ion-button>
-    </ion-buttons>
-    <ion-title *ngIf="callerBtn !== 'pinbtn'" style="font-size: 16px;">
-      {{translationMap?.get('UnassignedConversations') }}
-    </ion-title>
-    <ion-title *ngIf="callerBtn === 'pinbtn'" style="font-size: 16px;">
-      {{translationMap?.get('PIN_A_PROJECT') }}
-    </ion-title>
-  </ion-toolbar>
-</ion-header>
+<ion-toolbar [class.mobile]="isMobile">
+  <ion-title *ngIf="callerBtn !== 'pinbtn'" style="font-size: 16px;">
+    {{translationMap?.get('UnassignedConversations') }}
+  </ion-title>
+  <ion-title *ngIf="callerBtn === 'pinbtn'" style="font-size: 16px;">
+    {{translationMap?.get('PIN_A_PROJECT') }}
+  </ion-title>
+
+  <ion-buttons slot="end">
+    <ion-button ion-button fill="clear" (click)="onClose()">
+      <ion-icon slot="icon-only" name="close"></ion-icon>
+    </ion-button>
+  </ion-buttons>
+
+</ion-toolbar>
 
 <ion-content overflow-scroll="true" id="iframe-ion-content"
   [ngClass]="{'ion-content-black-background' : isProjectsForPanel === true}">
-  <!-- <iframe  id="i_frame"  style="width:100%; height:99%" frameBorder="0" allowfullscreen [src]="unassigned_convs_url_sanitized"></iframe> -->
-  <div class="loader-spinner-wpr">
+  <div *ngIf="callerBtn === 'pinbtn'" class="loader-spinner-wpr">
     <div id="loader" class="loader">
       <svg class="circular" viewBox="25 25 50 50">
         <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10" />
       </svg>
     </div>
   </div>
+
+  <div *ngIf="callerBtn !== 'pinbtn'" class="list-avatar-page">
+    <ion-list>
+      <ng-container *ngIf="unassignedConversationsList.length > 0; else noConvs">
+        <ion-list-conversations
+          [listConversations]="unassignedConversationsList"
+          [stylesMap]="stylesMap"
+          [translationMap]="translationMapConversation"
+          [uidConvSelected]="uidConvSelected"
+          (onConversationSelected)="onConversationSelected($event)"
+          (onCloseConversation)="onCloseConversation($event)"
+          (onJoinConversation)="onJoinConversation($event)"
+          (onImageLoaded)="onImageLoaded($event)"
+          (onConversationLoaded)="onConversationLoaded($event)">
+        </ion-list-conversations>
+      </ng-container>
+      <ng-template #noConvs>
+        <div class="no-convs-container">
+          <ion-item id="no-convs" class="ion-text-center" lines="none">
+            <ion-label class="ion-text-wrap" color="medium">
+              {{ 'LABEL_MSG_PUSH_START_CHAT' | translate }}
+            </ion-label>
+          </ion-item>
+        </div>
+      </ng-template>
+    </ion-list>
+  </div>
 </ion-content>