add show total users in rocket chat server

src/app/pages/chat/newchat/newchat-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { NewchatPage } from './newchat.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: NewchatPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class NewchatPageRoutingModule {}

src/app/pages/chat/newchat/newchat.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { NewchatPageRoutingModule } from './newchat-routing.module';
+
+import { NewchatPage } from './newchat.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    NewchatPageRoutingModule
+  ],
+  declarations: [NewchatPage]
+})
+export class NewchatPageModule {}

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

@@ -0,0 +1,20 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-buttons slot="start">
+      <ion-back-button  icon="chevron-back"></ion-back-button>
+    </ion-buttons>
+    <ion-title>Nova Conversa</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <ion-toolbar>
+    <ion-searchbar round (ionChange)="onChange($event)" placeholder="Pesquisar por cantacto" ></ion-searchbar>
+  </ion-toolbar>
+  <ion-list>
+    <ion-item *ngFor="let user of searchedItem" (click)="starConversation(user)">
+      {{user.name}}
+    </ion-item>
+  </ion-list>
+
+</ion-content>

src/app/pages/chat/newchat/newchat.page.scss

@@ -0,0 +1,3 @@
+ion-searchbar{
+    --border-radius: 20px;
+}

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

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { NewchatPage } from './newchat.page';
+
+describe('NewchatPage', () => {
+  let component: NewchatPage;
+  let fixture: ComponentFixture<NewchatPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ NewchatPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(NewchatPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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

@@ -0,0 +1,65 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { ModalController } from '@ionic/angular';
+import { Observable } from 'rxjs';
+import { ChatService } from 'src/app/services/chat.service';
+import { ConversationPage } from '../conversation/conversation.page';
+
+@Component({
+  selector: 'app-newchat',
+  templateUrl: './newchat.page.html',
+  styleUrls: ['./newchat.page.scss'],
+})
+export class NewchatPage implements OnInit {
+  userList: any[];
+
+  constructor(
+    private chatService: ChatService,
+    private modalController: ModalController, 
+    private router:Router) { }
+
+  result:any;
+  searchCountryString:any;
+  searchedItem:any;
+
+  ngOnInit() {
+    this.getUsers();
+  }
+
+  getUsers(){
+    this.result = this.chatService.getAllUsers().subscribe((res:any)=>{
+      this.userList = res.users;
+      this.searchedItem = this.userList;
+    });
+  }
+
+  userSelected(id){
+    console.log(id);
+    this.router.navigate(['/home/chat/conversation']);
+
+  }
+  onChange(event){
+    const val = event.detail.value;
+    this.searchedItem = this.userList;
+    if(val && val.trim() != ''){
+      this.searchedItem = this.searchedItem.filter((item:any) =>{
+        return (item.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
+      });
+    }
+  }
+
+  async starConversation(selectedUser) {
+    const modal = await this.modalController.create({
+      component: ConversationPage,
+      cssClass: 'conversation',
+      backdropDismiss: false,
+      componentProps: {
+        user: selectedUser,
+      }
+    });
+    await modal.present();
+    modal.onDidDismiss();
+  }
+  
+
+}