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) {