add user list

src/app/pages/chat/chat.page.html

@@ -43,64 +43,64 @@
         <div class=" aside overflow-y-auto d-flex flex-wrap flex-grow-1">
         <div class="width-100" [ngSwitch]="segment">
           <ion-list *ngSwitchCase="'Contactos'">
-              <ion-item-sliding>
-                <div class="item item-hover width-100 d-flex ion-no-padding ion-no-margin"
-                  *ngFor="let dm of userDirectMessages"
-                  [class.item-active]="dm._id == idSelected">
-                    <div class="item-icon">
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="icon" slot="start" src="assets/images/icons-chat-chat-40.svg"></ion-icon>
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && dm._id != idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40.svg"></ion-icon>
-                      <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && dm._id == idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40-hover.svg"></ion-icon>
-                    </div>
-                    <div [class.highlight]="dm._id =='cjFv5XfreKz5j3fWW'"
-                     (click)="openMessagesPage(dm._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]="dm._id == idSelected">
-                          <ion-label *ngFor="let user of dm.uids">
-                            <span *ngIf="user !=loggedUserChat.me.username">
-                              <div *ngFor="let t of dmUsers">
-                                <div *ngIf="user == t._id">
-                                  {{t.name}}
-                                </div>
+            <ion-item-sliding>
+              <div class="item item-hover width-100 d-flex ion-no-padding ion-no-margin"
+                *ngFor="let room of ChatServiceGPR.individual | keyvalue"
+                [class.item-active]="room.value.id == idSelected">
+                  <div class="item-icon">
+                    <ion-icon *ngIf="ThemeService.currentTheme == 'default' " class="icon" slot="start" src="assets/images/icons-chat-chat-40.svg"></ion-icon>
+                    <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && room.value.id != idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40.svg"></ion-icon>
+                    <ion-icon *ngIf="ThemeService.currentTheme == 'gov' && room.value.id == idSelected " class="icon" slot="start" src="assets/images/theme/gov/icons-chat-chat-40-hover.svg"></ion-icon>
+                  </div>
+                  <div [class.highlight]="room.value.id =='cjFv5XfreKz5j3fWW'"
+                   (click)="openMessagesPage(room.value.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.value.id == idSelected">
+                        <ion-label >
+                          <span >
+                            <div >
+                              <div >
+                                {{room.value.name}}
                               </div>
-                          </span>
-                          </ion-label>
+                            </div>
+                        </span>
+                        </ion-label>
+                      </div>
+                      <!-- <div class="item-date" [class.item-date-active]="dm._id == idSelected">{{showDateDuration(dm._updatedAt)}}</div> -->
+                    </div>
+                    <div *ngIf="room.value.lastMessage" class="item-description" [class.item-description-active]="room.value.id == idSelected">
+                      <ion-label *ngIf="room.value.lastMessage">{{room.value.lastMessage.msg}}</ion-label>
+                      <ion-label *ngIf="room.value.lastMessage.file">
+                        <fa-icon *ngIf="room.value.lastMessage.file.type != 'application/meeting'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
+                        <fa-icon *ngIf="room.value.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
+                        <span> {{room.value.lastMessage.file.name || room.value.lastMessage.file.subject }}</span>
+                      </ion-label>
+                      <ion-label *ngIf="room.value.lastMessage.attachments">
+                        <div *ngIf="room.value.lastMessage.attachments[0].image_url">
+                          <fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
+                          <span> Fotografia</span>
                         </div>
-                        <div class="item-date" [class.item-date-active]="dm._id == idSelected">{{showDateDuration(dm._updatedAt)}}</div>
-                      </div>
-                      <div *ngIf="dm.lastMessage" class="item-description" [class.item-description-active]="dm._id == idSelected">
-                        <ion-label *ngIf="dm.lastMessage">{{dm.lastMessage.msg}}</ion-label>
-                        <ion-label *ngIf="dm.lastMessage.file">
-                          <fa-icon *ngIf="dm.lastMessage.file.type != 'application/meeting'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
-                          <fa-icon *ngIf="dm.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
-                          <span> {{dm.lastMessage.file.name || dm.lastMessage.file.subject }}</span>
-                        </ion-label>
-                        <ion-label *ngIf="dm.lastMessage.attachments">
-                          <div *ngIf="dm.lastMessage.attachments[0].image_url">
-                            <fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="dm._id == idSelected"></fa-icon>
-                            <span> Fotografia</span>
-                          </div>
-                        </ion-label>
-                      </div>
+                      </ion-label> 
                     </div>
                   </div>
-              </ion-item-sliding>
-              <ion-item-sliding *ngIf="showLoader || userDirectMessages.length < 1">
-                  <div *ngFor="let n of numSequence(8); let i = index;" class="item item-hover width-100 d-flex ion-no-padding ion-no-margin">
-                    <div class="item-icon"><ion-icon class="icon" slot="start" src="assets/icon/icons-chat-grey.svg"></ion-icon></div>
-                    <div class="item-content flex-grow-1 cursor-pointer">
-                      <div class="item-title-time">
-                        <div class="item-title"><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></div>
-                        <div class="item-date"><ion-skeleton-text animated></ion-skeleton-text></div>
-                      </div>
-                      <div class="item-description d-flex align-items-center">
-                        <fa-icon icon="file-alt" class="file-icon"></fa-icon>
-                        <ion-skeleton-text animated style="width: 95%; margin-left:5%"></ion-skeleton-text>
-                      </div>
+                </div>
+            </ion-item-sliding>
+            <ion-item-sliding *ngIf="ChatServiceGPR.loadingWholeList || ChatServiceGPR.individualCount < 1">
+                <div *ngFor="let n of numSequence(8); let i = index;" class="item item-hover width-100 d-flex ion-no-padding ion-no-margin">
+                  <div class="item-icon"><ion-icon class="icon" slot="start" src="assets/icon/icons-chat-grey.svg"></ion-icon></div>
+                  <div class="item-content flex-grow-1 cursor-pointer">
+                    <div class="item-title-time">
+                      <div class="item-title"><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></div>
+                      <div class="item-date"><ion-skeleton-text animated></ion-skeleton-text></div>
+                    </div>
+                    <div class="item-description d-flex align-items-center">
+                      <fa-icon icon="file-alt" class="file-icon"></fa-icon>
+                      <ion-skeleton-text animated style="width: 95%; margin-left:5%"></ion-skeleton-text>
                     </div>
                   </div>
-              </ion-item-sliding>
+                </div>
+            </ion-item-sliding>
           </ion-list>
           <ion-list *ngSwitchCase="'Grupos'">
               <ion-item-sliding *ngIf="!showLoader">

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

@@ -12,6 +12,7 @@ import {
 import { ModalController, Platform } from '@ionic/angular';
 import { AuthService } from 'src/app/services/auth.service';
 import { ChatService } from 'src/app/services/chat.service';
+import { ChatService as ChatServiceGPR} from 'src/app/services/chat/chat.service'
 import { GroupMessagesPage } from './group-messages/group-messages.page';
 import { ContactsPage } from './messages/contacts/contacts.page';
 import { MessagesPage } from './messages/messages.page';
@@ -123,9 +124,11 @@ export class ChatPage implements OnInit {
     private router: Router,
     private sqlservice: SqliteService,
     private platform: Platform,
-    private storageservice: StorageService
+    private storageservice: StorageService,
+    public ChatServiceGPR: ChatServiceGPR
 
   ) {
+
     this.loggedUserChat = authService.ValidatedUserChat['data'];
     this.headers = new HttpHeaders();
     window.onresize = (event) => {
@@ -142,44 +145,44 @@ export class ChatPage implements OnInit {
 
     this.segment = "Contactos";
 
-    this.authService.userData$.subscribe((res: any) => {
-      this.loggedUser = res;
-      console.log(this.loggedUser);
-      this.load();
+    // this.authService.userData$.subscribe((res: any) => {
+    //   this.loggedUser = res;
+    //   console.log(this.loggedUser);
+    //   this.load();
 
-      this.getDirectMessagesDB();
-    });
+    //   // this.getDirectMessagesDB();
+    // });
 
     /* websocket functions */
     //this.sendMsg();
 
     /* Fim websocket functions */
-    this.hideRefreshButton();
-    this.getChatMembers();
+    // this.hideRefreshButton();
+    // this.getChatMembers();
 
     //Teste
-    let t = this.showDateDuration(new Date());
-    console.log(t);
+    // let t = this.showDateDuration(new Date());
+    // console.log(t);
 
-    this.setStatus('away');
+    // this.setStatus('away');
     /* if(this.dataService.get("newGroup")){
       this.openNewGroupPage();
     } */
 
-    this.router.events.forEach((event) => {
-      if (event instanceof NavigationStart && event.url.startsWith('/home/chat')) {
-        if (this.dataService.get("newGroup")) {
-          this.openNewGroupPage();
-        }
-        else{
-          this.closeAllDesktopComponents();
-          this.showEmptyComponent = true;
-        }
-      }
-      else{
-        this.dataService.set("newGroup", false);
-      }
-    });
+    // this.router.events.forEach((event) => {
+    //   if (event instanceof NavigationStart && event.url.startsWith('/home/chat')) {
+    //     if (this.dataService.get("newGroup")) {
+    //       this.openNewGroupPage();
+    //     }
+    //     else{
+    //       this.closeAllDesktopComponents();
+    //       this.showEmptyComponent = true;
+    //     }
+    //   }
+    //   else{
+    //     this.dataService.set("newGroup", false);
+    //   }
+    // });
   }
 
   numSequence(n: number): Array<number> {

src/app/services/chat/chat.service.ts

@@ -2,14 +2,21 @@ import { Injectable } from '@angular/core';
 import { RoomService } from './room.service';
 import { RocketChatClientService } from 'src/app/services/socket/rocket-chat-client.service';
 import { MessageService } from 'src/app/services/chat/message.service'
+import { SessionStore } from 'src/app/store/session.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class ChatService {
 
-  rooms: RoomService[] = []
-  group = []
+
+  individual: {[key: string]:  RoomService} = {}
+  group: {[key: string]:  RoomService} = {}
+
+  loadingWholeList = false
+
+  individualCount = 0;
+  groupCount = 0;
   
   constructor(
     private RocketChatClientService: RocketChatClientService
@@ -17,17 +24,63 @@ export class ChatService {
     this.getAllRoomAndSubscribe()
   }
 
-  getAllRoomAndSubscribe() {
-    this.RocketChatClientService.getRooms().then((rooms: any) => {
-      rooms.result.update.forEach((roomData:any) => {
-        const room = new RoomService(new RocketChatClientService(), new MessageService())
-        room.setData({id: roomData.lastMessage.rid})
-      });
+  async getAllRoomAndSubscribe () {
+    this.loadingWholeList = true
+
+    const rooms: any = await this.RocketChatClientService.getRooms();
+
+    rooms.result.update.forEach((roomData:any) => {
+      let room
+      let roomId = roomData.lastMessage.rid
+      if(this.isIndividual(roomData)) {
+        room = new RoomService(new RocketChatClientService(), new MessageService())
+        room.setData({
+          id: this.getRoomId(roomData),
+          name: this.getChatName(roomData),
+          lastMessage: this.getRoomLastMessage(roomData)
+        })
+        this.individual[roomId] = room
+        this.individualCount++
+      } else {
+        room = new RoomService(new RocketChatClientService(), new MessageService())
+        room.setData({
+          id: this.getRoomId(roomData),
+          name: this.getChatName(roomData),
+          lastMessage: this.getRoomLastMessage(roomData)
+        })
+        this.group[roomId] = room
+        this.groupCount++
+      }
+      
     });
+
+    this.loadingWholeList = false
+   
   }
 
-  onJoinRoom() {
-    // live
+  getChatName(roomData) {
+    if(this.isIndividual(roomData)) {
+      const names: String[] = roomData.usernames
+      const roomName = names.filter((name)=>{
+        return name != SessionStore.user.RochetChatUser
+      })[0]
+
+      return roomName
+    } else {
+      return roomData.fName
+    }
+  }
+
+  getRoomId(roomData) {
+    return roomData.lastMessage.rid
+  }
+
+  getRoomLastMessage(roomData) {
+    return roomData.lastMessage
+  }
+
+  private isIndividual(roomData) {
+    return !roomData.fname
   }
 
 }

src/app/services/chat/room.service.ts

@@ -7,17 +7,22 @@ import { ChatUserService } from 'src/app/services/chat/chat-user.service'
 })
 export class RoomService {
 
-  massages: MessageService[] = []
+  massages: {[key: string]:  MessageService} = {}
+  lastMessage: MessageService;
+
   chatUser: ChatUserService[] = []
-  id = []
+  id = ''
+  name = ''
 
   constructor(
     private RocketChatClientService: RocketChatClientService,
     private MessageService: MessageService
   ) {}
 
-  setData({id}){
-    this.id= id
+  setData({id, name, lastMessage}) {
+    this.id = id
+    this.name = name
+    this.lastMessage = lastMessage
   }
 
   create() {}