add text elips and

src/app/ui/chat/chat.page.html

@@ -38,12 +38,6 @@
             </ion-segment-button>
           </ion-segment>
         </ion-toolbar>
-
-        <!-- <div  *ngFor="let room of roomsWithLastMessages">
-          {{ room.name }} == {{ room.lastMessage.message }}
-        </div> -->
-
-
         <div class=" aside overflow-y-auto d-flex flex-wrap flex-grow-1">
           <div class="width-100">
             <div  class="item item-hover width-100 d-flex ion-no-padding ion-no-margin"
@@ -62,11 +56,11 @@
              <div
               (click)="openMessagesPage(room.id)" class="item-content flex-grow-1 cursor-pointer"><!-- (click)="openMessages(dm)" -->
               <div class="item-title-time">
-                <div class="item-title" [class.item-title-active]="room.id == idSelected">
+                <div class="item-title add-ellipsis"  [class.item-title-active]="room.id == idSelected">
                   <ion-label >
                     <span >
                       <div >
-                        <div class="font-15-em"  [class.bold-message]="boldTable?.[room.id]?.bold">
+                        <div class="font-15-em add-ellipsis"  [class.bold-message]="boldTable?.[room.id]?.bold">
                           {{room.roomName}}
                         </div>
                       </div>

src/app/ui/chat/modal/messages/messages.page.ts

@@ -144,7 +144,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
   isAdmin = true
   RoomTypeEnum = RoomType
   IMessageType = IMessageType
-  handleClickActive = true
+  handleClickActive = false
 
   constructor(
     public popoverController: PopoverController,
@@ -222,7 +222,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
   @HostListener('document:click', ['$event'])
   handleClickOutside(event: Event) {
     if (!this.handleClickActive) return;
-
+    this.handleClickActive = false
     const clickedInside = (event.target as HTMLElement).closest('.mat-menu-content');
     if (!clickedInside) {
       this.selectedMessage = null;
@@ -1465,6 +1465,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
     if (this.selectedMessage === message) {
       this.selectedMessage = null; // Close the picker if it's already open
     } else {
+      this.handleClickActive = true
       this.selectedMessage =  message; // Open the picker for the selected message
     }
   }

src/style/ios.scss

@@ -241,6 +241,6 @@ ion-toolbar {
 /* Media query for mobile view */
 @media (max-width: 768px) { /* Adjust the max-width as per your mobile breakpoints */
   .edit-message::part(content) {
-    width: 360px !important; /* Set width to 300px for mobile screens */
+    width: 300px !important; /* Set width to 300px for mobile screens */
   }
 }