src/app/admin/components/panel/panel.component.html

@@ -3,14 +3,16 @@
   <div fxLayout="row" fxLayoutGap="20px" fxLayoutAlign="center center">
     <button (click)="changeActiveFeature(features.pendingStructures)">Revendication structure</button>
     <button (click)="changeActiveFeature(features.structuresList)">Liste structures</button>
-    <button (click)="changeActiveFeature(features.deleteUsers)">Gestion des utilisateurs</button>
+    <button (click)="changeActiveFeature(features.manageUsers)">Gestion des utilisateurs</button>
     <button (click)="changeActiveFeature(features.newsletterUsers)">Newsletter</button>
+    <button (click)="changeActiveFeature(features.jobsList)">Fonctions</button>
+    <button (click)="changeActiveFeature(features.employersList)">Employeurs</button>
     <a target="_blank" class="custom-link" rel="noopener noreferrer" [href]="ghostLink">Ghost</a>
   </div>
   <div *ngIf="selectedFeature === features.structuresList">
     <app-admin-structures-list></app-admin-structures-list>
   </div>
-  <div *ngIf="selectedFeature === features.deleteUsers">
+  <div *ngIf="selectedFeature === features.manageUsers">
     <app-admin-manage-users></app-admin-manage-users>
   </div>
   <div *ngIf="selectedFeature === features.pendingStructures">
@@ -19,4 +21,10 @@
   <div *ngIf="selectedFeature === features.newsletterUsers">
     <app-admin-newsletter-users></app-admin-newsletter-users>
   </div>
+  <div *ngIf="selectedFeature === features.jobsList">
+    <app-admin-manage-jobs></app-admin-manage-jobs>
+  </div>
+  <div *ngIf="selectedFeature === features.employersList">
+    <app-admin-manage-employers></app-admin-manage-employers>
+  </div>
 </div>

src/app/admin/components/panel/panel.component.ts

 import { Component, OnInit } from '@angular/core';
 import { environment } from '../../../../environments/environment';
 import { AdminPannelEnum } from '../../../shared/enum/adminPanel.enum';
+import { PanelRouteService } from '../../services/panel-route.service';
 
 @Component({
   selector: 'app-admin-panel',
   templateUrl: './panel.component.html',
+  providers: [PanelRouteService],
 })
 export class PanelComponent implements OnInit {
   public features = AdminPannelEnum;
   public ghostLink = environment.ghostAdmin;
   public selectedFeature;
 
-  constructor() {}
+  constructor(private panelRouteService: PanelRouteService) {
+    this.panelRouteService.destinationChanged$.subscribe((selected: AdminPannelEnum) => {
+      this.selectedFeature = selected;
+    });
+  }
 
   ngOnInit(): void {
     this.selectedFeature = this.features.pendingStructures;

src/app/admin/components/structures-list/admin-structures-list.component.html

@@ -4,7 +4,7 @@
 <div *ngIf="!isLoading" fxLayout="column" fxLayoutAlign="center center">
   <table aria-describedby="demands attachment results" class="results-tab results-column">
     <thead>
-      <th scope="col">
+      <th colspan="2" scope="colgroup">
         Structures avec des données manquantes ({{ structuresIncomplete ? structuresIncomplete.length : 0 }})
       </th>
     </thead>
@@ -15,6 +15,9 @@
             {{ structure.structureName }}</a
           >
         </td>
+        <td class="structure-updated-at">
+          <span [ngClass]="{ isOutdated: structure.isOutdated }">{{ structure.updatedAt | date: 'mediumDate' }}</span>
+        </td>
       </tr>
       <tr *ngIf="!structuresIncomplete?.length">
         <td colspan="3">Aucune structure</td>
@@ -23,13 +26,16 @@
   </table>
   <table aria-describedby="demands attachment results" class="results-tab results-column">
     <thead>
-      <th scope="col">Structures en cours de revendication ({{ structuresInClaim.length }})</th>
+      <th colspan="2" scope="colgroup">Structures en cours de revendication ({{ structuresInClaim.length }})</th>
     </thead>
     <tbody>
       <tr *ngFor="let structure of structuresInClaim">
         <td>
           <a href="/acteurs?id={{ structure.structureId }}" target="_blank"> {{ structure.structureName }}</a>
         </td>
+        <td class="structure-updated-at">
+          <span [ngClass]="{ isOutdated: structure.isOutdated }">{{ structure.updatedAt | date: 'mediumDate' }}</span>
+        </td>
       </tr>
       <tr *ngIf="!structuresInClaim?.length">
         <td colspan="3">Aucune structure</td>
@@ -38,13 +44,16 @@
   </table>
   <table aria-describedby="demands attachment results" class="results-tab results-column">
     <thead>
-      <th scope="col">Structures à revendiquer ({{ structuresToClaim.length }})</th>
+      <th colspan="2" scope="colgroup">Structures à revendiquer ({{ structuresToClaim.length }})</th>
     </thead>
     <tbody>
       <tr *ngFor="let structure of structuresToClaim">
         <td>
           <a href="/acteurs?id={{ structure.structureId }}" target="_blank"> {{ structure.structureName }}</a>
         </td>
+        <td class="structure-updated-at">
+          <span [ngClass]="{ isOutdated: structure.isOutdated }">{{ structure.updatedAt | date: 'mediumDate' }}</span>
+        </td>
       </tr>
       <tr *ngIf="!structuresToClaim?.length">
         <td colspan="3">Aucune structure</td>
@@ -53,13 +62,16 @@
   </table>
   <table aria-describedby="demands attachment results" class="results-tab results-column">
     <thead>
-      <th scope="col">Structures revendiquées ({{ structuresClaimed.length }})</th>
+      <th colspan="2" scope="colgroup">Structures revendiquées ({{ structuresClaimed.length }})</th>
     </thead>
     <tbody>
       <tr *ngFor="let structure of structuresClaimed">
         <td>
           <a href="/acteurs?id={{ structure.structureId }}" target="_blank"> {{ structure.structureName }}</a>
         </td>
+        <td class="structure-updated-at">
+          <span [ngClass]="{ isOutdated: structure.isOutdated }">{{ structure.updatedAt | date: 'mediumDate' }}</span>
+        </td>
       </tr>
       <tr *ngIf="!structuresClaimed?.length">
         <td colspan="3">Aucune structure</td>

src/app/admin/services/admin.service.ts

 import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
+import { Employer } from '../../models/employer.model';
+import { Job } from '../../models/job.model';
 import { NewsletterSubscription } from '../../models/subscription-model';
 import { User } from '../../models/user.model';
 import { StructureAdminInfo } from '../models/demandAttachment.model';
@@ -10,6 +12,8 @@ import { StructureAdminInfo } from '../models/demandAttachment.model';
 })
 export class AdminService {
   private readonly baseUrl = 'api/admin';
+  private readonly jobBaseUrl = 'api/jobs';
+  private readonly employerBaseUrl = 'api/employer';
   constructor(private http: HttpClient) {}
 
   // Return pendingAttachments of all profiles.
@@ -26,19 +30,61 @@ export class AdminService {
   }
 
   public getUsers(): Observable<User[]> {
-    return this.http.get<User[]>(`api/admin/searchUsers`);
+    return this.http.get<User[]>(`${this.baseUrl}/searchUsers`);
   }
 
   public getAttachedUsers(): Observable<User[]> {
-    return this.http.get<User[]>(`api/admin/getAttachedUsers`);
+    return this.http.get<User[]>(`${this.baseUrl}/attachedUsers`);
   }
 
   public getUnAttachedUsers(): Observable<User[]> {
-    return this.http.get<User[]>(`api/admin/getUnAttachedUsers`);
+    return this.http.get<User[]>(`${this.baseUrl}/unAttachedUsers`);
   }
 
   public getUnVerifiedUsers(): Observable<User[]> {
-    return this.http.get<User[]>(`api/admin/getUnVerifiedUsers`);
+    return this.http.get<User[]>(`${this.baseUrl}/unVerifiedUsers`);
+  }
+
+  public setUserJob(jobId: string, userId: string): Observable<User> {
+    return this.http.put<User>(`${this.baseUrl}/setUserJob`, {
+      userId,
+      jobId,
+    });
+  }
+
+  public setUserEmployer(employerId: string, userId: string): Observable<User> {
+    return this.http.put<User>(`${this.baseUrl}/setUserEmployer`, {
+      userId,
+      employerId,
+    });
+  }
+
+  // By default return only validated jobs
+  public getJobs(): Observable<Job[]> {
+    return this.http.get<Job[]>(`api/jobs`);
+  }
+
+  // By default return only validated employers
+  public getEmployers(): Observable<Employer[]> {
+    return this.http.get<Employer[]>(`api/employer`);
+  }
+
+  // populated with users for admin purposes
+  public getUnvalidatedJobs(): Observable<Job[]> {
+    return this.http.get<Job[]>(`${this.jobBaseUrl}/unvalidated`);
+  }
+
+  // populated with users for admin purposes
+  public getValidatedJobs(): Observable<Job[]> {
+    return this.http.get<Job[]>(`${this.jobBaseUrl}/validated`);
+  }
+
+  public getUnvalidatedEmployers(): Observable<Employer[]> {
+    return this.http.get<Employer[]>(`${this.employerBaseUrl}/unvalidated`);
+  }
+
+  public getValidatedEmployers(): Observable<Employer[]> {
+    return this.http.get<Employer[]>(`${this.employerBaseUrl}/validated`);
   }
 
   public searchUsers(searchString: string): Observable<User[]> {
@@ -49,6 +95,57 @@ export class AdminService {
     return this.http.delete<User>(`${this.baseUrl}/user/` + id);
   }
 
+  public deleteJob(id: string): Observable<Job> {
+    return this.http.delete<Job>(`${this.jobBaseUrl}/${id}`);
+  }
+
+  public deleteEmployer(id: string): Observable<Employer> {
+    return this.http.delete<Employer>(`${this.employerBaseUrl}/${id}`);
+  }
+
+  public createJob(name: string): Observable<Job> {
+    return this.http.post<Job>(`${this.jobBaseUrl}`, { name, hasPersonalOffer: true });
+  }
+
+  public createEmployer(name: string): Observable<Employer> {
+    return this.http.post<Employer>(`${this.employerBaseUrl}`, { name });
+  }
+
+  public validateJob(id: string): Observable<Job> {
+    return this.http.post<Job>(`${this.jobBaseUrl}/validate/${id}`, {});
+  }
+
+  public validateEmployer(id: string): Observable<Employer> {
+    return this.http.post<Employer>(`${this.employerBaseUrl}/validate/${id}`, {});
+  }
+
+  public editJob(id: string, name: string, hasPersonalOffer: boolean): Observable<Job> {
+    return this.http.put<Job>(`${this.jobBaseUrl}/${id}`, {
+      name,
+      hasPersonalOffer,
+    });
+  }
+
+  public editEmployer(id: string, name: string): Observable<Employer> {
+    return this.http.put<Employer>(`${this.employerBaseUrl}/${id}`, {
+      name,
+    });
+  }
+
+  public mergeEmployer(sourceEmployerId: string, targetEmployerId: string): Observable<Employer> {
+    return this.http.put<Employer>(`${this.employerBaseUrl}/merge`, {
+      sourceEmployerId,
+      targetEmployerId,
+    });
+  }
+
+  public mergeJob(sourceJobId: string, targetJobId: string): Observable<Job> {
+    return this.http.put<Job>(`${this.jobBaseUrl}/merge`, {
+      sourceJobId,
+      targetJobId,
+    });
+  }
+
   public searchNewsletterSubscriptions(searchString: string): Observable<NewsletterSubscription[]> {
     return this.http.post<NewsletterSubscription[]>(`${this.baseUrl}/searchNewsletterSubscriptions`, { searchString });
   }

src/app/admin/services/panel-route.service.ts

+import { Injectable } from '@angular/core';
+import { Subject } from 'rxjs';
+import { AdminPannelEnum } from '../../shared/enum/adminPanel.enum';
+
+@Injectable()
+export class PanelRouteService {
+  private destination = new Subject<AdminPannelEnum>();
+
+  destinationChanged$ = this.destination.asObservable();
+
+  redirectTo(dest: AdminPannelEnum) {
+    this.destination.next(dest);
+  }
+}

src/app/app-routing.module.ts

@@ -178,45 +178,31 @@ const routes: Routes = [
     ],
   },
   {
-    path: 'reset-password',
+    path: 'join/:id',
     children: [
       {
         path: '',
-        component: ResetPasswordComponent,
+        canActivate: [AuthGuard],
+        component: StructureJoinComponent,
+        resolve: {
+          structure: StructureResolver,
+        },
       },
-      footerOutletRoute,
     ],
   },
   {
-    path: 'new-password',
-    component: PasswordFormComponent,
-  },
-  {
-    path: 'create-structure',
+    path: 'reset-password',
     children: [
       {
         path: '',
-        component: FormComponent,
-        canDeactivate: [DeactivateGuard],
+        component: ResetPasswordComponent,
       },
       footerOutletRoute,
     ],
   },
   {
-    path: 'create-structure/:id',
-    children: [
-      {
-        path: '',
-        component: FormComponent,
-        canDeactivate: [DeactivateGuard],
-        canActivate: [RoleGuard],
-        data: { allowedRoles: [RouteRole.structureAdmin] },
-        resolve: {
-          structure: StructureResolver,
-        },
-      },
-      footerOutletRoute,
-    ],
+    path: 'new-password',
+    component: PasswordFormComponent,
   },
   {
     path: 'newsletter',

src/app/carto/carto.component.ts

@@ -112,7 +112,7 @@ export class CartoComponent implements OnInit {
         if (this.geolocation) {
           structure = this.getStructurePosition(structure, lon, lat);
         }
-        return this.structureService.updateOpeningStructure(structure);
+        return structure;
       })
     ).then((structureList) => {
       if (sortByDistance) {

src/app/form/footer-form/footer-form.component.html

@@ -8,15 +8,13 @@
   <app-button
     *ngIf="!isLastFormStep && !isNextFormTransition && !isStructureLastPage() && !isPersonalOfferFirstPage()"
     (action)="prevPage()"
-    [text]="btnName[0]"
+    [text]="!isEditMode ? btnName[0] : 'Annuler'"
     [iconType]="'form'"
-    [iconBtn]="'chevronLeft'"
+    [iconBtn]="!isEditMode && 'chevronLeft'"
   ></app-button>
 
-  <app-button *ngIf="isLastFormStep" (action)="goToHome()" [text]="'Ok'" [style]="buttonTypeEnum.Primary"></app-button>
-
   <app-button
-    *ngIf="!isLastFormStep && !isNextFormTransition"
+    *ngIf="!isLastFormStep && !isNextFormTransition && !isEditMode"
     (action)="nextPage()"
     [disabled]="!isValid"
     [text]="btnName[1]"
@@ -26,4 +24,13 @@
     [style]="buttonTypeEnum.Primary"
   >
   </app-button>
+
+  <app-button
+    *ngIf="isEditMode"
+    (action)="saveEdit()"
+    [disabled]="!isValid"
+    [text]="'Valider'"
+    [style]="buttonTypeEnum.Primary"
+  >
+  </app-button>
 </div>

src/app/form/footer-form/footer-form.component.ts

@@ -5,7 +5,6 @@ import { User } from '../../models/user.model';
 import { ProfileService } from '../../profile/services/profile.service';
 import { AuthService } from '../../services/auth.service';
 import { NewsletterService } from '../../services/newsletter.service';
-import { StructureService } from '../../services/structure.service';
 import { ButtonType } from '../../shared/components/button/buttonType.enum';
 import { Utils } from '../../utils/utils';
 import { accountFormStep } from '../form-view/account-form/accountFormStep.enum';
@@ -31,11 +30,13 @@ export class FooterFormComponent implements OnChanges {
   @Input() acceptNewsletter: boolean;
   @Input() currentStep: accountFormStep | profileFormStep | structureFormStep | personalOfferFormStep;
   @Input() hasOtherPersonalOffer: boolean;
+  @Input() isEditMode: boolean;
   @Output() goNext = new EventEmitter<any>();
   @Output() goPrev = new EventEmitter<any>();
   @Output() endPage = new EventEmitter<any>();
   @Output() endForm = new EventEmitter<any>();
   @Output() changeCurrentStep = new EventEmitter<any>();
+  @Output() saveEditedStructure = new EventEmitter<any>();
 
   public isLastFormStep: boolean = false;
   public isNextFormTransition: boolean = false;
@@ -45,7 +46,6 @@ export class FooterFormComponent implements OnChanges {
     private authService: AuthService,
     public utils: Utils,
     private router: Router,
-    private structureService: StructureService,
     private profileService: ProfileService,
     private newsletterService: NewsletterService
   ) {}
@@ -71,6 +71,13 @@ export class FooterFormComponent implements OnChanges {
           this.isLastFormStep = true;
         }
       }
+      if (
+        this.currentForm === formType.structure &&
+        (this.currentStep === structureFormStep.noStructure ||
+          this.currentStep === structureFormStep.StructureInfoUnknown)
+      ) {
+        this.isLastFormStep = true;
+      }
     }
   }
 
@@ -90,11 +97,15 @@ export class FooterFormComponent implements OnChanges {
   }
 
   public prevPage(): void {
-    if (this.currentForm === formType.structure && this.currentStep === structureFormStep.structureType) {
-      this.changeCurrentStep.emit(structureFormStep.structureFormTime);
-      return;
+    if (!this.isEditMode) {
+      if (this.currentForm === formType.structure && this.currentStep === structureFormStep.structureType) {
+        this.changeCurrentStep.emit(structureFormStep.structureFormTime);
+        return;
+      }
+      this.goToPreviousPage();
+    } else {
+      history.back();
     }
-    this.goToPreviousPage();
   }
   public async nextPage(): Promise<void> {
     if (this.currentForm === formType.account && this.currentStep === accountFormStep.accountNewsletter) {
@@ -113,7 +124,14 @@ export class FooterFormComponent implements OnChanges {
       if (this.currentStep === structureFormStep.structureChoiceCompletion) {
         const chooseCompleteStructInfo = this.form.get('choiceCompletion').value;
         if (!chooseCompleteStructInfo) {
-          this.changeCurrentStep.emit(structureFormStep.structureContactCompletion);
+          this.changeCurrentStep.emit(structureFormStep.StructureInfoUnknown);
+          return;
+        }
+      }
+      if (this.currentStep === structureFormStep.structureAccompanimentChoice) {
+        const hasPlaceOfReception = this.form.get('placeOfReception').value;
+        if (!hasPlaceOfReception) {
+          this.changeCurrentStep.emit(structureFormStep.noStructure);
           return;
         }
       }
@@ -140,6 +158,9 @@ export class FooterFormComponent implements OnChanges {
     }
     this.goToNextPage();
   }
+  public saveEdit(): void {
+    this.saveEditedStructure.emit();
+  }
 
   private isStructureChoiceValid(): boolean {
     return (
@@ -153,7 +174,9 @@ export class FooterFormComponent implements OnChanges {
     return (
       this.currentForm === formType.structure &&
       (this.currentStep === structureFormStep.mailSentInfo ||
-        this.currentStep === structureFormStep.structureCreationFinishedInfo)
+        this.currentStep === structureFormStep.structureCreationFinishedInfo ||
+        this.currentStep === structureFormStep.noStructure ||
+        this.currentStep === structureFormStep.StructureInfoUnknown)
     );
   }
 

src/app/form/form-view/account-form/account-credentials/account-credentials.component.scss

@@ -4,7 +4,7 @@
 p.special {
   @include lato-regular-14;
   color: $grey-3;
-  margin: 4px 0 8px 0;
+  margin: 4px 0;
   width: 280px;
   &.invalid {
     color: $orange-warning;

src/app/form/form-view/account-form/account-newsletter/account-newsletter.component.html

@@ -5,7 +5,7 @@
 >
   <div class="title">
     <h3>Souhaitez-vous vous abonner à la lettre d’information de Res'in&nbsp;?</h3>
-    <p class="notRequired" *ngIf="!isEditMode">Facultatif</p>
+    <p *ngIf="!isEditMode">Facultatif</p>
   </div>
   <app-checkbox-form
     [isChecked]="userAcceptNewsletter"

src/app/form/form-view/form-view-routing.module.ts

 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
+import { AdminGuard } from '../../guards/admin.guard';
 import { AuthGuard } from '../../guards/auth.guard';
+import { RoleGuard } from '../../guards/role.guard';
+import { StructureResolver } from '../../resolvers/structure.resolver';
+import { RouteRole } from '../../shared/enum/routeRole.enum';
 import { AccountFormComponent } from './account-form/account-form.component';
 import { FormViewComponent } from './form-view.component';
 import { PersonalOfferGuard } from './guards/personalOffer.guard';
@@ -9,6 +13,15 @@ import { ProfileFormComponent } from './profile-form/profile-form.component';
 import { StructureFormComponent } from './structure-form/structure-form.component';
 
 const routes: Routes = [
+  {
+    path: 'structure/:id/:step',
+    component: FormViewComponent,
+    canActivate: [RoleGuard],
+    data: { allowedRoles: [RouteRole.structureAdmin] },
+    resolve: {
+      structure: StructureResolver,
+    },
+  },
   {
     path: '',
     component: FormViewComponent,

src/app/form/form-view/form-view.component.html

-<div>
+<div class="formView">
   <app-progress-bar
     [formType]="formType[routeParam]"
     [isEditMode]="isEditMode"
@@ -29,14 +29,16 @@
     <ng-container *ngIf="formType[routeParam] === formType.structure">
       <app-structure-form
         [nbSteps]="nbSteps"
+        [structure]="structure"
         [structureForm]="structureForm"
         [hoursForm]="hoursForm"
         [currentStep]="currentPage"
-        [structure]="structure"
+        [isEditMode]="isEditMode"
         (goNext)="nextPage()"
         (isNotExistingStructure)="nextPage()"
         (pageValid)="validatePage($event)"
         (updateHoursForm)="updateHours($event)"
+        (setEditStep)="setCurrentStep($event)"
       ></app-structure-form>
     </ng-container>
     <ng-container *ngIf="formType[routeParam] === formType.personaloffer">
@@ -59,9 +61,11 @@
     [isValid]="isPageValid"
     [acceptNewsletter]="userAcceptNewsletter"
     [hasOtherPersonalOffer]="hasOtherPersonalOffer"
+    [isEditMode]="isEditMode"
     (goNext)="nextPage()"
     (goPrev)="prevPage()"
     (endForm)="endForm($event)"
     (changeCurrentStep)="setCurrentStep($event)"
+    (saveEditedStructure)="saveEditedStructure()"
   ></app-footer-form>
 </div>

src/app/form/form-view/form-view.component.scss

@@ -3,24 +3,43 @@
 @import '../../../assets/scss/layout';
 @import '../../../assets//scss/typography';
 
+.formView {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
 ::ng-deep.page {
-  max-width: 1000px;
   box-sizing: border-box;
+  max-width: 980px;
+  width: 100%;
+  height: 100%;
   margin: auto;
-  min-height: 450px;
-  max-height: 75vh;
   overflow-y: auto;
   color: $grey-1;
   background: $white;
   border-radius: 8px;
   border: 1px solid $grey-6;
   padding: 32px 48px;
+
+  @media #{$tablet} {
+    margin: 0px 4px;
+    width: auto;
+  }
   * {
-    max-width: 600px;
+    max-width: 700px;
   }
   .no-max-width {
     max-width: none;
   }
+  .missing-information {
+    display: flex;
+    color: $orange-warning;
+    align-items: center;
+    span {
+      margin-left: 1rem;
+    }
+  }
 }
 
 ::ng-deep.title {
@@ -30,6 +49,7 @@
     color: $grey-3;
     margin-bottom: 3px;
   }
+
   h3 {
     @include lato-bold-24;
     margin: 0;
@@ -43,6 +63,17 @@
     font-style: italic;
     margin-top: 4px;
   }
+  .backArrow {
+    cursor: pointer;
+  }
+  &.editTitle {
+    display: flex;
+    align-items: center;
+
+    p {
+      margin-bottom: 0;
+    }
+  }
 }
 
 ::ng-deep.textareaBlock {

src/app/form/form-view/form-view.component.ts

 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormControl, Validators, FormArray } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
 import { forkJoin, of } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
-import { Day } from '../../models/day.model';
 import { PersonalOffer } from '../../models/personalOffer.model';
 import { Structure } from '../../models/structure.model';
 import { StructureWithOwners } from '../../models/structureWithOwners.model';
-import { Time } from '../../models/time.model';
 import { User } from '../../models/user.model';
 import { ProfileService } from '../../profile/services/profile.service';
 import { PersonalOfferService } from '../../services/personal-offer.service';
 import { StructureService } from '../../services/structure.service';
 import { MustMatch } from '../../shared/validator/form';
 import { CustomRegExp } from '../../utils/CustomRegExp';
+import { formUtils } from '../../utils/formUtils';
 import { accountFormStep } from './account-form/accountFormStep.enum';
 import { formType } from './formType.enum';
 import { personalOfferFormStep } from './personal-offer-form/personalOfferFormStep.enum';
@@ -31,7 +30,7 @@ export class FormViewComponent implements OnInit {
   public currentPage: accountFormStep | profileFormStep | structureFormStep | personalOfferFormStep;
   public currentFormType: formType;
   public currentForm: FormGroup;
-
+  public formUtils = new formUtils();
   // Account Form
   public accountForm: FormGroup;
   public userAcceptNewsletter: boolean;
@@ -66,7 +65,6 @@ export class FormViewComponent implements OnInit {
   public isClaimMode: boolean = false;
   public isJoinMode: boolean = false;
   public claimStructure: boolean = false;
-  public isWifiChoosen: boolean;
   public linkedStructureId;
   public structureWithOwners: StructureWithOwners;
   public isPageValid: boolean = false;
@@ -106,24 +104,12 @@ export class FormViewComponent implements OnInit {
         this.linkedStructureId = data.user.pendingStructuresLink;
         this.currentPage = accountFormStep.accountInfo;
       }
-      //TODO: Edit mode
-      // if (data.structure) {
-      //   this.isEditMode = true;
-      //   this.isWifiChoosen = true;
-      //   const editStructure = new Structure(data.structure);
-      //   this.initForm(editStructure);
-      //   this.structureService.getStructureWithOwners(editStructure._id, this.profile).subscribe((s) => {
-      //     this.structureWithOwners = s;
-      //   });
-      // }
-    });
-
-    this.route.data.subscribe((data) => {
-      if (data.user) {
-        this.isAccountMode = true;
-      }
       if (data.structure) {
         this.isEditMode = true;
+        this.structure = data.structure;
+        this.editForm = this.formUtils.createStructureForm(data.structure, this.isEditMode);
+        this.structureForm = this.editForm;
+        this.hoursForm = this.formUtils.createHoursForm(data.structure);
       }
     });
 
@@ -157,27 +143,17 @@ export class FormViewComponent implements OnInit {
       this.currentForm = this.profileForm;
     }
     if (formType[this.routeParam] === formType.structure) {
-      this.nbSteps = totalFormSteps;
-      this.currentPage = structureFormStep.structureChoice;
-      this.currentFormType = formType.structure;
-      this.structure = new Structure();
-      this.createStructureForm(this.structure);
-      this.currentForm = this.structureForm;
-      //TODO: Edit mode
-      // if (this.isEditMode) {
-      //   this.editForm = this.createStructureForm(structure);
-      // }
-
+      if (!this.isEditMode) {
+        const PAGE_WITHOUT_COUNT_INCREMENT = 2;
+        this.nbSteps = structureFormSteps - PAGE_WITHOUT_COUNT_INCREMENT;
+        this.currentPage = structureFormStep.structureChoice;
+        this.currentFormType = formType.structure;
+        this.structure = new Structure();
+        this.structureForm = this.formUtils.createStructureForm(this.structure);
+        this.currentForm = this.structureForm;
+      }
       // Init hours form
-      this.hoursForm = new FormGroup({
-        monday: this.createDay(this.structure.hours.monday),
-        tuesday: this.createDay(this.structure.hours.tuesday),
-        wednesday: this.createDay(this.structure.hours.wednesday),
-        thursday: this.createDay(this.structure.hours.thursday),
-        friday: this.createDay(this.structure.hours.friday),
-        saturday: this.createDay(this.structure.hours.saturday),
-        sunday: this.createDay(this.structure.hours.sunday),
-      });
+      this.hoursForm = this.formUtils.createHoursForm(this.structure);
     }
     if (formType[this.routeParam] === formType.personaloffer) {
       this.nbSteps = totalFormSteps;
@@ -193,19 +169,6 @@ export class FormViewComponent implements OnInit {
     this.hoursForm = form;
   }
 
-  private createDay(day: Day): FormGroup {
-    return new FormGroup({
-      open: new FormControl(day.open, Validators.required),
-      time: new FormArray(day.time.map((oneTime) => this.createTime(oneTime))) as FormArray,
-    });
-  }
-  private createTime(time: Time): FormGroup {
-    return new FormGroup({
-      opening: new FormControl(time.opening),
-      closing: new FormControl(time.closing),
-    });
-  }
-
   private createAccountForm(email?: string): void {
     this.accountForm = new FormGroup(
       {
@@ -238,88 +201,10 @@ export class FormViewComponent implements OnInit {
     });
   }
 
-  private createStructureForm(structure): void {
-    this.structureForm = new FormGroup({
-      _id: new FormControl(structure._id),
-      coord: new FormControl(structure.coord),
-      structureType: new FormControl(structure.structureType, Validators.required),
-      structureName: new FormControl(structure.structureName, Validators.required),
-      description: new FormControl(structure.description),
-      lockdownActivity: new FormControl(structure.lockdownActivity),
-      address: new FormGroup({
-        numero: new FormControl(structure.address.numero),
-        street: new FormControl(structure.address.street, Validators.required),
-        commune: new FormControl(structure.address.commune, Validators.required),
-      }),
-      contactMail: new FormControl(structure.contactMail, [
-        Validators.required,
-        Validators.pattern(CustomRegExp.EMAIL),
-      ]),
-      contactPhone: new FormControl(structure.contactPhone, [
-        Validators.required,
-        Validators.pattern(CustomRegExp.PHONE),
-      ]),
-      contactPersonFirstname: new FormControl(structure.contactPersonLastname, Validators.required),
-      contactPersonLastname: new FormControl(structure.contactPersonLastname, Validators.required),
-      contactPersonEmail: new FormControl(structure.contactPersonEmail, [
-        Validators.pattern(CustomRegExp.EMAIL),
-        Validators.required,
-      ]),
-      website: new FormControl(structure.website, Validators.pattern(CustomRegExp.WEBSITE)),
-      facebook: new FormControl(structure.facebook, Validators.pattern(CustomRegExp.FACEBOOK)),
-      twitter: new FormControl(structure.twitter, Validators.pattern(CustomRegExp.TWITTER)),
-      instagram: new FormControl(structure.instagram, Validators.pattern(CustomRegExp.INSTAGRAM)),
-      linkedin: new FormControl(structure.linkedin, Validators.pattern(CustomRegExp.LINKEDIN)),
-      hours: new FormGroup({}),
-      pmrAccess: new FormControl(structure.pmrAccess, Validators.required),
-      placeOfReception: new FormControl(structure.placeOfReception, Validators.required),
-      choiceCompletion: new FormControl(structure.choiceCompletion, Validators.required),
-      exceptionalClosures: new FormControl(structure.exceptionalClosures),
-      labelsQualifications: this.loadArrayForCheckbox(structure.labelsQualifications, false),
-      accessModality: this.loadArrayForCheckbox(structure.accessModality, true),
-      publicsAccompaniment: this.loadArrayForCheckbox(structure.publicsAccompaniment, false),
-      proceduresAccompaniment: this.loadArrayForCheckbox(structure.proceduresAccompaniment, false),
-      //TODO: remettre ou migrer les données de accompagnements à distance
-      remoteAccompaniment: new FormControl(false),
-      otherDescription: new FormControl(structure.otherDescription),
-      equipmentsAndServices: this.loadArrayForCheckbox(structure.equipmentsAndServices, false),
-      publics: this.loadArrayForCheckbox(structure.publics, true),
-      baseSkills: new FormControl(structure.baseSkills),
-      accessRight: new FormControl(structure.accessRight),
-      parentingHelp: new FormControl(structure.parentingHelp),
-      socialAndProfessional: new FormControl(structure.socialAndProfessional),
-      digitalCultureSecurity: new FormControl(structure.digitalCultureSecurity),
-      nbComputers: new FormControl(
-        structure.equipmentsAndServices.includes('ordinateurs') ? structure.nbComputers : 0,
-        [Validators.required, Validators.pattern(CustomRegExp.NO_NEGATIVE_NUMBER), Validators.min(0)]
-      ),
-      nbPrinters: new FormControl(structure.equipmentsAndServices.includes('imprimantes') ? structure.nbPrinters : 0, [
-        Validators.required,
-        Validators.pattern(CustomRegExp.NO_NEGATIVE_NUMBER),
-        Validators.min(0),
-      ]),
-      nbTablets: new FormControl(structure.equipmentsAndServices.includes('tablettes') ? structure.nbTablets : 0, [
-        Validators.required,
-        Validators.pattern(CustomRegExp.NO_NEGATIVE_NUMBER),
-        Validators.min(0),
-      ]),
-      nbNumericTerminal: new FormControl(
-        structure.equipmentsAndServices.includes('bornesNumeriques') ? structure.nbNumericTerminal : 0,
-        [Validators.required, Validators.pattern(CustomRegExp.NO_NEGATIVE_NUMBER), Validators.min(0)]
-      ),
-      nbScanners: new FormControl(structure.equipmentsAndServices.includes('scanners') ? structure.nbScanners : 0, [
-        Validators.required,
-        Validators.pattern(CustomRegExp.NO_NEGATIVE_NUMBER),
-        Validators.min(0),
-      ]),
-      freeWorkShop: new FormControl(structure.freeWorkShop, [Validators.required]),
-      dataShareConsentDate: new FormControl(structure.dataShareConsentDate),
-      personalOffers: new FormControl(structure.personalOffers),
-    });
-  }
   public acceptReceiveNewsletter(isAccepted: boolean): void {
     this.userAcceptNewsletter = isAccepted;
   }
+
   private createPersonalOfferForm(personalOffer: PersonalOffer): void {
     this.personalOfferForm = new FormGroup({
       publicsAccompaniment: new FormControl(personalOffer.publicsAccompaniment),
@@ -332,12 +217,6 @@ export class FormViewComponent implements OnInit {
     });
   }
 
-  private loadArrayForCheckbox(array: string[], isRequired: boolean): FormArray {
-    return new FormArray(
-      array.map((str) => new FormControl(str)),
-      isRequired ? Validators.required : Validators.nullValidator
-    );
-  }
   public validatePage(value: boolean = true): void {
     this.isPageValid = value;
   }
@@ -400,6 +279,13 @@ export class FormViewComponent implements OnInit {
         if (type.formStep === structureFormStep.structureCreationFinishedInfo) {
           this.saveStructureForm();
         }
+        if (type.formStep === structureFormStep.noStructure) {
+          this.router.navigateByUrl('/profile');
+        }
+        if (type.formStep === structureFormStep.StructureInfoUnknown) {
+          //Creation de coquille vide ??
+          this.router.navigateByUrl('/profile');
+        }
         break;
       case formType.personaloffer:
         this.savePersonalOfferForm();
@@ -449,6 +335,14 @@ export class FormViewComponent implements OnInit {
     });
   }
   public setCurrentStep(step: accountFormStep | profileFormStep | structureFormStep | personalOfferFormStep): void {
+    //THIS PROBABLY CREATES CONSOLE ERRORS NG100 only in dev mode, please refer to https://angular.io/errors/NG0100 for more info
     this.currentPage = step;
   }
+  public async saveEditedStructure() {
+    let editStructure = this.editForm.value;
+    editStructure.hours = this.hoursForm.value;
+    this.structureService.editStructure(editStructure).subscribe(() => {
+      history.back();
+    });
+  }
 }

src/app/form/form-view/form-view.module.ts

-import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { SharedModule } from '../../shared/shared.module';
+import { FooterFormComponent } from '../footer-form/footer-form.component';
+import { AccountCredentialsComponent } from './account-form/account-credentials/account-credentials.component';
+import { AccountFormComponent } from './account-form/account-form.component';
+import { AccountInfoComponent } from './account-form/account-info/account-info.component';
+import { AccountNewsletterComponent } from './account-form/account-newsletter/account-newsletter.component';
+import { FormViewRoutingModule } from './form-view-routing.module';
 import { FormViewComponent } from './form-view.component';
 import { ProgressBarComponent } from './global-components/progress-bar/progress-bar.component';
-import { NavigationButtonsComponent } from './global-components/navigation-buttons/navigation-buttons.component';
-import { StructureFormComponent } from './structure-form/structure-form.component';
-import { ProfileFormComponent } from './profile-form/profile-form.component';
+import { PersonalOfferGuard } from './guards/personalOffer.guard';
+import { PersonalOfferAccompanimentComponent } from './personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component';
 import { PersonalOfferFormComponent } from './personal-offer-form/personal-offer-form.component';
-import { InformationStepComponent } from './global-components/information-step/information-step.component';
-import { AccountFormComponent } from './account-form/account-form.component';
+import { PersonalOfferOtherStructureChoiceComponent } from './personal-offer-form/personal-offer-other-structure-choice/personal-offer-other-structure-choice.component';
+import { PersonalOfferTrainingTypeComponent } from './personal-offer-form/personal-offer-training-type/personal-offer-training-type.component';
 import { ProfileEmployerSelectionComponent } from './profile-form/profile-employer-selection/profile-employer-selection.component';
+import { ProfileFormComponent } from './profile-form/profile-form.component';
 import { ProfileJobSelectionComponent } from './profile-form/profile-job-selection/profile-job-selection.component';
 import { ProfileStructureChoiceComponent } from './profile-form/profile-structure-choice/profile-structure-choice.component';
-import { PersonalOfferOtherStructureChoiceComponent } from './personal-offer-form/personal-offer-other-structure-choice/personal-offer-other-structure-choice.component';
-import { StructureNameAndAddressComponent } from './structure-form/structure-name-and-address/structure-name-and-address.component';
-import { StructureContactComponent } from './structure-form/structure-contact/structure-contact.component';
+import { StructureAccessModalityComponent } from './structure-form/structure-access-modality/structure-access-modality.component';
 import { StructureAccompanimentChoiceComponent } from './structure-form/structure-accompaniment-choice/structure-accompaniment-choice.component';
 import { StructureChoiceCompletionComponent } from './structure-form/structure-choice-completion/structure-choice-completion.component';
+import { StructureConsentComponent } from './structure-form/structure-consent/structure-consent.component';
 import { StructureContactCompletionComponent } from './structure-form/structure-contact-completion/structure-contact-completion.component';
-import { StructureAccessModalityComponent } from './structure-form/structure-access-modality/structure-access-modality.component';
-import { StructureHoursComponent } from './structure-form/structure-hours/structure-hours.component';
-import { StructurePmrComponent } from './structure-form/structure-pmr/structure-pmr.component';
-import { StructureWebAndSocialNetworkComponent } from './structure-form/structure-web-and-social-network/structure-web-and-social-network.component';
-import { StructurePublicTargetComponent } from './structure-form/structure-public-target/structure-public-target.component';
+import { StructureContactComponent } from './structure-form/structure-contact/structure-contact.component';
+import { StructureCovidInfoComponent } from './structure-form/structure-covid-info/structure-covid-info.component';
+import { StructureDescriptionComponent } from './structure-form/structure-description/structure-description.component';
 import { StructureDigitalHelpingAccompanimentComponent } from './structure-form/structure-digital-helping-accompaniment/structure-digital-helping-accompaniment.component';
-import { StructureTrainingPriceComponent } from './structure-form/structure-training-price/structure-training-price.component';
-import { StructureWifiComponent } from './structure-form/structure-wifi/structure-wifi.component';
 import { StructureEquipmentsComponent } from './structure-form/structure-equipments/structure-equipments.component';
+import { StructureFormComponent } from './structure-form/structure-form.component';
+import { StructureHoursComponent } from './structure-form/structure-hours/structure-hours.component';
 import { StructureLabelsComponent } from './structure-form/structure-labels/structure-labels.component';
+import { StructureNameAndAddressComponent } from './structure-form/structure-name-and-address/structure-name-and-address.component';
 import { StructureOtherServicesComponent } from './structure-form/structure-other-services/structure-other-services.component';
-import { StructureDescriptionComponent } from './structure-form/structure-description/structure-description.component';
-import { StructureCovidInfoComponent } from './structure-form/structure-covid-info/structure-covid-info.component';
-import { StructureConsentComponent } from './structure-form/structure-consent/structure-consent.component';
-import { AccountInfoComponent } from './account-form/account-info/account-info.component';
-import { AccountCredentialsComponent } from './account-form/account-credentials/account-credentials.component';
-import { SharedModule } from '../../shared/shared.module';
-import { FormViewRoutingModule } from './form-view-routing.module';
-import { FooterFormComponent } from '../footer-form/footer-form.component';
-import { StructureTypeComponent } from './structure-form/structure-type/structure-type.component';
-import { PersonalOfferAccompanimentComponent } from './personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component';
-import { PersonalOfferTrainingTypeComponent } from './personal-offer-form/personal-offer-training-type/personal-offer-training-type.component';
-import { AccountNewsletterComponent } from './account-form/account-newsletter/account-newsletter.component';
+import { StructurePmrComponent } from './structure-form/structure-pmr/structure-pmr.component';
+import { StructurePublicTargetComponent } from './structure-form/structure-public-target/structure-public-target.component';
+import { StructureTrainingPriceComponent } from './structure-form/structure-training-price/structure-training-price.component';
 import { StructureTrainingTypeComponent } from './structure-form/structure-training-type/structure-training-type.component';
-import { PersonalOfferGuard } from './guards/personalOffer.guard';
+import { StructureTypeComponent } from './structure-form/structure-type/structure-type.component';
+import { StructureWebAndSocialNetworkComponent } from './structure-form/structure-web-and-social-network/structure-web-and-social-network.component';
+import { StructureWifiComponent } from './structure-form/structure-wifi/structure-wifi.component';
 
 @NgModule({
   declarations: [
     FormViewComponent,
     ProgressBarComponent,
-    NavigationButtonsComponent,
     StructureFormComponent,
     ProfileFormComponent,
     PersonalOfferFormComponent,
     PersonalOfferAccompanimentComponent,
     PersonalOfferTrainingTypeComponent,
     PersonalOfferOtherStructureChoiceComponent,
-    InformationStepComponent,
     AccountFormComponent,
     ProfileEmployerSelectionComponent,
     ProfileJobSelectionComponent,

src/app/form/form-view/global-components/information-step/information-step.component.html

 <ng-container *ngIf="formType === formTypeEnum.account && step === accountFormStepEnum.confirmEmailSentInfo">
   <div class="information-step-container no-max-width">
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#emailVerification'"></use>
-    </svg>
+    <img src="../../assets/form/emailVerification.svg" alt="Image de validation de finalisation de l'inscription" />
     <p>
       Un email vous a été envoyé<br />
       afin de finaliser votre inscription
@@ -15,17 +13,16 @@
       Pour compléter votre profil,<br />
       nous aimerions vous poser quelques questions
     </p>
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#profileSkip'"></use>
-    </svg>
-    <app-navigation-buttons (goNext)="nextPage()"></app-navigation-buttons>
+    <img src="../../assets/form/profileSkip.svg" alt="Image profil" />
+    <div class="footerForm" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
+      <app-button (action)="goToHome()" [text]="'Plus tard'"></app-button>
+      <app-button (action)="goToNextPage()" [text]="'C`est parti !'" [style]="buttonTypeEnum.Primary"></app-button>
+    </div>
   </div>
 </ng-container>
 <ng-container *ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.mailSentInfo">
   <div class="information-step-container structure-display">
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#emailVerification'"></use>
-    </svg>
+    <img src="../../assets/form/emailVerification.svg" alt="Image message envoyé" />
     <p>
       Un message a été envoyé aux membres<br />
       de la structure :<br />
@@ -39,9 +36,7 @@
       Nous vous proposons de prendre 10 minutes afin de renseigner les informations de la structure et la créer sur
       Rés’in.
     </h3>
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#formTime'"></use>
-    </svg>
+    <img src="../../assets/form/formTime.svg" alt="image renseignement des informations" />
     <p>Informations dont il faut vous munir :</p>
     <ul>
       <li>les coordonnées de la structure</li>
@@ -57,24 +52,46 @@
 >
   <div class="structureCreated no-max-width">
     <h3>La structure est désormais référencée sur Rés’in.</h3>
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#structureCreated'"></use>
-    </svg>
+    <img src="../../assets/form/structureCreated.svg" alt="image structure référencée" />
     <p *ngIf="hasPersonalOffer">
       Les prochaines questions concernent les services que vous dispensez en tant qu’intervenant dans cette structure.
     </p>
   </div>
 </ng-container>
+<ng-container *ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.noStructure">
+  <div class="information-step-container profile-updated no-max-width">
+    <img src="../../assets/form/profileUpdated.svg" alt="image profil" />
+    <h3 class="centered">
+      Votre structure ne disposant ni d’accompagnement, ni de formation, elle n’apparaitra pas sur Rés’in.
+    </h3>
+    <p>Votre profil a bien été mis à jour.</p>
+    <div class="btn">
+      <app-button
+        [style]="buttonTypeEnum.Primary"
+        [text]="'Voir mon compte'"
+        [iconType]="'form'"
+        (action)="goBackProfile()"
+      >
+      </app-button>
+    </div>
+  </div>
+</ng-container>
 <ng-container
-  *ngIf="formType === formTypeEnum.personaloffer && step === personalOfferFormStep.personalOfferFinishedInfo"
+  *ngIf="
+    (formType === formTypeEnum.personaloffer && step === personalOfferFormStep.personalOfferFinishedInfo) ||
+    (formType === formTypeEnum.structure && step === structureFormStepEnum.StructureInfoUnknown)
+  "
 >
   <div class="information-step-container profile-updated no-max-width">
     <h3>Merci, les informations de votre profil ont été mises à jour</h3>
-    <svg aria-hidden="true">
-      <use [attr.xlink:href]="'assets/form/sprite.svg#profileUpdated'"></use>
-    </svg>
+    <img src="../../assets/form/profileUpdated.svg" alt="image profil" />
     <div class="btn">
-      <app-button [style]="buttonTypeEnum.Primary" [text]="'Voir mon compte'" [iconType]="'form'" (action)="nextPage()">
+      <app-button
+        [style]="buttonTypeEnum.Primary"
+        [text]="'Voir mon compte'"
+        [iconType]="'form'"
+        (action)="goBackProfile()"
+      >
       </app-button>
     </div>
   </div>

src/app/form/form-view/global-components/information-step/information-step.component.scss

@@ -84,6 +84,9 @@
     }
   }
   &.profile-updated {
+    .centered {
+      text-align: center;
+    }
     .btn {
       margin-top: 17px;
     }

src/app/form/form-view/global-components/information-step/information-step.component.ts

 import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Router } from '@angular/router';
 import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
 import { accountFormStep } from '../../account-form/accountFormStep.enum';
 import { formType } from '../../formType.enum';
@@ -24,8 +25,17 @@ export class InformationStepComponent {
   public structureFormStepEnum = structureFormStep;
   public personalOfferFormStep = personalOfferFormStep;
   public buttonTypeEnum = ButtonType;
+  constructor(private router: Router) {}
 
-  public nextPage(): void {
+  public goBackProfile(): void {
+    this.router.navigateByUrl('/profile');
+  }
+
+  public goToHome(): void {
+    this.router.navigateByUrl('news');
+  }
+
+  public goToNextPage(): void {
     this.goNext.emit();
   }
 }

src/app/form/form-view/global-components/navigation-buttons/navigation-buttons.component.html

-<div class="footerForm" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
-  <ng-container *ngIf="buttonStyle === 0">
-    <app-button (action)="goToHome()" [text]="'Plus tard'"></app-button>
-    <app-button (action)="goToNextPage()" [text]="'C`est parti !'" [style]="buttonTypeEnum.Primary"></app-button>
-  </ng-container>
-</div>