feat(structureDetails): add email field to "report an error" modal

src/app/shared/components/modal/modal.component.scss

@@ -56,6 +56,10 @@
     ::ng-deep .emphasized {
       color: $red;
     }
+    ::ng-deep .required-text-help {
+      display: flex;
+      padding-bottom: 8px;
+    }
     .footerModal {
       display: flex;
       margin-top: 8px;

src/app/structure-list/components/structure-details/structure-details.component.html

@@ -423,16 +423,29 @@
   [title]="'Signaler une erreur'"
   [opened]="structureErrorModalOpened"
   [validateLabel]="'Confirmer'"
+  [validateDisabled]="myText.value.length === 0 || (myText.value.length > 0 && !isUserEmailValid)"
   (closed)="$event ? sendErrorEmail(true, myText.value) : sendErrorEmail(false)"
 >
-  <p>
-    Votre commentaire sera envoyé à l’équipe Rés'in. Si vous souhaitez avoir un retour, merci de préciser votre contact.
-  </p>
+  <p class="required-text-help">Les champs marqués d'un <sup>*</sup> sont obligatoires.<br /></p>
   <app-textarea
     #myText
     class="errorTextarea"
     id="errorTextarea"
-    label=""
     placeholder="Décrivez l'erreur ici. Ex: Horaires faux..."
+    [label]="'Votre commentaire sera envoyé à l\'équipe Rés\'in :'"
+    [required]="true"
+    [status]="myText.value.length > 0 ? 'success' : 'error'"
+  />
+  <app-input
+    id="email"
+    type="email"
+    label="Vous souhaitez être tenu au courant, renseignez votre adresse email :"
+    size="large"
+    autocomplete="on"
+    [status]="userEmail ? (isUserEmailValid ? 'success' : 'error') : null"
+    [statusText]="getEmailStatusText()"
+    [externalStatusControl]="true"
+    [value]="userEmail"
+    (valueChange)="validateEmail($event)"
   />
 </app-modal>

src/app/structure-list/components/structure-details/structure-details.component.ts

@@ -9,6 +9,7 @@ import { ProfileService } from '../../../profile/services/profile.service';
 import { AuthService } from '../../../services/auth.service';
 import { StructureService } from '../../../services/structure.service';
 import { UserService } from '../../../services/user.service';
+import { CustomRegExp } from '../../../utils/CustomRegExp';
 import { Utils } from '../../../utils/utils';
 import { AccessModality } from '../../enum/access-modality.enum';
 import { Equipment } from '../../enum/equipment.enum';
@@ -53,6 +54,8 @@ export class StructureDetailsComponent implements OnInit {
   public Equipment = Equipment;
   public isInStructure = false;
   public hasTclInfo = true;
+  public userEmail: string;
+  public isUserEmailValid = true;
 
   @ViewChild('closeButton', { read: ElementRef }) closeButtonElement: ElementRef;
 
@@ -68,6 +71,14 @@ export class StructureDetailsComponent implements OnInit {
   ) {}
 
   async ngOnInit(): Promise<void> {
+    this.currentProfile = await this.profileService.getProfile();
+    if (this.currentProfile?.email) {
+      this.userEmail = this.currentProfile.email;
+      this.validateEmail(this.userEmail);
+    } else {
+      this.isUserEmailValid = true;
+    }
+
     this.route.data.subscribe((data) => {
       if (data.structure) {
         this.structure = new Structure(data.structure);
@@ -86,7 +97,6 @@ export class StructureDetailsComponent implements OnInit {
 
   private async initForm(): Promise<void> {
     if (this.userIsLoggedIn()) {
-      this.currentProfile = await this.profileService.getProfile();
       this.structureService.getStructureWithOwners(this.structure._id).subscribe((res) => {
         this.structureAdmins = res.owners;
         this.membersWithJobWithPO = res.owners.filter((owner) => owner.job?.hasPersonalOffer);
@@ -255,10 +265,23 @@ export class StructureDetailsComponent implements OnInit {
   public sendErrorEmail(shouldSend: boolean, content?: string): void {
     this.displayModalError();
     if (shouldSend && content) {
+      if (this.userEmail) {
+        content += '\n\nEmail à tenir au courant : ' + this.userEmail;
+      }
+      content = content.replace(/\n/g, '<br />');
       this.structureService.sendMailOnStructureError(this.structure._id, content).subscribe();
     }
   }
 
+  public validateEmail(email: string): void {
+    this.userEmail = email.trim();
+    this.isUserEmailValid = this.userEmail === '' || CustomRegExp.EMAIL.test(this.userEmail);
+  }
+
+  public getEmailStatusText(): string {
+    return `Adresse email ${this.isUserEmailValid ? 'valide' : 'invalide'}`;
+  }
+
   public goToWebsite(): void {
     let url = this.structure.website;
     if (!url.startsWith('http')) {