diff --git a/src/app/components/contacts/contacts.component.ts b/src/app/components/contacts/contacts.component.ts index 6e90989..24ea451 100644 --- a/src/app/components/contacts/contacts.component.ts +++ b/src/app/components/contacts/contacts.component.ts @@ -5,7 +5,7 @@ import { ContactDetailComponent } from './contact-detail/contact-detail.componen import { FirebaseService } from '../../services/firebase.service'; import { TranslateModule } from '@ngx-translate/core'; import { UserService } from '../../services/user.service'; -import { finalize, Subject, takeUntil } from 'rxjs'; +import { finalize, firstValueFrom, Subject, takeUntil } from 'rxjs'; import { OverlayService } from '../../services/overlay.service'; import { UpdateNotifierService } from '../../services/update-notifier.service'; @@ -32,44 +32,57 @@ export class ContactsComponent { private updateNotifierService: UpdateNotifierService ) {} - /** - * Trigger onResize when the component is initialized - */ ngOnInit(): void { this.onResize(); - this.loadAllUsers(); - this.loadCurrentUser(); - this.subscribeToUserUpdates(); + this.initializeData(); } - loadAllUsers(): void { + private async initializeData(): Promise { + try { + await this.loadAllUsers(); + this.loadCurrentUser(); + this.subscribeToUserUpdates(); + } catch (error) { + console.error('Error during initialization:', error); + } + } + + private async loadAllUsers(): Promise { this.isLoading = true; - - this.userService - .getUsers() - .pipe(finalize(() => (this.isLoading = false))) - .subscribe({ - next: (response) => { - this.allUsers = response; - }, - error: (err) => { - console.error('Error loading the tasks:', err); - }, - }); + try { + const response = await firstValueFrom( + this.userService + .getUsers() + .pipe(finalize(() => (this.isLoading = false))) + ); + this.allUsers = response; + } catch (err) { + console.error('Error loading the users:', err); + } } - private subscribeToUserUpdates() { + private async subscribeToUserUpdates(): Promise { this.updateNotifierService.contactUpdated$ .pipe(takeUntil(this.destroy$)) - .subscribe((userId: string) => { - this.selectedUserId = userId; - this.loadAllUsers(); + .subscribe(async (userId: string) => { + this.selectedUserId = null; + try { + await this.loadAllUsers(); + this.selectedUserId = userId; + } catch (error) { + console.error('Error while waiting for user load:', error); + } }); } - loadCurrentUser(): void { - this.userService.getCurrentUser().subscribe((userData) => { - this.currentUser = userData; + private loadCurrentUser(): void { + this.userService.getCurrentUser().subscribe({ + next: (userData) => { + this.currentUser = userData; + }, + error: (err) => { + console.error('Error loading current user:', err); + }, }); } @@ -119,4 +132,9 @@ export class ContactsComponent { this.showAllUsers = true; } } + + ngOnDestroy(): void { + this.destroy$.next(); + this.destroy$.complete(); + } } diff --git a/src/app/services/api.service.ts b/src/app/services/api.service.ts index 8d501e8..acfc6b0 100644 --- a/src/app/services/api.service.ts +++ b/src/app/services/api.service.ts @@ -81,4 +81,8 @@ export class ApiService { saveNewUser(user: User): Observable { return this.request('POST', '/api/users/', user); } + + updateUser(user: User, userId: string): Observable { + return this.request('PATCH', `/api/users/${userId}/`, user); + } } diff --git a/src/app/services/toast-notification.servic.ts b/src/app/services/toast-notification.servic.ts index 44a9fc0..919617a 100755 --- a/src/app/services/toast-notification.servic.ts +++ b/src/app/services/toast-notification.servic.ts @@ -45,6 +45,10 @@ export class ToastNotificationService { this.createSuccessToast('Contact deleted successfully!', 'Contact Deleted'); } + updateContactSuccessToast(): void { + this.createSuccessToast('Contact updated successfully!', 'Contact Updated'); + } + // Helperfunctions createSuccessToast(message: string, title: string = 'Success'): void { diff --git a/src/app/shared/components/overlay/contact-overlay/contact-form/contact-form.component.ts b/src/app/shared/components/overlay/contact-overlay/contact-form/contact-form.component.ts index 07596d8..2d27696 100644 --- a/src/app/shared/components/overlay/contact-overlay/contact-form/contact-form.component.ts +++ b/src/app/shared/components/overlay/contact-overlay/contact-form/contact-form.component.ts @@ -223,11 +223,30 @@ export class ContactFormComponent implements OnInit, OnChanges { this.newColor && this.newColor !== '' ? this.newColor : this.currentColor || this.randomColor; - this.saveContact(); + + if (this.selectedUserExists) { + this.updateContact(); + } else { + this.saveNewContact(); + } } } - async saveContact() { + async updateContact() { + try { + const snakeCaseUserData = this.convertCamelToSnake(this.contactData); + const updatedUser = await lastValueFrom( + this.apiService.updateUser(snakeCaseUserData, this.selectedUser.id) + ); + this.toastNotificationService.updateContactSuccessToast(); + this.updateNotifierService.notifyUpdate('contact', updatedUser.id); + this.closeDialog(); + } catch (error) { + console.error('Error updating the contact:', error); + } + } + + async saveNewContact() { try { const userData: User = { firstName: this.contactData.firstName, @@ -249,7 +268,7 @@ export class ContactFormComponent implements OnInit, OnChanges { this.updateNotifierService.notifyUpdate('contact', savedUser.id); this.closeDialog(); } catch (error) { - console.error('Fehler beim Speichern des Kontakts:', error); + console.error('Error saving the contact:', error); } }