diff --git a/src/app/users/users-achievements/users-achievements-update.component.ts b/src/app/users/users-achievements/users-achievements-update.component.ts index c3d162ead4..74112aa119 100644 --- a/src/app/users/users-achievements/users-achievements-update.component.ts +++ b/src/app/users/users-achievements/users-achievements-update.component.ts @@ -67,12 +67,18 @@ export class UsersAchievementsUpdateComponent implements OnInit, OnDestroy, CanC catchError(() => this.usersAchievementsService.getAchievements(this.user._id)) ) .subscribe((achievements) => { - this.editForm.patchValue(achievements); - this.editForm.controls.achievements = this.fb.array(achievements.achievements || []); - this.editForm.controls.references = this.fb.array(achievements.references || []); - this.editForm.controls.links = this.fb.array(achievements.links || []); + this.editForm.patchValue({ + purpose: achievements.purpose, + goals: achievements.goals, + achievementsHeader: achievements.achievementsHeader, + sendToNation: achievements.sendToNation, + dateSortOrder: achievements.dateSortOrder || 'none' + }); + this.editForm.setControl('achievements', this.buildAchievementsFormArray(achievements.achievements)); + this.editForm.setControl('references', this.buildReferencesFormArray(achievements.references)); + this.editForm.setControl('links', this.buildLinksFormArray(achievements.links)); // Keeping older otherInfo property so we don't lose this info on database - this.editForm.controls.otherInfo = this.fb.array(achievements.otherInfo || []); + this.editForm.setControl('otherInfo', this.buildOtherInfoFormArray(achievements.otherInfo)); if (this.docInfo._id === achievements._id) { this.docInfo._rev = achievements._rev; @@ -82,6 +88,8 @@ export class UsersAchievementsUpdateComponent implements OnInit, OnDestroy, CanC }, (error) => { console.log(error); this.achievementNotFound = true; + this.captureInitialState(); + this.onFormChanges(); }); this.planetStepListService.stepMoveClick$.pipe(takeUntil(this.onDestroy$)).subscribe( @@ -104,37 +112,17 @@ export class UsersAchievementsUpdateComponent implements OnInit, OnDestroy, CanC onFormChanges() { this.editForm.valueChanges .pipe( - debounce(() => race(interval(200), of(true))) + debounce(() => race(interval(200), of(true))), + takeUntil(this.onDestroy$) ) - .subscribe(() => { - const currentState = JSON.stringify({ - editForm: { - ...this.editForm.value, - achievements: this.achievements.value, - references: this.references.value, - links: this.links.value - }, - profileForm: this.profileForm.value - }); - this.hasUnsavedChanges = currentState !== this.initialFormValues; - }); + .subscribe(() => this.updateUnsavedChangesFlag()); this.profileForm.valueChanges .pipe( - debounce(() => race(interval(200), of(true))) + debounce(() => race(interval(200), of(true))), + takeUntil(this.onDestroy$) ) - .subscribe(() => { - const currentState = JSON.stringify({ - editForm: { - ...this.editForm.value, - achievements: this.achievements.value, - references: this.references.value, - links: this.links.value - }, - profileForm: this.profileForm.value - }); - this.hasUnsavedChanges = currentState !== this.initialFormValues; - }); + .subscribe(() => this.updateUnsavedChangesFlag()); } ngOnDestroy() { @@ -171,6 +159,63 @@ export class UsersAchievementsUpdateComponent implements OnInit, OnDestroy, CanC }); } + private buildAchievementsFormArray(achievements: any[] = []) { + return this.fb.array(achievements.map((achievement) => this.createAchievementGroup(achievement))); + } + + private buildReferencesFormArray(references: any[] = []) { + return this.fb.array(references.map((reference) => this.createReferenceGroup(reference))); + } + + private buildLinksFormArray(links: any[] = []) { + return this.fb.array(links.map((link) => this.createLinkGroup(link))); + } + + private buildOtherInfoFormArray(otherInfo: any[] = []) { + return this.fb.array(otherInfo); + } + + private createAchievementGroup(achievement: any = { title: '', description: '', link: '', date: '' }) { + if (typeof achievement === 'string') { + achievement = { title: '', description: achievement, link: '', date: '' }; + } + return this.fb.group({ + title: [ achievement.title || '', CustomValidators.required ], + description: [ achievement.description || '' ], + link: [ achievement.link || '', [], CustomValidators.validLink ], + date: [ achievement.date || '', null, ac => this.validatorService.notDateInFuture$(ac) ] + }); + } + + private createReferenceGroup(reference: any = { name: '' }) { + return this.fb.group({ + name: [ reference.name || '', CustomValidators.required ], + relationship: reference.relationship || '', + phone: reference.phone || '', + email: [ reference.email || '', Validators.email ] + }); + } + + private createLinkGroup(link: any = { title: '', url: '' }) { + return this.fb.group({ + title: [ link.title || '', CustomValidators.required ], + url: [ link.url || '', CustomValidators.required, CustomValidators.validLink ] + }); + } + + private updateUnsavedChangesFlag() { + const currentState = JSON.stringify({ + editForm: { + ...this.editForm.value, + achievements: this.achievements.value, + references: this.references.value, + links: this.links.value + }, + profileForm: this.profileForm.value + }); + this.hasUnsavedChanges = currentState !== this.initialFormValues; + } + addAchievement(index = -1, achievement = { title: '', description: '', link: '', date: '' }) { if (typeof achievement === 'string') { achievement = { title: '', description: achievement, link: '', date: '' };