show rooms

src/app/pages/chat/chat.page.ts

@@ -17,7 +17,7 @@ import { MessagesPage } from './messages/messages.page';
 import { NewGroupPage } from './new-group/new-group.page';
 import { EditGroupPage } from 'src/app/shared/chat/edit-group/edit-group.page';
 import { Observable, Subject } from "rxjs/Rx";
-import { NavigationStart, Router, NavigationEnd, ActivatedRoute } from '@angular/router';
+import { Router, NavigationEnd, ActivatedRoute } from '@angular/router';
 import { EventPerson } from 'src/app/models/eventperson.model';
 import { removeDuplicate } from 'src/plugin/removeDuplicate.js'
 import { environment } from 'src/environments/environment';
@@ -343,6 +343,8 @@ export class ChatPage implements OnInit {
   }
   openMessagesPage(rid) {
 
+    console.log('rid', rid);
+
     // this.chatService.refreshtoken();
     this.roomId = rid;
 
@@ -355,6 +357,7 @@ export class ChatPage implements OnInit {
       this.showEmptyComponent = false;
       this.showMessages = true;
     }
+
   }
   openContactsPage() {
     this.segment = 'Contactos';
@@ -920,4 +923,3 @@ export class ChatPage implements OnInit {
 
 
 }
-

src/app/services/Repositorys/chat/data-source/message/message-local-data-source.service.ts

@@ -0,0 +1,63 @@
+import { Injectable } from '@angular/core';
+import { AddMemberToRoomInputDTO } from '../../dto/room/addMemberToRoomInputDto';
+import { RoomListOutPutDTO } from '../../dto/room/roomListOutputDTO';
+import { Dexie, EntityTable, liveQuery } from 'Dexie';
+import { err, ok } from 'neverthrow';
+import { Observable } from 'rxjs';
+import { RoomOutPutDTO } from '../../dto/room/roomOutputDTO';
+import { z } from 'zod';
+import { MessageInputDTO } from '../../dto/message/messageInputDtO';
+
+
+const tableSchema = z.object({
+  id: z.any().optional(),
+  roomId: z.string().uuid(),
+  senderId: z.number(),
+  message: z.string(),
+  messageType: z.number(),
+  canEdit: z.boolean(),
+  oneShot: z.boolean(),
+  requireUnlock: z.boolean(),
+})
+
+export type TableMessage = z.infer<typeof tableSchema>
+
+// Database declaration (move this to its own module also)
+export const messageDataSource = new Dexie('chat-message') as Dexie & {
+  message: EntityTable<TableMessage, 'id'>;
+};
+
+messageDataSource.version(1).stores({
+  message: '++id, roomId, senderId, message, messageType, canEdit, oneShot, requireUnlock'
+});
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MessageLocalDataSourceService {
+
+  private baseUrl = 'https://gdapi-dev.dyndns.info/stage/api/v2/Chat'; // Your base URL
+
+  constructor() {}
+
+
+  async createMessage(data: MessageInputDTO) {
+
+    try {
+      const result = await messageDataSource.message.add(data)
+      return ok(result)
+    } catch (e) {
+      return err(false)
+    }
+
+  }
+
+  getItemsLive(): Observable<RoomListOutPutDTO[]> {
+    return liveQuery(() => messageDataSource.message.toArray()) as any;
+  }
+
+
+  addIdToMessage() {}
+
+}
+

src/app/services/Repositorys/chat/data-source/message/message-remote-data-source.service.ts

@@ -1,9 +1,10 @@
 import { Injectable } from '@angular/core';
 import { HttpService } from 'src/app/services/http.service';
-import { MessageOutPutDTO } from '../../dto/message/messageOutputDTO';
 import { MessageListInputDTO } from '../../dto/message/messageListInputDTO';
 import { DataSourceReturn } from '../../../type';
-
+import { MessageInputDTO, MessageInputDTOSchema } from '../../dto/message/messageInputDtO';
+import { ValidateSchema } from 'src/app/services/decorators/validate-schema.decorator';
+import { MessageOutPutDTO } from '../../dto/message/messageOutputDTO';
 
 @Injectable({
   providedIn: 'root'
@@ -14,8 +15,9 @@ export class MessageRemoteDataSourceService {
 
   constructor(private httpService: HttpService) {}
 
-  async sendMessage(message: any) {
-    return await this.httpService.post<any>(`${this.baseUrl}/Messages`, message);
+  @ValidateSchema(MessageInputDTOSchema)
+  async sendMessage(data: MessageInputDTO) {
+    return await this.httpService.post<MessageOutPutDTO>(`${this.baseUrl}/Messages`, data);
   }
 
   async reactToMessage(id: string, reaction: any) {

src/app/services/Repositorys/chat/data-source/room/rooom-local-data-source.service.ts

@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { AddMemberToRoomInputDTO } from '../../dto/room/addMemberToRoomInputDto';
-import { RoomListOutPutDTO } from '../../dto/room/roomListOutputDTO';
+import { RoomListItemOutPutDTO, RoomListOutPutDTO } from '../../dto/room/roomListOutputDTO';
 import { Dexie, EntityTable, liveQuery } from 'Dexie';
 import { err, ok } from 'neverthrow';
 import { Observable } from 'rxjs';
@@ -49,33 +49,13 @@ export class RoomLocalDataSourceService {
 
   }
 
-  async getRoomList() {
-
-  }
-
-  async getRoom(id: string){
-
-  }
-
-  async updateRoom(id: string, room: any) {
-
-  }
-
-  async deleteRoom(id: string){
-
-  }
-
-  async addMemberToRoom(data: AddMemberToRoomInputDTO) {
-
-  }
-
-  async removeMemberFromRoom(id: string, member: any){
-
-  }
-
   getItemsLive(): Observable<RoomListOutPutDTO[]> {
     return liveQuery(() => roomDataSource.room.toArray()) as any;
   }
 
+  getRoomByIdLive(id: any): Observable<RoomListItemOutPutDTO | undefined> {
+    return liveQuery(() => roomDataSource.room.get(id)) as any;
+  }
+
 }
 

src/app/services/Repositorys/chat/dto/message/messageInputDtO.ts

@@ -0,0 +1,14 @@
+import { z } from "zod";
+
+export const MessageInputDTOSchema = z.object({
+  roomId: z.string().uuid(),
+  senderId: z.number(),
+  message: z.string(),
+  messageType: z.number(),
+  canEdit: z.boolean(),
+  oneShot: z.boolean(),
+  requireUnlock: z.boolean(),
+});
+
+
+export type MessageInputDTO = z.infer<typeof MessageInputDTOSchema>

src/app/services/Repositorys/chat/dto/message/messageOutputDTO.ts

@@ -1,20 +1,9 @@
 import { z } from "zod"
 
 const MessageOutPutDTOSchema = z.object({
-  id: z.string(),
-  sender:  z.object({
-    wxUserId: z.number(),
-    wxFullName: z.string(),
-    wxeMail: z.string().email(),
-    userPhoto: z.string()
-  }),
-  message: z.string().datetime(),
-  messageType: z.string().datetime(),
-  sentAt: z.number(),
-  deliverAt: z.any(),
-  canEdit: z.any(),
-  oneShot: z.any(),
-  requireUnlock: z.any()
+  success: z.boolean(),
+  message: z.string(),
+  data: z.any()
 });
 
 export type MessageOutPutDTO = z.infer<typeof MessageOutPutDTOSchema>

src/app/services/Repositorys/chat/repository/message-respository.service.ts

@@ -2,6 +2,8 @@ import { Injectable } from '@angular/core';
 import { MessageRemoteDataSourceService } from '../data-source/message/message-remote-data-source.service';
 import { MessageLiveDataSourceService } from '../data-source/message/message-live-data-source.service';
 import { MessageListInputDTO } from '../dto/message/messageListInputDTO';
+import { MessageInputDTO } from '../dto/message/messageInputDtO';
+import { MessageLocalDataSourceService } from '../data-source/message/message-local-data-source.service';
 
 @Injectable({
   providedIn: 'root'
@@ -10,11 +12,17 @@ export class MessageRepositoryService {
 
   constructor(
     private messageRemoteDataSourceService: MessageRemoteDataSourceService,
-    private messageLiveDataSourceService: MessageLiveDataSourceService
+    private messageLiveDataSourceService: MessageLiveDataSourceService,
+    private messageLocalDataSourceService: MessageLocalDataSourceService
   ) {}
 
-  async sendMessage() {
-    // const result = this.messageRemoteDataSourceService.sendMessage()
+  async sendMessage(data: MessageInputDTO) {
+
+    const localActionResult = await this.messageLocalDataSourceService.createMessage(data)
+
+    if(localActionResult.isOk()) {
+      const sendMessageResult = await this.messageRemoteDataSourceService.sendMessage(data)
+    }
   }
 
   async getMessagesFromRoom(data: MessageListInputDTO) {

src/app/services/Repositorys/chat/repository/room-repository.service.ts

@@ -5,6 +5,8 @@ import { addRoom, RoomRemoteDataSourceState } from '../data-source/room/room-mem
 import { Store } from '@ngrx/store';
 import { AddMemberToRoomInputDTO } from '../dto/room/addMemberToRoomInputDto';
 import { RoomLocalDataSourceService } from '../data-source/room/rooom-local-data-source.service';
+import { HttpErrorResponse } from '@angular/common/http';
+import { ZodError } from 'zod';
 
 @Injectable({
   providedIn: 'root'
@@ -29,6 +31,8 @@ export class RoomRepositoryService {
     const result = await this.roomRemoteDataSourceService.createRoom(data)
 
     if(result.isOk()) {
+
+      console.log('result', result)
       this.roomMemoryDataSourceService.dispatch( addRoom(result.value) )
 
       this.roomLocalDataSourceService.createRoom(result.value)
@@ -47,4 +51,8 @@ export class RoomRepositoryService {
   getItemsLive() {
     return this.roomLocalDataSourceService.getItemsLive()
   }
+
+  getItemByIdLive(id: any) {
+    return this.roomLocalDataSourceService.getRoomByIdLive(id)
+  }
 }

src/app/shared/chat/messages/messages.page.html

@@ -1,11 +1,11 @@
-<ion-header class="ion-no-border">
-  <ion-toolbar class="header-toolbar">
-    <div class="main-header">
+<ion-header class="ion-no-border" >
+  <ion-toolbar class="header-toolbar" >
+    <div class="main-header" *ngIf="roomData$ | async as roomData">
       <div class="header-top">
-        <div class="middle">
-          <ion-label class="title">{{ ChatSystemService.getDmRoom(this.roomId).name }}</ion-label>
+        <div class="middle" >
+          <ion-label class="title"> {{ roomData.roomName }}</ion-label>
           <!-- <button (click)="ChatMessageDebuggingPage()">Dev</button> -->
-          <span><ion-icon *ngIf="RochetChatConnectorService.isLogin" class="{{ ChatSystemService.getDmRoom(this.roomId).online }}" name="ellipse"></ion-icon></span>
+          <span><ion-icon *ngIf="RochetChatConnectorService.isLogin" class="online" name="ellipse"></ion-icon></span>
         </div>
         <div hidden class="right">
           <button title="Menu" class="btn-no-color" (click)="_openMessagesOptions()">
@@ -28,192 +28,18 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content>
+<ion-content  >
   <ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
     <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
     <ion-refresher-content>
     </ion-refresher-content>
   </ion-refresher>
   <div class="messages" #scrollMe>
-    <ion-list>
+    <ion-list *ngIf="roomData$ | async as roomData">
 
-      <!-- <div (click)=" ChatSystemService.getDmRoom(this.roomId).deleteAll()">delete all</div> -->
-      <div class="messages-list-item-wrapper container-width-100"
-      *ngFor="let msg of  ChatSystemService.getDmRoom(roomId).messages; index as i; let last = last" >
-
-      <div [class.dateLabel]="msg.dateLabel" class='message-item incoming-{{msg.u.username!=sessionStore.user.UserName}} max-width-45' *ngIf="msg.msg !=''" >
-        <div class="message-item-options d-flex justify-content-end" *ngIf="!msg.dateLabel">
-          <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
-          </fa-icon>
-          <mat-menu #beforeMenu="matMenu" xPosition="before">
-            <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
-          </mat-menu>
-        </div>
-        <div class="title d-flex" *ngIf="!msg.dateLabel">
-          <ion-label >{{msg.u.name}}</ion-label>
-          <span class="time">{{msg.time}}</span>
-        </div>
-        <div class="d-block justify-space-between">
-
-          <pre *ngIf="msg.delate == false" class="message-box text ma-0 font-13-rem" style="font-size: 0.8125rem !important;" >{{msg.msg}}</pre>
-          <!-- <ion-label *ngIf="msg.delate == false" class="message-box">{{msg.msg}} </ion-label> -->
-          <ion-label *ngIf="msg.delate == true" class="flex-0">Apagou a mensagem</ion-label>
-
-          <ion-label class="float-status-all float-status" *ngIf="msg.u.username==sessionStore.user.UserName">
-
-
-            <span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
-            <!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
-            <!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
-            <!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
-            <!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
-            <span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
-            <div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
-          </ion-label>
-          {{last ? scrollToBottom() : ''}}
-        </div>
-      </div>
-
-      <div *ngIf="msg.file && msg.delate == false">
-        <div class='message-item incoming-{{msg.u.username!=sessionStore.user.UserName}} max-width-45'
-          *ngIf="msg.file.type != 'application/meeting'">
-          <div class="message-item-options d-flex justify-content-end">
-            <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
-            </fa-icon>
-            <mat-menu #beforeMenu="matMenu" xPosition="before">
-              <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
-            </mat-menu>
-          </div>
-          <div class="title d-flex">
-            <ion-label >{{msg.u.name}}</ion-label>
-            <span class="time">{{msg.time}}</span>
-          </div>
-          <div>
-            <div *ngIf="msg.attachments" class="message-attachments">
-              <div *ngFor="let file of msg.attachments">
-                <div *ngIf="msg.file.type == 'application/img'" (click)="openPreview(msg)" dfsdvsvs>
-                  <div *ngIf="!msg.attachments[0].image_url">
-                  <ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
-                    <ion-icon name="image" class="file-icon"></ion-icon>
-                    <ion-label>{{"Imagem"}}</ion-label>
-
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.downloadLoader == false && msg.uploadingFile == false && msg.downloadAttachmentsTemp == 0" class="icon-download" src="assets/icon/theme/{{ThemeService.currentTheme}}/icons-download.svg" slot="end"></ion-icon>
-                      <ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
-                      <ion-icon *ngIf="msg.downloadAttachments == false && msg.downloadAttachmentsTemp >= 1 && msg.downloadLoader == false" src="assets/images/retry-svgrepo-com.svg" class="icon-download font-12">  </ion-icon>
-
-                  </ion-item>
-                </div>
-                  <img *ngIf="msg.attachments[0].image_url" src={{msg.attachments[0].image_url}} alt="image" class="d-block">
-
-                  <ion-label class="float-status-all float-status"  *ngIf="msg.u.username==sessionStore.user.UserName">
-
-                    <span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
-                    <!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
-                    <!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
-                    <!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
-                    <!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
-                    <span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
-                    <div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
-                  </ion-label>
-                </div>
-                <div *ngIf="msg.file.type != 'application/img'">
-                  <div *ngIf="msg.file.type != 'application/audio'" class="file add-attachment-bg-color">
-                    <div (click)="openPreview(msg)" class="file-details add-ellipsis cursor-pointer" *ngIf="msg.file">
-
-                      <div *ngIf="!msg.attachments[0].image_url">
-                        <ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
-
-                          <ion-icon *ngIf="msg.attachments[0].type != 'webtrix'" name="document" class="file-icon"></ion-icon>
-                          <ion-icon  *ngIf="msg.attachments[0].type == 'webtrix'" src="assets/icon/webtrix.svg" class="file-icon"></ion-icon>
-                          <ion-label>{{ file.title}}</ion-label>
-                          <ion-icon *ngIf="ThemeService.currentTheme == 'default' && msg.attachments[0].type != 'webtrix' && !( msg.downloadLoader == true || msg.uploadingFile == true ) " class="icon-download" src="assets/icon/theme/default/icons-download.svg" slot="end"></ion-icon>
-                          <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.attachments[0].type != 'webtrix' && !( msg.downloadLoader == true || msg.uploadingFile == true ) " class="icon-download" src="assets/icon/theme/gov/icons-download.svg" slot="end"></ion-icon>
-                          <ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
-
-                        </ion-item>
-                      </div>
-
-                      <div *ngIf="msg.attachments[0].image_url">
-
-                        <span *ngIf="msg.file.type">
-                          <fa-icon *ngIf="msg.file.type == 'application/pdf'" icon="file-pdf" class="pdf-icon"></fa-icon>
-                          <fa-icon *ngIf="msg.file.type == 'application/word'" icon="file-word" class="word-icon">
-                          </fa-icon>
-                          <fa-icon *ngIf="msg.file.type == 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'" icon="file-word" class="word-icon"></fa-icon>
-                          <fa-icon
-                            *ngIf="msg.file.type == 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'"
-                            icon="file-word" class="excel-icon"></fa-icon>
-                          <ion-icon *ngIf="msg.file.type == 'application/webtrix'" src="assets/icon/webtrix.svg">
-                          </ion-icon>
-                          <ion-icon *ngIf="msg.file.type == 'application/meeting'" src="assets/icon/webtrix.svg">
-                          </ion-icon>
-                        </span>
-                        <ion-label class="file-title">{{file.title}}</ion-label>
-                      </div>
-                    </div>
-                  </div>
-                  <div (click)="audioPreview(msg)" class="audio-contentainer" *ngIf="msg.file.type == 'application/audio' && !file.title_link">
-                    <ion-item class="add-attachment-bg-color" shape="round" lines="none" type="button">
-                      <ion-icon name="mic-outline" class="file-icon"></ion-icon>
-                      <ion-label>{{'Mensagem de voz'}}</ion-label>
-
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && msg.downloadLoader == false && msg.uploadingFile == false && msg.downloadAttachmentsTemp == 0" class="icon-download" src="assets/icon/theme/{{ThemeService.currentTheme}}/icons-download.svg" slot="end"></ion-icon>
-                      <ion-icon *ngIf="( msg.downloadLoader == true || msg.uploadingFile == true )" class="icon-download" src="assets/gif/theme/{{ThemeService.currentTheme}}/Blocks-loader.svg" slot="end"></ion-icon>
-                      <ion-icon *ngIf="msg.downloadAttachments == false && msg.downloadAttachmentsTemp >= 1 && msg.downloadLoader == false" src="assets/images/retry-svgrepo-com.svg" class="icon-download font-12">  </ion-icon>
-
-                    </ion-item>
-                  </div>
-                  <div class="audio-contentainer" *ngIf="msg.file.type == 'application/audio' && file.title_link">
-                    <audio [src]="file.title_link|safehtml" preload="metadata" class="flex-grow-1" controls controlsList="nodownload noplaybackrate"></audio>
-                  </div>
-                  <div class="file-details-optional add-attachment-bg-color">
-                    <ion-label *ngIf="msg.file">
-                      <span *ngIf="file.description">{{file.description}}</span>
-                      <span *ngIf="file.description && msg.file.type != 'application/webtrix'"> • </span>
-
-                    </ion-label>
-                    <ion-label class="float-status-all float-status"  *ngIf="msg.u.username==sessionStore.user.UserName">
-
-                      <span *ngIf="msg.online == true && !msg.manualRetry && msg.viewed == 0" class="enviado pl-10"> Enviado</span>
-                      <!-- <ion-icon *ngIf="msg.messageSend == false && !msg.manualRetry" src="assets/images/clock-regular.svg"></ion-icon> -->
-                      <!-- <ion-icon *ngIf="msg.messageSend == true && msg.received.length == 0 && msg.viewed.length == 0" src="assets/images/check-solid.svg"></ion-icon> -->
-                      <!-- <ion-icon *ngIf="msg.messageSend && msg.received.length >= 1 && msg.viewed.length == 0" src="assets/images/check-double-solid.svg"></ion-icon> -->
-                      <!-- <ion-icon *ngIf="msg.viewed.length >= 1" src="assets/images/check-double-solid -viewed.svg"></ion-icon> -->
-                      <span class="lido pl-10" *ngIf="msg.viewed.length >= 1" > Lido</span>
-                      <div *ngIf="msg.manualRetry" class="try pl-10" (click)="msg.send()">Tentar</div>
-                    </ion-label>
-                  </div>
-                </div>
-              </div>
-            </div>
-            {{last ? scrollToBottom() : ''}}
-          </div>
-        </div>
-
-        <div class="info-meeting" *ngIf="msg.file.type == 'application/meeting'">
-
-          <ion-label *ngIf="msg.delate == true" class="info-meeting-small">Apagou a mensagem</ion-label><br />
-
-
-          <ion-label  *ngIf="msg.delate == false" class="info-meeting-small">{{msg.u.name}} criou esta reunião</ion-label><br />
-          <button *ngIf="msg.delate == false" (click)="goToEvent(msg.file)" class="btn-no-color info-meeting-normal">
-            <ion-label class="info-meeting-normal">{{msg.file.subject}}</ion-label>
-          </button><br />
-          <ion-label *ngIf="msg.delate == false" class="info-meeting-medium">
-            <ion-icon name="calendar-outline"></ion-icon> De {{showDateDuration(msg.file.start_date)}} a
-            {{showDateDuration(msg.file.end_date)}}
-          </ion-label><br />
-          <ion-label *ngIf="msg.delate == false" class="info-meeting-medium">
-            <ion-icon></ion-icon>
-            <ion-icon name="location-outline"></ion-icon> {{msg.file.venue}}
-          </ion-label><br />
-        </div>
-      </div>
-
-
-
-    </div>
+      MESSAGE
 
+      <p>Room ID: {{ roomData.id }}</p>
     </ion-list>
 
   </div>
@@ -227,16 +53,17 @@
 </ion-content>
 
 
-<ion-footer (click)="ChatSystemService.getDmRoom(roomId).sendReadMessage()">
+<!-- <ion-footer (click)="ChatSystemService.getDmRoom(roomId).sendReadMessage()"> -->
+<ion-footer >
 
-  <div class="typing" *ngIf="ChatSystemService.getDmRoom(roomId).otherUserType == true" >
+  <!-- <div class="typing" *ngIf="ChatSystemService.getDmRoom(roomId).otherUserType == true" >
     <ngx-letters-avatar *ngIf="showAvatar"
     [avatarName]=  "ChatSystemService.getDmRoom(roomId).name"
     [width]="30"
     [circular]="true"
     fontFamily="Roboto"></ngx-letters-avatar>
     está a escrever...
-  </div>
+  </div> -->
   <div class="width-100 pl-20 pr-20">
     <span *ngIf="!lastAudioRecorded">{{durationDisplay}}</span>
     <div class=" audioDiv d-flex width-100 mt-10 mb-10" *ngIf="lastAudioRecorded">
@@ -277,7 +104,7 @@
 
     <div class="width-100">
       <div *ngIf="!recording && !lastAudioRecorded" class="type-message">
-        <ion-textarea  *ngIf="allowTyping" (keyup.enter)="sendMessage()" clearOnEdit="true" placeholder="Escrever uma mensagem" class="message-input" rows="1" [(ngModel)]="ChatSystemService.getDmRoom(roomId).message" (ionChange)="ChatSystemService.getDmRoom(roomId).sendTyping()"></ion-textarea>
+        <ion-textarea  *ngIf="allowTyping" (keyup.enter)="sendMessage()" clearOnEdit="true" placeholder="Escrever uma mensagem" class="message-input" rows="1" [(ngModel)]="textField" (ionChange)="sendTyping()"></ion-textarea>
       </div>
       <div *ngIf="recording" class="d-flex align-items-center justify-content-center">
         <button (click)="stopRecording()" class="btn-no-color d-flex align-items-center justify-content-center">
@@ -287,19 +114,12 @@
     </div>
 
     <div>
-      <button #recordbtn *ngIf="!ChatSystemService.getDmRoom(roomId).message && !lastAudioRecorded" (click)="startRecording()" class="btn-no-color">
-        <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/default/icons-chat-record-audio.svg"></ion-icon>
-        <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-record-audio.svg"></ion-icon>
-        <!-- <ion-icon *ngIf="audioPermissionStatus != 'granted' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-record-audio-disable.svg"></ion-icon> -->
-      </button>
-      <button *ngIf="ChatSystemService.getDmRoom(roomId).message" class="btn-no-color" (click)="sendMessage()">
-        <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
-        <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
-      </button>
-      <button *ngIf="!ChatSystemService.getDmRoom(roomId).message && lastAudioRecorded" class="btn-no-color" (click)="sendAudio(lastAudioRecorded)">
+
+      <button class="btn-no-color" (click)="sendMessage()">
         <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
         <ion-icon *ngIf="ThemeService.currentTheme == 'gov' " class="chat-icon-send" src="assets/icon/theme/gov/icons-chat-send.svg"></ion-icon>
       </button>
+
     </div>
   </div>
 </ion-footer>

src/app/shared/chat/messages/messages.page.ts

@@ -35,6 +35,9 @@ import { ChatMessageDebuggingPage } from 'src/app/shared/popover/chat-message-de
 import { PermissionService } from 'src/app/services/permission.service';
 import { FileValidatorService } from "src/app/services/file/file-validator.service"
 import { ChangeDetectorRef } from '@angular/core';
+import { RoomRepositoryService } from 'src/app/services/Repositorys/chat/repository/room-repository.service';
+import { Observable } from 'rxjs';
+import { RoomListItemOutPutDTO, RoomListOutPutDTO } from 'src/app/services/Repositorys/chat/dto/room/roomListOutputDTO';
 
 
 const IMAGE_DIR = 'stored-images';
@@ -103,6 +106,9 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
   isAdmin = false;
   roomCountDownDate: string;
 
+  textField = ''
+
+  roomData$: Observable<RoomListItemOutPutDTO | undefined>
 
   constructor(
     public popoverController: PopoverController,
@@ -124,39 +130,18 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
     private platform: Platform,
     private fileOpener: FileOpener,
     public p: PermissionService,
-    private FileValidatorService: FileValidatorService
+    private FileValidatorService: FileValidatorService,
+    private roomRepositoryService: RoomRepositoryService
   ) {
     // update
     this.checkAudioPermission()
   }
 
   ngOnChanges(changes: SimpleChanges): void {
-
-    this.ChatSystemService.getAllRooms();
-    this.ChatSystemService.getDmRoom(this.roomId).loadHistory({})
-
-    this.ChatSystemService.getDmRoom(this.roomId).scrollDown = this.scrollToBottomClicked
-
-    this.ChatSystemService.openRoom(this.roomId)
-
-    this.ChatSystemService.getDmRoom(this.roomId)
-
-    this.showAvatar = false
-
-
-
-
-    setTimeout(() => {
-      this.scrollToBottomClicked()
-      this.showAvatar = true
-    }, 150)
-
-    this.deleteRecording()
-
-    // this.ChatSystemService.getDmRoom(this.roomId).deleteAll()
-
+    this.roomData$ = this.roomRepositoryService.getItemByIdLive(this.roomId)
   }
 
+  sendTyping() {}
 
   async ChatMessageDebuggingPage() {
 
@@ -415,7 +400,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
   }
 
   sendMessage() {
-    this.ChatSystemService.getDmRoom(this.roomId).send({})
+
+
   }