diff --git a/src/app/services/Repositorys/contacts/data-source/contacts-data-source.service.ts b/src/app/services/Repositorys/contacts/data-source/contacts-data-source.service.ts
new file mode 100644
index 000000000..6d08afd19
--- /dev/null
+++ b/src/app/services/Repositorys/contacts/data-source/contacts-data-source.service.ts
@@ -0,0 +1,34 @@
+import { Injectable } from '@angular/core';
+import { HttpService } from 'src/app/services/http.service';
+import { MessageOutPutDTO } from '../../chat/dto/message/messageOutputDTO';
+import { MessageListInputDTO } from '../../chat/dto/message/messageListInputDTO';
+import { DataSourceReturn } from '../../type';
+
+
+export interface UserContacts {
+  wxUserId: number;
+  wxFullName: string;
+  wxeMail: string | null;
+  userPhoto: string | null;
+}
+ 
+export interface UserList {
+  success: boolean;
+  message: string;
+  data: UserContacts[];
+}
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ContactsDataSourceService {
+
+  private baseUrl = 'https://gdapi-dev.dyndns.info/stage/api/v2'; // Your base URL
+
+  constructor(private httpService: HttpService) {}
+
+
+  async getUsers() {
+    return await this.httpService.get<UserList>(`${this.baseUrl}/Users`);
+  }
+}
diff --git a/src/app/services/Repositorys/contacts/repository/contacts-repository.service.ts b/src/app/services/Repositorys/contacts/repository/contacts-repository.service.ts
new file mode 100644
index 000000000..f15bede47
--- /dev/null
+++ b/src/app/services/Repositorys/contacts/repository/contacts-repository.service.ts
@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core';
+import { ContactsDataSourceService } from '../data-source/contacts-data-source.service';
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ContactRepositoryService {
+
+  constructor(
+    private constactsDataSourceService: ContactsDataSourceService,
+  ) {}
+
+  async getUsers() {
+    const result = await this.constactsDataSourceService.getUsers();
+    return result;
+  }
+}
diff --git a/src/app/shared/chat/messages/contacts/contacts.page.html b/src/app/shared/chat/messages/contacts/contacts.page.html
index d43a49411..45017bde4 100644
--- a/src/app/shared/chat/messages/contacts/contacts.page.html
+++ b/src/app/shared/chat/messages/contacts/contacts.page.html
@@ -31,19 +31,19 @@
   <div class="main-content">
     <ion-progress-bar class="position-absolute" type="indeterminate" *ngIf="loading"></ion-progress-bar>
     <ion-virtual-scroll [items]="userList" approxItemHeight="70px" [headerFn]="separateLetter">
-
+  
       <div class="item-divider" *virtualHeader="let header">
-        <ion-label>{{header}}</ion-label>
+        <ion-label>{{ header }}</ion-label>
       </div>
-
-      <div (click)="openMessagesPage(user.username)" *virtualItem="let user" class="item-user cursor-pointer">
-        <p>{{user.name}}</p>
+  
+      <div (click)="openMessagesPage(user.wxFullName)" *virtualItem="let user" class="item-user cursor-pointer">
+        <p>{{ user.wxFullName }}</p>
         <span class="icon">
-        <ion-icon class="{{user.status}}" slot="end" name="ellipse"></ion-icon>
+          <ion-icon [class]="user.status" slot="end" name="ellipse"></ion-icon>
         </span>
       </div>
-
+  
     </ion-virtual-scroll>
-
   </div>
+  
 </ion-content>
diff --git a/src/app/shared/chat/messages/contacts/contacts.page.ts b/src/app/shared/chat/messages/contacts/contacts.page.ts
index da84e3fc6..99b86d7d8 100644
--- a/src/app/shared/chat/messages/contacts/contacts.page.ts
+++ b/src/app/shared/chat/messages/contacts/contacts.page.ts
@@ -6,6 +6,8 @@ import { MessagesPage } from '../messages.page';
 import { ThemeService } from 'src/app/services/theme.service'
 import { ChatSystemService } from 'src/app/services/chat/chat-system.service'
 import { SessionStore } from 'src/app/store/session.service';
+import { ContactRepositoryService } from 'src/app/services/Repositorys/contacts/repository/contacts-repository.service';
+import { UserContacts } from 'src/app/services/Repositorys/contacts/data-source/contacts-data-source.service';
 
 
 
@@ -22,20 +24,21 @@ export class ContactsPage implements OnInit {
   loggedUser: any;
 
   headers: HttpHeaders;
-  options:any;
-  textSearch:string;
-  room:any;
-  dm:any;
+  options: any;
+  textSearch: string;
+  room: any;
+  dm: any;
   sessionStore = SessionStore
   loading = false
   @Input() roomId: string;
 
-  @Output() openMessage:EventEmitter<any> = new EventEmitter<any>();
-  @Output() emptyTextDescriptionOpen:EventEmitter<any> = new EventEmitter<any>();
-  @Output() backToChat:EventEmitter<any> = new EventEmitter<any>();
-  @Output() closeAllDesktopComponents:EventEmitter<any> = new EventEmitter<any>();  
+  @Output() openMessage: EventEmitter<any> = new EventEmitter<any>();
+  @Output() emptyTextDescriptionOpen: EventEmitter<any> = new EventEmitter<any>();
+  @Output() backToChat: EventEmitter<any> = new EventEmitter<any>();
+  @Output() closeAllDesktopComponents: EventEmitter<any> = new EventEmitter<any>();
 
-  userList = this.ChatSystemService.users
+  userList: UserContacts[];
+  originalUserList: any[] = [];
 
   CoolList = []
 
@@ -43,50 +46,35 @@ export class ContactsPage implements OnInit {
     private modalController: ModalController,
     private chatService: ChatService,
     public ThemeService: ThemeService,
-    public ChatSystemService: ChatSystemService
+    public ChatSystemService: ChatSystemService,
+    private contactsRepositoryService: ContactRepositoryService
   ) {
     this.loggedUser = SessionStore.user.ChatData['data'];
-    this.textSearch="";
-    this.dm=null;
-    this.room=null;
+    this.textSearch = "";
+    this.dm = null;
+    this.room = null;
   }
 
   async ngOnInit() {
-    
+
     this.loadUsers();
   }
 
   onChange(event) {
-
     this.textSearch = event.detail.value.toLowerCase();
+    this.userList = this.originalUserList.filter((e) => {
+      const username = e.wxFullName.toLowerCase();
+      return username.includes(this.textSearch);
+    });
 
-    this.userList = this.ChatSystemService.users.filter((e) => {
-      const username = e.name.toLowerCase()
-      return username.includes(this.textSearch)
-    })
-
-
-    const alfa = {}
-
-    for (let user of this.userList) {
-      
-      let firstCharacter = user.name.charAt(0);
-
-      if(!alfa[firstCharacter]) {
-        alfa[firstCharacter] = [user]
-      } else {
-        alfa[firstCharacter].push(user)
-      }
-
-    }
-    
+    this.userList.sort((a, b) => a.wxFullName.toLowerCase().localeCompare(b.wxFullName.toLowerCase()));
   }
 
-  openMessagesPage(username:string) {
-    if( window.innerWidth < 701){
+  openMessagesPage(username: string) {
+    if (window.innerWidth < 701) {
       this.createRoom(username);
     }
-    else{
+    else {
       let body = {
         username: username,
       }
@@ -100,27 +88,36 @@ export class ContactsPage implements OnInit {
 
           this.loading = false
         }, this.room._id);
-        
-      }, ()=> {
+
+      }, () => {
         this.loading = false
       });
     }
   }
 
-  loadUsers() {
-    this.ChatSystemService.getUser()
+  async loadUsers() {
+    /* this.ChatSystemService.getUser() */
+    let users = await this.contactsRepositoryService.getUsers()
+    if (users.isOk()) {
+      this.originalUserList = users.value.data
+      this.userList = [...this.originalUserList];
+      this.userList.sort((a, b) => a.wxFullName.toLowerCase().localeCompare(b.wxFullName.toLowerCase()));
+      console.log(users.value.data)
+    }
   }
 
   separateLetter(record, recordIndex, records) {
-    if(recordIndex == 0) {
-      return record.name[0];
+    const normalize = (str) => str.normalize('NFD').replace(/[\u0300-\u036f]/g, '');
+
+    if (recordIndex == 0) {
+      return normalize(record.wxFullName[0]).toUpperCase();
     }
 
-    let first_prev = records[recordIndex - 1].name[0];
-    let first_current = record.name[0];
+    let firstPrev = normalize(records[recordIndex - 1].wxFullName[0]).toUpperCase();
+    let firstCurrent = normalize(record.wxFullName[0]).toUpperCase();
 
-    if(first_prev != first_current) {
-      return first_current;
+    if (firstPrev !== firstCurrent) {
+      return firstCurrent;
     }
     return null;
   }
@@ -129,24 +126,24 @@ export class ContactsPage implements OnInit {
   }
 
   close() {
-    if(this.roomId) {
-      this.backToChat.emit({roomId: this.roomId});
+    if (this.roomId) {
+      this.backToChat.emit({ roomId: this.roomId });
     } else {
       this.closeAllDesktopComponents.emit();
     }
-    
+
   }
 
   clicked() {
-    
+
   }
 
-  createRoom(username:string){
+  createRoom(username: string) {
     let body = {
       username: username,
     }
     this.chatService.createRoom(body).subscribe(res => {
-      
+
       this.room = res['room'];
       this.openMessagesModal(this.room._id);
       this.ChatSystemService.getAllRooms()
@@ -155,7 +152,7 @@ export class ContactsPage implements OnInit {
 
   async openMessagesModal(roomId: any) {
 
-    
+
 
     const modal = await this.modalController.create({
       component: MessagesPage,
@@ -169,10 +166,10 @@ export class ContactsPage implements OnInit {
     await modal.present();
   }
 
-  async openMessages(username:string){
+  async openMessages(username: string) {
     /* this.close(); */
 
-    let dm:any;
+    let dm: any;
     //Create new room
     this.createRoom(username);