fix(profile-settings): updated education and employment

src/app/features/settings/profile-settings/components/education-form/education-form.component.html

@@ -4,14 +4,12 @@ <h2>
       {{ 'settings.profileSettings.education.title' | translate: { index: index() + 1 } }}
     </h2>
 
-    @if (showRemove()) {
-      <p-button
-        [label]="'common.buttons.remove' | translate"
-        severity="danger"
-        variant="text"
-        (click)="remove.emit()"
-      />
-    }
+    <p-button
+      [label]="'common.buttons.remove' | translate"
+      severity="danger"
+      variant="text"
+      (onClick)="remove.emit()"
+    />
   </div>
 
   <div class="flex flex-column row-gap-4">

src/app/features/settings/profile-settings/components/education-form/education-form.component.ts

@@ -32,7 +32,6 @@ export class EducationFormComponent implements OnInit {
 
   group = input.required<FormGroup>();
   index = input.required<number>();
-  showRemove = input(false);
   remove = output<void>();
 
   get institutionControl() {

src/app/features/settings/profile-settings/components/education/education.component.html

@@ -1,14 +1,7 @@
 <form [formGroup]="educationForm">
   <div formArrayName="educations" class="flex flex-column row-gap-4">
-    @if (educations.controls.length) {
-      @for (education of educations.controls; track $index; let index = $index) {
-        <osf-education-form
-          [group]="education"
-          [index]="index"
-          [showRemove]="educations.controls.length > 1"
-          (remove)="removeEducation(index)"
-        ></osf-education-form>
-      }
+    @for (education of educations.controls; track $index; let index = $index) {
+      <osf-education-form [group]="education" [index]="index" (remove)="removeEducation(index)"></osf-education-form>
     }
   </div>
 </form>

src/app/features/settings/profile-settings/components/education/education.component.ts

@@ -54,11 +54,7 @@ export class EducationComponent {
   }
 
   removeEducation(index: number): void {
-    if (this.educations.length > 1) {
-      this.educations.removeAt(index);
-    } else {
-      this.educations.reset();
-    }
+    this.educations.removeAt(index);
   }
 
   addEducation(): void {
@@ -157,16 +153,12 @@ export class EducationComponent {
 
     this.educations.clear();
 
-    if (!educations?.length) {
-      this.addEducation();
-      this.cd.markForCheck();
-      return;
+    if (educations?.length) {
+      educations
+        .map((education) => mapEducationToForm(education))
+        .forEach((education) => this.educations.push(this.createEducationFormGroup(education)));
     }
 
-    educations
-      .map((education) => mapEducationToForm(education))
-      .forEach((education) => this.educations.push(this.createEducationFormGroup(education)));
-
     this.cd.markForCheck();
   }
 }

src/app/features/settings/profile-settings/components/employment-form/employment-form.component.html

@@ -4,14 +4,12 @@ <h2>
       {{ 'settings.profileSettings.employment.title' | translate: { index: index() + 1 } }}
     </h2>
 
-    @if (showRemove()) {
-      <p-button
-        [label]="'common.buttons.remove' | translate"
-        severity="danger"
-        variant="text"
-        (onClick)="remove.emit()"
-      />
-    }
+    <p-button
+      [label]="'common.buttons.remove' | translate"
+      severity="danger"
+      variant="text"
+      (onClick)="remove.emit()"
+    />
   </div>
 
   <div class="flex flex-column row-gap-4">

src/app/features/settings/profile-settings/components/employment-form/employment-form.component.ts

@@ -32,7 +32,6 @@ export class EmploymentFormComponent implements OnInit {
 
   group = input.required<FormGroup>();
   index = input.required<number>();
-  showRemove = input(false);
   remove = output<void>();
 
   get titleControl() {

src/app/features/settings/profile-settings/components/employment/employment.component.html

@@ -1,14 +1,7 @@
 <form [formGroup]="employmentForm">
   <div formArrayName="positions" class="flex flex-column row-gap-4">
-    @if (positions.controls.length) {
-      @for (position of positions.controls; track index; let index = $index) {
-        <osf-employment-form
-          [group]="position"
-          [index]="index"
-          [showRemove]="positions.controls.length > 1"
-          (remove)="removePosition(index)"
-        ></osf-employment-form>
-      }
+    @for (position of positions.controls; track index; let index = $index) {
+      <osf-employment-form [group]="position" [index]="index" (remove)="removePosition(index)"></osf-employment-form>
     }
   </div>
 </form>

src/app/features/settings/profile-settings/components/employment/employment.component.ts

@@ -55,11 +55,7 @@ export class EmploymentComponent {
   }
 
   removePosition(index: number): void {
-    if (this.positions.length > 1) {
-      this.positions.removeAt(index);
-    } else {
-      this.positions.reset();
-    }
+    this.positions.removeAt(index);
   }
 
   addPosition(): void {
@@ -93,11 +89,11 @@ export class EmploymentComponent {
       return;
     }
 
-    const formattedEmployment = this.positions.value.map((position) => mapFormToEmployment(position));
+    const employments = this.positions.value.map(mapFormToEmployment);
     this.loaderService.show();
 
     this.actions
-      .updateProfileSettingsEmployment(formattedEmployment)
+      .updateProfileSettingsEmployment(employments)
       .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe({
         next: () => {
@@ -112,18 +108,6 @@ export class EmploymentComponent {
     const employment = this.employment();
     const formPositions = this.positions.value;
 
-    if (!employment?.length) {
-      return formPositions.some(
-        (position) =>
-          position.title?.trim() ||
-          position.institution?.trim() ||
-          position.department?.trim() ||
-          position.startDate ||
-          position.endDate ||
-          position.ongoing
-      );
-    }
-
     if (formPositions.length !== employment.length) {
       return true;
     }
@@ -157,16 +141,12 @@ export class EmploymentComponent {
     const employment = this.employment();
     this.positions.clear();
 
-    if (!employment?.length) {
-      this.addPosition();
-      this.cd.markForCheck();
-      return;
+    if (employment?.length) {
+      employment
+        .map((x) => mapEmploymentToForm(x))
+        .forEach((x) => this.positions.push(this.createEmploymentFormGroup(x)));
     }
 
-    employment
-      .map((x) => mapEmploymentToForm(x))
-      .forEach((x) => this.positions.push(this.createEmploymentFormGroup(x)));
-
     this.cd.markForCheck();
   }
 }

src/app/features/settings/profile-settings/helpers/employment-comparison.helper.ts

@@ -8,7 +8,7 @@ export function mapFormToEmployment(employment: EmploymentForm): Employment {
     title: employment.title,
     department: employment.department,
     institution: employment.institution,
-    startYear: employment.startDate?.getFullYear() ?? new Date().getFullYear(),
+    startYear: employment.startDate?.getFullYear() ?? null,
     startMonth: employment.startDate?.getMonth() + 1,
     endYear: employment.ongoing ? null : (employment.endDate?.getFullYear() ?? null),
     endMonth: employment.ongoing ? null : employment.endDate ? employment.endDate.getMonth() + 1 : null,
@@ -21,16 +21,15 @@ export function mapEmploymentToForm(employment: Employment): EmploymentForm {
     title: employment.title,
     department: employment.department,
     institution: employment.institution,
-    startDate: new Date(+employment.startYear, employment.startMonth - 1),
+    startDate: new Date(employment.startYear, employment.startMonth - 1),
     endDate: employment.ongoing
       ? null
       : employment.endYear && employment.endMonth
-        ? new Date(+employment.endYear, employment.endMonth - 1)
+        ? new Date(employment.endYear, employment.endMonth - 1)
         : null,
     ongoing: employment.ongoing,
   };
 }
-
 export function hasEmploymentChanges(formEmployment: EmploymentForm, initialEmployment: Employment): boolean {
   const formattedFormEmployment = mapFormToEmployment(formEmployment);
 

src/app/shared/constants/input-limits.const.ts

@@ -37,4 +37,4 @@ export const InputLimits = {
   },
 };
 
-export const forbiddenFileNameCharacters = /[()<>~!@$&*:;,"'\\|/?]/;
+export const forbiddenFileNameCharacters = /[()<>~!@$&*#%^:;,"'\\|/?]/;

src/app/shared/models/user/employment.model.ts

@@ -3,7 +3,7 @@ export interface Employment {
   institution: string;
   department: string;
   startMonth: number;
-  startYear: string | number;
+  startYear: number;
   endMonth: number | null;
   endYear: number | null;
   ongoing: boolean;