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

 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { AbstractControl, UntypedFormGroup } from '@angular/forms';
-import { Module } from '../../../../structure-list/models/module.model';
+import { CategoriesToggle } from 'src/app/models/categoriesToggle.model';
 
 @Component({
   selector: 'app-structure-equipments',
@@ -10,7 +10,7 @@ import { Module } from '../../../../structure-list/models/module.model';
 export class StructureEquipmentsComponent implements OnInit {
   @Input() structureForm: UntypedFormGroup;
   @Input() isEditMode: boolean;
-  @Input() equipmentsAndServices: { module: Module; openned: boolean }[];
+  @Input() equipmentsAndServices: CategoriesToggle[];
   @Output() validateForm = new EventEmitter<any>();
 
   private vowels = ['a', 'e', 'i', 'o', 'u', 'y'];
@@ -25,11 +25,9 @@ export class StructureEquipmentsComponent implements OnInit {
 
   public changeValueHandler(equipment: string, value = 0): void {
     let field = '';
-    if (equipment === 'ordinateurs') field = 'nbComputers';
-    if (equipment === 'tablettes') field = 'nbTablets';
-    if (equipment === 'scanners') field = 'nbScanners';
-    if (equipment === 'bornesNumeriques') field = 'nbNumericTerminal';
-    if (equipment === 'imprimantes') field = 'nbPrinters';
+    if (equipment === 'scanner') field = 'nbScanners';
+    if (equipment === 'computer') field = 'nbComputers';
+    if (equipment === 'printer') field = 'nbPrinters';
 
     if (value === -1 && this.structureForm.value[field] === 0) return;
     if (this.structureForm.value[field] + value < 0) return;

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

@@ -112,16 +112,29 @@
     <app-structure-public-target
       [isEditMode]="isEditMode"
       [structureForm]="structureForm"
-      [publics]="publics"
+      [age]="age"
+      [handicaps]="handicaps"
+      [publicOthers]="publicOthers"
+      [languageAndIlliteracy]="languageAndIlliteracy"
       (validateForm)="setValidationsForm()"
       (updateChoice)="updateChoice($event)"
     >
     </app-structure-public-target>
   </div>
+  <div *ngIf="currentStep == structureFormStep.structureDigitalHelpingAccompanimentOther">
+    <app-structure-public-target-other
+      [isEditMode]="isEditMode"
+      [structureForm]="structureForm"
+      (validateForm)="setValidationsForm()"
+      (updateChoice)="updateChoice($event)"
+    >
+    </app-structure-public-target-other>
+  </div>
   <div *ngIf="currentStep == structureFormStep.structureTrainingType">
     <app-structure-training-type
       [isEditMode]="isEditMode"
       [structureForm]="structureForm"
+      [trainingCategories]="trainingCategories"
       (validateForm)="setValidationsForm()"
     ></app-structure-training-type>
   </div>
@@ -144,7 +157,7 @@
   <div *ngIf="currentStep == structureFormStep.structureEquipments">
     <app-structure-equipments
       [structureForm]="structureForm"
-      [equipmentsAndServices]="equipmentsAndServices"
+      [equipmentsAndServices]="equipments"
       (validateForm)="setValidationsForm($event)"
       [isEditMode]="isEditMode"
       (inArray)="isInArray($event)"
@@ -162,7 +175,7 @@
   <div *ngIf="currentStep == structureFormStep.structureOtherServices">
     <app-structure-other-services
       [structureForm]="structureForm"
-      [equipmentsAndServices]="equipmentsAndServices"
+      [equipmentsAndServices]="equipmentsServices"
       [isEditMode]="isEditMode"
       (validateForm)="setValidationsForm($event)"
       (checkChange)="onCheckChange($event)"
@@ -172,7 +185,7 @@
     <app-structure-digital-helping-accompaniment
       [isEditMode]="isEditMode"
       [structureForm]="structureForm"
-      [proceduresAccompaniment]="proceduresAccompaniment"
+      [onlineProcedures]="onlineProcedures"
       (validateForm)="setValidationsForm($event)"
       (updateChoice)="updateChoice($event)"
     ></app-structure-digital-helping-accompaniment>

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

 import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
 import { AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
+import { CategoriesToggle } from 'src/app/models/categoriesToggle.model';
 import { Address } from '../../../models/address.model';
 import { Structure } from '../../../models/structure.model';
 import { User } from '../../../models/user.model';
@@ -14,7 +15,7 @@ import { structureFormStep } from './structureFormStep.enum';
 
 @Component({
   selector: 'app-structure-form',
-  templateUrl: './structure-form.component.html'
+  templateUrl: './structure-form.component.html',
 })
 export class StructureFormComponent implements OnChanges, OnInit {
   @Input() nbSteps: number;
@@ -36,8 +37,6 @@ export class StructureFormComponent implements OnChanges, OnInit {
   // Collapse var
   public showWebsite: boolean = false;
   public showSocialNetwork: boolean = false;
-  public showPublicsAccompaniment: boolean;
-  public showProceduresAccompaniment: boolean;
 
   // Condition form
   public isClaimMode = false;
@@ -45,15 +44,22 @@ export class StructureFormComponent implements OnChanges, OnInit {
   public userAcceptSavedDate = false;
 
   // Form var
-  public equipmentsAndServices: { module: Module; openned: boolean }[] = [];
-  public trainingCategories: { category: Category; openned: boolean }[] = [];
+  public equipmentsServices: { module: Module; openned: boolean }[] = [];
+  public equipments: { module: Module; openned: boolean }[] = [];
+  public trainingCategories: CategoriesToggle[] = [];
   public accessModality: Category;
   public labelsQualifications: Category;
-  public proceduresAccompaniment: Category;
-  public publicsAccompaniment: Category;
-  public publics: Category;
+  public onlineProcedures: Category;
+  public age: Category;
+  public publicOthers: Category;
+  public handicaps: Category;
+  public languageAndIlliteracy: Category;
 
-  constructor(private searchService: SearchService, private profileService: ProfileService, private route: ActivatedRoute) {}
+  constructor(
+    private searchService: SearchService,
+    private profileService: ProfileService,
+    private route: ActivatedRoute
+  ) {}
 
   ngOnChanges(changes: SimpleChanges): void {
     if (changes.currentStep) {
@@ -144,38 +150,38 @@ export class StructureFormComponent implements OnChanges, OnInit {
       //   this.updatePageValid();
     } else {
       this.pagesValidation[structureFormStep.structureChoice] = {
-        valid: this.structureForm.get('_id').valid
+        valid: this.structureForm.get('_id').valid,
       };
       this.pagesValidation[structureFormStep.structureNameAndAddress] = {
-        valid: this.structureForm.get('structureName').valid && this.structureForm.get('address').valid
+        valid: this.structureForm.get('structureName').valid && this.structureForm.get('address').valid,
       };
       this.pagesValidation[structureFormStep.structureContact] = {
-        valid: this.structureForm.get('contactMail').valid && this.structureForm.get('contactPhone').valid
+        valid: this.structureForm.get('contactMail').valid && this.structureForm.get('contactPhone').valid,
       };
       this.pagesValidation[structureFormStep.structureAccompanimentChoice] = {
-        valid: this.structureForm.get('placeOfReception').valid
+        valid: this.structureForm.get('placeOfReception').valid,
       };
       this.pagesValidation[structureFormStep.structureChoiceCompletion] = {
-        valid: this.isEditMode ? true : this.structureForm.get('choiceCompletion').valid
+        valid: this.isEditMode ? true : this.structureForm.get('choiceCompletion').valid,
       };
       this.pagesValidation[structureFormStep.structureContactCompletion] = {
         valid: this.isEditMode
           ? true
           : this.structureForm.get('contactPersonFirstname').valid &&
             this.structureForm.get('contactPersonLastname').valid &&
-            this.structureForm.get('contactPersonEmail').valid
+            this.structureForm.get('contactPersonEmail').valid,
       };
       this.pagesValidation[structureFormStep.structureType] = {
-        valid: this.structureForm.get('structureType').valid
+        valid: this.structureForm.get('structureType').valid,
       };
       this.pagesValidation[structureFormStep.structureAccessModality] = {
-        valid: this.structureForm.get('accessModality').valid
+        valid: this.structureForm.get('categories').get('accessModality').valid,
       };
       this.pagesValidation[structureFormStep.structureHours] = {
-        valid: this.hoursForm.valid && this.structureForm.get('exceptionalClosures').valid
+        valid: this.hoursForm.valid && this.structureForm.get('exceptionalClosures').valid,
       };
       this.pagesValidation[structureFormStep.structurePmr] = {
-        valid: this.structureForm.get('pmrAccess').valid
+        valid: this.structureForm.get('pmrAccess').valid,
       };
       this.pagesValidation[structureFormStep.structureWebAndSocialNetwork] = {
         valid:
@@ -183,67 +189,80 @@ export class StructureFormComponent implements OnChanges, OnInit {
           ((this.structureForm.get('facebook').valid &&
             this.structureForm.get('twitter').valid &&
             this.structureForm.get('instagram').valid) ||
-            !this.showSocialNetwork)
+            !this.showSocialNetwork),
       };
       this.pagesValidation[structureFormStep.structurePublicTarget] = {
-        valid: this.structureForm.get('publics').valid
+        valid: this.structureForm.get('categories').get('age').valid,
+      };
+      this.pagesValidation[structureFormStep.structureDigitalHelpingAccompanimentOther] = {
+        valid: this.structureForm.get('otherDescription').valid,
       };
       this.pagesValidation[structureFormStep.structureDigitalHelpingAccompaniment] = {
-        valid: this.structureForm.get('proceduresAccompaniment').valid
+        valid: this.structureForm.get('categories').get('onlineProcedures').valid,
       };
 
       this.pagesValidation[structureFormStep.structureTrainingType] = {
-        valid: true
+        valid: true,
       };
       this.pagesValidation[structureFormStep.structureTrainingPrice] = {
-        valid: this.structureForm.get('freeWorkShop').valid
+        valid: this.structureForm.get('freeWorkShop').valid,
       };
       this.pagesValidation[structureFormStep.structureWifi] = {
-        valid: this.structureForm.get('equipmentsAndServices').valid
+        valid: this.structureForm.get('categories').get('selfServiceMaterial').valid,
       };
       this.pagesValidation[structureFormStep.structureEquipments] = {
         valid:
           this.structureForm.get('nbComputers').valid &&
           this.structureForm.get('nbPrinters').valid &&
-          this.structureForm.get('nbTablets').valid &&
-          this.structureForm.get('nbNumericTerminal').valid &&
           this.structureForm.get('nbScanners').valid,
-        name: 'Equipements mis à disposition'
+        name: 'Equipements mis à disposition',
       };
       this.pagesValidation[structureFormStep.structureLabels] = {
-        valid: true
+        valid: true,
       };
       this.pagesValidation[structureFormStep.structureOtherServices] = {
-        valid: this.structureForm.get('equipmentsAndServices').valid
+        valid: this.structureForm.get('categories').get('equipmentsAndServices').valid,
       };
       this.pagesValidation[structureFormStep.structureDescription] = {
-        valid: true
+        valid: true,
       };
       this.pagesValidation[structureFormStep.structureCovidInfo] = {
-        valid: true
+        valid: true,
       };
 
       this.pagesValidation[structureFormStep.structureConsent] = {
-        valid: !this.isEditMode ? this.userAcceptSavedDate : true
+        valid: !this.isEditMode ? this.userAcceptSavedDate : true,
       };
       this.updatePageValid();
     }
   }
 
   async setCategories(): Promise<void> {
-    this.searchService.getCategoriesAccompaniment().subscribe((categories: Category[]) => {
-      this.proceduresAccompaniment = categories[0];
-    });
-    const equipmentsCategs = await this.searchService.getCategoriesOthers().toPromise();
-    equipmentsCategs.forEach((categ) => {
+    const categories = await this.searchService.getCategories().toPromise();
+    categories.forEach((categ) => {
       switch (categ.id) {
+        case CategoryEnum.onlineProcedures: {
+          this.onlineProcedures = categ;
+          break;
+        }
+        case CategoryEnum.baseSkills:
+        case CategoryEnum.advancedSkills: {
+          this.trainingCategories.push({ category: categ, openned: false });
+          break;
+        }
         case CategoryEnum.accessModality: {
           this.accessModality = categ;
           break;
         }
-        case CategoryEnum.equipmentsAndServices: {
+        case CategoryEnum.selfServiceMaterial: {
           categ.modules.forEach((c) => {
-            this.equipmentsAndServices.push({ module: c, openned: false });
+            this.equipments.push({ module: c, openned: false });
+          });
+          break;
+        }
+        case CategoryEnum.equipmentsServices: {
+          categ.modules.forEach((c) => {
+            this.equipmentsServices.push({ module: c, openned: false });
           });
           break;
         }
@@ -251,23 +270,35 @@ export class StructureFormComponent implements OnChanges, OnInit {
           this.labelsQualifications = categ;
           break;
         }
-        case CategoryEnum.publics: {
-          this.publics = categ;
+        case CategoryEnum.age: {
+          this.age = categ;
+          break;
+        }
+        case CategoryEnum.languageAndIlliteracy: {
+          this.languageAndIlliteracy = categ;
           break;
         }
-        case CategoryEnum.publicsAccompaniment: {
-          this.publicsAccompaniment = categ;
+        case CategoryEnum.publicOthers: {
+          this.publicOthers = categ;
+          break;
+        }
+        case CategoryEnum.handicaps: {
+          this.handicaps = categ;
           break;
         }
       }
     });
-    const categs = await this.searchService.getCategoriesTraining().toPromise();
-    categs.forEach((categ) => {
-      this.trainingCategories.push({ category: categ, openned: false });
-    });
   }
 
-  public onCheckChange({ event, formControlName, value }: { event: boolean; formControlName: string; value: string }): void {
+  public onCheckChange({
+    event,
+    formControlName,
+    value,
+  }: {
+    event: boolean;
+    formControlName: string;
+    value: string;
+  }): void {
     const formArray: UntypedFormArray = this.structureForm.get(formControlName) as UntypedFormArray;
     if (event) {
       // Add a new control in the arrayForm
@@ -287,8 +318,8 @@ export class StructureFormComponent implements OnChanges, OnInit {
 
   // Check if a FormControl value is in FormArray
   public isInArray({ formControlName, term }: { formControlName: string; term: string }): boolean {
-    if (this.structureForm.controls[formControlName] && this.structureForm.controls[formControlName].value) {
-      return this.structureForm.controls[formControlName].value.includes(term);
+    if (this.structureForm.get(formControlName) && this.structureForm.get(formControlName).value) {
+      return this.structureForm.get(formControlName).value.includes(term);
     }
     return false;
   }

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

@@ -15,11 +15,11 @@
   <div class="labelsQualifications" *ngIf="labelsQualifications" fxLayout="row wrap" fxLayoutAlign="flex-start">
     <app-checkbox-form
       *ngFor="let module of labelsQualifications.modules"
-      [isChecked]="isInArray(module.id, labelsQualifications.id)"
-      [text]="module.text"
+      [isChecked]="isInArray(module.id, 'labelsQualifications')"
+      [text]="module.name"
       [iconSvg]="module.id"
       [iconType]="'labels'"
-      (checkEvent)="onCheckChange($event, labelsQualifications.id, module.id)"
+      (checkEvent)="onCheckChange($event, 'categories.labelsQualifications', module.id)"
     >
     </app-checkbox-form>
   </div>

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

 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
+import { formUtils } from 'src/app/utils/formUtils';
 import { Category } from '../../../../structure-list/models/category.model';
 
 @Component({
@@ -14,17 +15,14 @@ export class StructureLabelsComponent implements OnInit {
   @Output() validateForm = new EventEmitter<any>();
   @Output() checkChange = new EventEmitter<any>();
 
+  public formUtils = new formUtils();
   async ngOnInit(): Promise<void> {
     this.validateForm.emit();
   }
   // Check if a FormControl value is in FormArray
   public isInArray(term: string, formControlName: string): boolean {
-    if (this.structureForm.controls[formControlName].value) {
-      return this.structureForm.controls[formControlName].value.includes(term);
-    }
-    return false;
+    return this.formUtils.isInCategoryArray(term, formControlName, this.structureForm);
   }
-
   public onCheckChange(event: boolean, formControlName: string, modality: string) {
     this.checkChange.emit({
       event,

src/app/form/form-view/structure-form/structure-other-services/structure-other-services.component.html

@@ -8,11 +8,20 @@
       [icon]="'arrowBack'"
     ></app-svg-icon>
     <div class="titleContent">
-      <h3>Quels autres services sont proposés par la structure&nbsp;?</h3>
+      <h3>Quels sont les autres services proposés par la structure&nbsp;?</h3>
       <p>Facultatif</p>
     </div>
   </div>
   <div *ngIf="equipmentsAndServices" fxLayout="column wrap" fxLayoutAlign="flex-start" class="otherServices">
+    <!-- Display checkbox conditionning next screen -->
+    <!-- TODO: Us for display this screen -->
+    <app-checkbox-form
+      [isChecked]="isInArray('equipmentsAndServices', 'solidarityMaterial')"
+      [text]="'Vente de matériel numérique à tarif solidaire'"
+      [iconSvg]="'venteMaterielPrixSolidaire'"
+    >
+    </app-checkbox-form>
+    <!-- Regular database info -->
     <ng-container *ngFor="let service of equipmentsAndServices">
       <app-checkbox-form
         *ngIf="
@@ -20,13 +29,12 @@
             'donDeMateriels',
             'reconditionnementsDeMateriel',
             'accesLivresInformatiques',
-            'venteMaterielPrixSolidaire'
           ].includes(service.module.id)
         "
         [isChecked]="isInArray('equipmentsAndServices', service.module.id)"
-        [text]="service.module.text"
+        [text]="service.module.name"
         [iconSvg]="service.module.id"
-        (checkEvent)="onCheckChange($event, 'equipmentsAndServices', service.module.id)"
+        (checkEvent)="onCheckChange($event, 'categories.equipmentsAndServices', service.module.id)"
       >
       </app-checkbox-form>
     </ng-container>

src/app/form/form-view/structure-form/structure-other-services/structure-other-services.component.ts

 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
+import { formUtils } from 'src/app/utils/formUtils';
 import { Category } from '../../../../structure-list/models/category.model';
 
 @Component({
@@ -12,18 +13,15 @@ export class StructureOtherServicesComponent implements OnInit {
   @Input() equipmentsAndServices: Category;
   @Output() validateForm = new EventEmitter<any>();
   @Output() checkChange = new EventEmitter<any>();
+  public formUtils = new formUtils();
 
   async ngOnInit(): Promise<void> {
     this.validateForm.emit();
   }
 
-  public isInArray(formControlName: string, term: string) {
-    if (this.structureForm.controls[formControlName].value) {
-      return this.structureForm.controls[formControlName].value.includes(term);
-    }
-    return false;
+  public isInArray(formControlName: string, term: string): boolean {
+    return this.formUtils.isInCategoryArray(term, formControlName, this.structureForm);
   }
-
   public onCheckChange(event: boolean, formControlName: string, modality: string) {
     this.checkChange.emit({
       event,

src/app/form/form-view/structure-form/structure-public-target-other/structure-public-target-other.component.html

+<form [formGroup]="structureForm" *ngIf="structureForm" (keyup.enter)="isPageValid && !isEditMode ? nextPage() : null">
+  <div class="title" [ngClass]="{ editTitle: isEditMode }">
+    <app-svg-icon
+      (click)="goBack()"
+      *ngIf="isEditMode"
+      [iconClass]="'backArrow'"
+      [type]="'ico'"
+      [icon]="'arrowBack'"
+    ></app-svg-icon>
+    <div class="titleContent">
+      <h3>Quelles sont les autres démarches&nbsp;?</h3>
+    </div>
+  </div>
+  <div class="textareaBlock" fxLayout="column">
+    <textarea
+      rows="8"
+      placeholder="Exemple : tout ce qui est en lien avec la création d'entreprise..."
+      maxlength="500"
+      formControlName="otherDescription"
+    ></textarea>
+    <p>
+      {{
+        getStructureControl('otherDescription').value ? getStructureControl('otherDescription').value.length : 0
+      }}&nbsp;/&nbsp;500
+    </p>
+  </div>
+</form>

src/app/form/form-view/structure-form/structure-public-target-other/structure-public-target-other.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { structureDigitalHelpingAccompanimentOtherComponent } from './structure-public-target-other.component';
+
+describe('StructurePublicTargetComponent', () => {
+  let component: structureDigitalHelpingAccompanimentOtherComponent;
+  let fixture: ComponentFixture<structureDigitalHelpingAccompanimentOtherComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [structureDigitalHelpingAccompanimentOtherComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(structureDigitalHelpingAccompanimentOtherComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/form/form-view/structure-form/structure-public-target-other/structure-public-target-other.component.ts

+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { AbstractControl, UntypedFormGroup } from '@angular/forms';
+import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
+
+@Component({
+  selector: 'app-structure-public-target-other',
+  templateUrl: './structure-public-target-other.component.html',
+})
+export class structureDigitalHelpingAccompanimentOtherComponent implements OnInit {
+  @Input() structureForm: UntypedFormGroup;
+  @Input() isEditMode: boolean;
+  @Output() updateChoice = new EventEmitter<any>();
+  @Output() validateForm = new EventEmitter<any>();
+
+  public buttonTypeEnum = ButtonType;
+
+  ngOnInit(): void {
+    this.validateForm.emit();
+  }
+
+  public getStructureControl(nameControl: string): AbstractControl {
+    return this.structureForm.get(nameControl);
+  }
+  public goBack(): void {
+    history.back();
+  }
+}

src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.html

@@ -12,19 +12,70 @@
       <p>Plusieurs choix possibles</p>
     </div>
   </div>
-  <p class="missing-information" *ngIf="isEditMode && !structureForm.get('publics').valid">
+  <p class="missing-information" *ngIf="isEditMode && !structureForm.get('categories').get('age').valid">
     <app-svg-icon [iconClass]="'icon-26'" [type]="'form'" [icon]="'notValidate'" class="validationIcon"></app-svg-icon>
     <span>Il faut renseigner au moins un champ</span>
   </p>
-  <div *ngIf="publics" class="btn-grid">
-    <span *ngFor="let choice of publics.modules">
+  <div *ngIf="publicOthers">
+    <div class="btn-grid">
       <app-button
+        *ngFor="let choice of publicOthers.modules"
         [ngClass]="{ selectedChoice: true }"
-        [extraClass]="isInArray(choice.id) ? 'selected' : ''"
+        [extraClass]="isInArray(choice.id, 'publicOthers') ? 'selected' : ''"
         [style]="buttonTypeEnum.CheckButton"
-        [text]="choice.text"
-        (action)="updateChoicePublic(choice.id)"
+        [text]="choice.name"
+        (action)="updateChoicePublic(choice.id, 'publicOthers')"
       ></app-button>
-    </span>
+    </div>
+  </div>
+  <div *ngIf="age">
+    <div class="title">
+      <h4>Âge</h4>
+    </div>
+    <div class="btn-grid">
+      <app-button
+        *ngFor="let choice of age.modules"
+        [ngClass]="{ selectedChoice: true }"
+        [extraClass]="isInArray(choice.id, 'age') ? 'selected' : ''"
+        [style]="buttonTypeEnum.CheckButton"
+        [text]="choice.name"
+        (action)="updateChoicePublic(choice.id, 'age')"
+      ></app-button>
+    </div>
+  </div>
+
+  <div *ngIf="languageAndIlliteracy">
+    <div class="title">
+      <h4>Langue et illettrisme</h4>
+      <p>Facultatif</p>
+    </div>
+    <div class="btn-grid">
+      <app-button
+        *ngFor="let choice of languageAndIlliteracy.modules"
+        [ngClass]="{ selectedChoice: true }"
+        [extraClass]="isInArray(choice.id, 'languageAndIlliteracy') ? 'selected' : ''"
+        [style]="buttonTypeEnum.CheckButton"
+        [text]="choice.name"
+        (action)="updateChoicePublic(choice.id, 'languageAndIlliteracy')"
+      ></app-button>
+    </div>
+  </div>
+
+  <div *ngIf="handicaps">
+    <div class="title">
+      <h4>Handicaps</h4>
+      <p>Facultatif</p>
+    </div>
+
+    <div class="btn-grid">
+      <app-button
+        *ngFor="let choice of handicaps.modules"
+        [ngClass]="{ selectedChoice: true }"
+        [extraClass]="isInArray(choice.id, 'handicaps') ? 'selected' : ''"
+        [style]="buttonTypeEnum.CheckButton"
+        [text]="choice.name"
+        (action)="updateChoicePublic(choice.id, 'handicaps')"
+      ></app-button>
+    </div>
   </div>
 </form>

src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.ts

@@ -9,7 +9,10 @@ import { Category } from '../../../../structure-list/models/category.model';
 })
 export class StructurePublicTargetComponent implements OnInit {
   @Input() structureForm: UntypedFormGroup;
-  @Input() publics: Category;
+  @Input() age: Category;
+  @Input() languageAndIlliteracy: Category;
+  @Input() handicaps: Category;
+  @Input() publicOthers: Category;
   @Input() isEditMode: boolean;
   @Output() updateChoice = new EventEmitter<any>();
   @Output() validateForm = new EventEmitter<any>();
@@ -20,12 +23,12 @@ export class StructurePublicTargetComponent implements OnInit {
     this.validateForm.emit();
   }
 
-  public updateChoicePublic(choice: string) {
-    this.updateChoice.emit({ formControlName: 'publics', choice });
+  public updateChoicePublic(choice: string, formControlName: string) {
+    this.updateChoice.emit({ formControlName: `categories.${formControlName}`, choice });
   }
 
-  public isInArray(choice: string) {
-    if (this.structureForm.get('publics') && this.structureForm.get('publics').value.includes(choice)) return true;
+  public isInArray(choice: string, formControlName: string): boolean {
+    if (this.structureForm.get('categories').get(formControlName)?.value.includes(choice)) return true;
     return false;
   }
   public goBack(): void {

src/app/form/form-view/structure-form/structure-training-type/structure-training-type.component.html

-<form [formGroup]="structureForm" *ngIf="structureForm">
+<form [formGroup]="structureForm" *ngIf="structureForm && trainingCategories.length > 0">
   <div class="title" [ngClass]="{ editTitle: isEditMode }">
     <app-svg-icon
       (click)="goBack()"
@@ -13,11 +13,9 @@
     </div>
   </div>
   <app-training-type-picker
-    [baseSkills]="structureForm.get('baseSkills').value"
-    [accessRight]="structureForm.get('accessRight').value"
-    [digitalCultureSecurity]="structureForm.get('digitalCultureSecurity').value"
-    [socialAndProfessional]="structureForm.get('socialAndProfessional').value"
-    [parentingHelp]="structureForm.get('parentingHelp').value"
+    [baseSkills]="structureForm.get('categories').get('baseSkills').value"
+    [advancedSkills]="structureForm.get('categories').get('advancedSkills').value"
+    [trainingCategories]="trainingCategories"
     (selectedType)="setTrainingsFromCategories($event)"
   ></app-training-type-picker>
 </form>

src/app/form/form-view/structure-form/structure-training-type/structure-training-type.component.ts

 import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
+import { CategoriesToggle } from 'src/app/models/categoriesToggle.model';
 import { Category } from '../../../../structure-list/models/category.model';
 
 @Component({
@@ -8,6 +9,7 @@ import { Category } from '../../../../structure-list/models/category.model';
 })
 export class StructureTrainingTypeComponent {
   @Input() structureForm: UntypedFormGroup;
+  @Input() trainingCategories: CategoriesToggle[];
   @Input() isEditMode: boolean;
   @Output() validateForm = new EventEmitter<any>();
 
@@ -18,8 +20,8 @@ export class StructureTrainingTypeComponent {
   public setTrainingsFromCategories(categories: Category[]) {
     for (const categorie of categories) {
       const moduleIds: string[] = categorie.modules.map((module) => module.id);
-      if (this.structureForm.get(categorie.id)) {
-        this.structureForm.get(categorie.id).patchValue(moduleIds);
+      if (this.structureForm.get('categories').get(categorie.id)) {
+        this.structureForm.get('categories').get(categorie.id).patchValue(moduleIds);
       }
     }
   }

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

@@ -12,8 +12,8 @@
     </div>
   </div>
   <app-radio-form
-    [selectedOption]="isEditMode ? isInArray('equipmentsAndServices', 'wifiEnAccesLibre') : null"
-    (selectedEvent)="onCheckChange($event, 'equipmentsAndServices', 'wifiEnAccesLibre')"
+    [selectedOption]="isEditMode ? isInArray('selfServiceMaterial', 'wifiEnAccesLibre') : null"
+    (selectedEvent)="onCheckChange($event, 'categories.selfServiceMaterial', 'wifiEnAccesLibre')"
   >
   </app-radio-form>
 </form>

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

 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
+import { formUtils } from 'src/app/utils/formUtils';
 
 @Component({
   selector: 'app-structure-wifi',
@@ -11,14 +12,12 @@ export class StructureWifiComponent implements OnInit {
   @Output() validateForm = new EventEmitter<any>();
   @Output() checkChange = new EventEmitter<any>();
 
+  public formUtils = new formUtils();
   ngOnInit(): void {
     if (this.isEditMode) this.validateForm.emit();
   }
   public isInArray(formControlName: string, term: string): boolean {
-    if (this.structureForm.controls[formControlName].value) {
-      return this.structureForm.controls[formControlName].value.includes(term);
-    }
-    return false;
+    return this.formUtils.isInCategoryArray(term, formControlName, this.structureForm);
   }
   public onCheckChange(event, catId: string, modId: string): void {
     this.checkChange.emit({ event, formControlName: catId, value: modId });

src/app/form/form-view/structure-form/structureFormStep.enum.ts

@@ -13,6 +13,7 @@ export enum structureFormStep {
   structureWebAndSocialNetwork,
   structurePublicTarget,
   structureDigitalHelpingAccompaniment,
+  structureDigitalHelpingAccompanimentOther,
   structureTrainingType,
   structureTrainingPrice,
   structureWifi,

src/app/form/orientation-form-view/online-demarch/online-demarch/online-demarch.component.html

@@ -6,7 +6,7 @@
         [ngClass]="{ selectedChoice: true }"
         [extraClass]="isSelectedModule(module.id) ? 'selected' : ''"
         [style]="buttonTypeEnum.CheckButton"
-        [text]="module.text"
+        [text]="module.name"
         (action)="handleClick(module)"
       ></app-button>
     </span>

src/app/form/orientation-form-view/online-demarch/online-demarch/online-demarch.component.ts

-import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
+import { CategoryEnum } from 'src/app/shared/enum/category.enum';
 import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
 import { Category } from '../../../../structure-list/models/category.model';
 import { Module } from '../../../../structure-list/models/module.model';
@@ -20,8 +21,8 @@ export class OnlineDemarchComponent implements OnInit {
 
   ngOnInit(): void {
     this.selectedModules = this.form.get('onlineDemarchType').value;
-    this.searchService.getCategoriesAccompaniment().subscribe((categories: Category[]) => {
-      this.accompanimentType = categories[0].modules;
+    this.searchService.getCategories().subscribe((categories: Category[]) => {
+      this.accompanimentType = categories.find((el) => el.id === CategoryEnum.onlineProcedures).modules;
     });
     this.checkValidation.emit();
   }

src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts

 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { Structure } from '../../../../models/structure.model';
-import { TclService } from '../../../../services/tcl.service';
 import { TclStopPoint } from '../../../../models/tclStopPoint.model';
 import { AuthService } from '../../../../services/auth.service';
+import { TclService } from '../../../../services/tcl.service';
 import { AccessModality } from '../../../../structure-list/enum/access-modality.enum';
 @Component({
   selector: 'app-structure-detail-print',
@@ -21,10 +21,6 @@ export class StructureDetailPrintComponent implements OnInit {
   async ngOnInit(): Promise<void> {
     // GetTclStopPoints
     this.getTclStopPoints();
-    const index = this.structure.proceduresAccompaniment.indexOf('autres');
-    if (index > -1) {
-      this.structure.proceduresAccompaniment.splice(index, 1);
-    }
   }
 
   public keepOriginalOrder = (a, _b) => a.key;