diff --git a/src/app/components/friend-page/friend-page.component.html b/src/app/components/friend-page/friend-page.component.html index 5f698b9..8cccf93 100644 --- a/src/app/components/friend-page/friend-page.component.html +++ b/src/app/components/friend-page/friend-page.component.html @@ -52,7 +52,7 @@ class="w-full p-2 border rounded-lg dark:bg-gray-700 dark:text-white" placeholder="Rechercher un ami..." [(ngModel)]="searchTerm" - (ngModelChange)="searchUser($event)" + (ngModelChange)="onSearchTermChange($event)" />
diff --git a/src/app/components/friend-page/friend-page.component.ts b/src/app/components/friend-page/friend-page.component.ts index 0680691..0cbf0a0 100644 --- a/src/app/components/friend-page/friend-page.component.ts +++ b/src/app/components/friend-page/friend-page.component.ts @@ -4,6 +4,7 @@ import { FriendsService } from '../../services/friends/friends.service'; import { FormsModule, NgModel } from '@angular/forms'; import { UserService } from '../../services/user/user.service'; import { LocalStorageService } from '../../services/local-storage/local-storage.service'; +import { debounceTime, distinctUntilChanged, Subject } from 'rxjs'; @Component({ selector: 'app-friend-page', @@ -29,11 +30,23 @@ export class FriendPageComponent implements OnInit { hasAcceptedFriends: boolean = false; hasPendingFriends: boolean = false;; searchTerm: string = ''; + searchTermChanged = new Subject(); - constructor(private friendService: FriendsService, private userService:UserService, private localStorage: LocalStorageService) {} + + constructor(private friendService: FriendsService, private userService:UserService, private localStorage: LocalStorageService) { + + } ngOnInit(): void { this.getFriendData(); + this.searchTermChanged + .pipe( + debounceTime(200), + distinctUntilChanged() + ) + .subscribe((username: string) => { + this.searchUser(username); + }); } protected searchUser(username: string) { @@ -46,6 +59,20 @@ export class FriendPageComponent implements OnInit { } } + onSearchTermChange(username: string) { + this.searchTermChanged.next(username); + } + + private getUserData(search:string): void{ + const username = this.localStorage.getUsername() + this.userService.getUser('^(?!'+username+')'+search).subscribe((data:any[]) => { + if (data.length > 0) { + const existingFriendIds = this.listFriend.map(friend => friend.friend_user_id); + this.listUser = data.filter(user => !existingFriendIds.includes(user.uid)); + } + }) + } + protected addUser(user_id:string): void { this.friendService.addFriend(user_id).subscribe((data:any) => { if(data.id){ @@ -59,16 +86,6 @@ export class FriendPageComponent implements OnInit { }) } - private getUserData(search:string): void{ - const username = this.localStorage.getUsername() - this.userService.getUser('^(?!'+username+')'+search).subscribe((data:any[]) => { - if (data.length > 0) { - const existingFriendIds = this.listFriend.map(friend => friend.friend_user_id); - this.listUser = data.filter(user => !existingFriendIds.includes(user.uid)); - } - }) - } - private getFriendData(): void { this.friendService.getFriend().subscribe((data: any[]) => { if (data.length > 0) {