From 7d84a1dbab2c8f64d071a4dd1668323c68435f99 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Mon, 5 Sep 2022 17:50:39 +0200
Subject: [PATCH 01/23] feat(profile): structure scaffolding

---
 .../profile-structure.component.html          | 61 +++++++++++++++++++
 .../profile-structure.component.scss          | 30 +++++++++
 .../profile-structure.component.ts            | 44 +++++++++++++
 src/app/profile/profile.component.html        | 28 ++-------
 src/app/profile/profile.module.ts             |  9 +--
 src/assets/ico/fold.svg                       |  3 +
 src/assets/ico/sprite.svg                     |  7 +++
 src/assets/ico/unfold.svg                     |  3 +
 src/styles.scss                               | 27 --------
 9 files changed, 159 insertions(+), 53 deletions(-)
 create mode 100644 src/app/profile/profile-structure/profile-structure.component.html
 create mode 100644 src/app/profile/profile-structure/profile-structure.component.scss
 create mode 100644 src/app/profile/profile-structure/profile-structure.component.ts
 create mode 100644 src/assets/ico/fold.svg
 create mode 100644 src/assets/ico/unfold.svg

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
new file mode 100644
index 000000000..6779d2feb
--- /dev/null
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -0,0 +1,61 @@
+<div class="structureCard">
+  <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
+      <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
+      <div fxLayout="column" fxLayoutAlign="space-between start">
+        <p class="structureName">{{ structure.structure.structureName }}</p>
+        <p class="structureType">{{ getStructureTypeLabel() }}</p>
+      </div>
+    </div>
+    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
+      <div *ngIf="!isValid()" fxLayout="row" fxLayoutAlign="space-between center">
+        <app-svg-icon [iconClass]="'validation'" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
+        <p class="invalidText">
+          Informations <br />
+          manquantes
+        </p>
+      </div>
+      <app-svg-icon [type]="'ico'" [icon]="'fold'" [iconClass]="'icon-26'"></app-svg-icon>
+    </div>
+  </div>
+  <div fxLayout="column">
+    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+      <p class="section-title">INFORMATIONS</p>
+      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
+        <app-button
+          [type]="'button'"
+          [iconBtn]="'eyePassword'"
+          [iconType]="'form'"
+          [text]="'Voir la structure'"
+          [style]="buttonTypeEnum.SecondaryWide"
+          routerLink="./"
+          [routerLinkActive]="'active'"
+        ></app-button>
+        <app-button
+          [type]="'button'"
+          [iconBtn]="'edit'"
+          [text]="'Modifier la structure'"
+          [style]="buttonTypeEnum.SecondaryWide"
+          routerLink="./"
+          [routerLinkActive]="'active'"
+        ></app-button>
+      </div>
+    </div>
+    <p>{{ getAddress() }}</p>
+    <p>{{ structure.structure.contactPhone }}</p>
+    <p>{{ structure.structure.contactPersonEmail }}</p>
+  </div>
+  <div fxLayout="column" fxLayoutGap="14px">
+    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+      <p class="section-title">MEMBRES</p>
+      <app-button
+        [type]="'button'"
+        [iconBtn]="'edit'"
+        [text]="'Gérer les membres'"
+        [style]="buttonTypeEnum.SecondaryWide"
+        routerLink="./"
+        [routerLinkActive]="'active'"
+      ></app-button>
+    </div>
+  </div>
+</div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
new file mode 100644
index 000000000..a9c0444d3
--- /dev/null
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -0,0 +1,30 @@
+@import '../../../assets/scss/color';
+@import '../../../assets/scss/typography';
+@import '../../../assets/scss/breakpoint';
+@import '../../../assets/scss/shapes';
+
+.structureCard {
+  padding: 5px 16px;
+  border: 1px solid $grey-5;
+  border-radius: 4px;
+  p {
+    margin: 0 !important;
+    &.structureName {
+      @include lato-bold-16;
+    }
+    &.structureType {
+      @include lato-regular-14;
+      font-style: italic;
+      color: $grey-3;
+    }
+    &.section-title {
+      @include lato-bold-14;
+      color: $grey-3;
+    }
+    &.invalidText {
+      @include lato-regular-13;
+      margin: 0 0.5rem;
+      color: $orange-warning;
+    }
+  }
+}
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
new file mode 100644
index 000000000..12ed589d9
--- /dev/null
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -0,0 +1,44 @@
+import { Structure } from '@gouvfr-anct/mediation-numerique';
+import { Component, Input, OnInit } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+import { Router } from '@angular/router';
+import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
+import { StructureWithOwners } from '../../models/structureWithOwners.model';
+import { formUtils } from '../../utils/formUtils';
+import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
+
+@Component({
+  selector: 'app-profile-structure',
+  templateUrl: './profile-structure.component.html',
+  styleUrls: ['./profile-structure.component.scss'],
+})
+export class ProfileStructureComponent implements OnInit {
+  @Input() public structure: StructureWithOwners;
+  public structureForm: FormGroup;
+  public buttonTypeEnum = ButtonType;
+
+  constructor(private router: Router) {}
+
+  ngOnInit(): void {
+    console.log('INITIALISATION PROFILE STRUCTURE');
+    this.structureForm = new formUtils().createStructureForm(this.structure.structure);
+  }
+
+  public goBack(): void {
+    history.back();
+  }
+  public goToEdit(step: structureFormStep): void {
+    this.router.navigate(['/form/structure', this.structure.structure._id, structureFormStep[step]]);
+  }
+  public isValid(): boolean {
+    return this.structureForm.valid;
+  }
+  public getStructureTypeLabel(): string {
+    return new Structure(this.structure.structure).getLabelTypeStructure();
+  }
+
+  public getAddress(): string {
+    const address = this.structure.structure.address;
+    return address.numero + ' ' + address.street + ' - ' + address.commune;
+  }
+}
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 1894d6958..0ff1c988d 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -76,28 +76,12 @@
         [routerLinkActive]="'active'"
       ></app-button>
     </div>
-    <div fxLayout="column">
-      <div class="section-container" fxLayoutGap="18px" fxLayout="column">
-        <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
-          <div class="structureCard" *ngFor="let s of structures; let i = index">
-            <div class="structureInfo" fxLayout="column" fxLayoutGap="14px">
-              <div fxLayout="row" fxLayoutAlign="space-between start" fxLayoutGap="20px">
-                <a class="structureName" [routerLink]="['/profile']" [queryParams]="{ id: s.structure._id }">{{
-                  s.structure.structureName
-                }}</a>
-                <app-structure-options-modal
-                  [structure]="s"
-                  (closed)="ngOnInit()"
-                  (closedWithRefresh)="ngOnInit()"
-                ></app-structure-options-modal>
-              </div>
-              <div fxLayout="column" fxLayoutGap="14px" class="ownersBlock">
-                <p class="ownerName" *ngFor="let owner of s.owners">{{ owner.email }}</p>
-              </div>
-            </div>
-          </div>
-        </ng-container>
-      </div>
+    <div style="width: 100%" fxLayoutGap="18px" fxLayout="column">
+      <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
+        <div *ngFor="let structure of structures; let i = index">
+          <app-profile-structure [structure]="structure"></app-profile-structure>
+        </div>
+      </ng-container>
     </div>
   </section>
 
diff --git a/src/app/profile/profile.module.ts b/src/app/profile/profile.module.ts
index 845a5303a..762318168 100644
--- a/src/app/profile/profile.module.ts
+++ b/src/app/profile/profile.module.ts
@@ -1,13 +1,14 @@
+import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { ProfileComponent } from './profile.component';
 import { SharedModule } from '../shared/shared.module';
-import { CommonModule } from '@angular/common';
+import { EditComponent } from './edit/edit.component';
 import { ProfileRoutingModule } from './profile-routing.module';
+import { ProfileStructureComponent } from './profile-structure/profile-structure.component';
+import { ProfileComponent } from './profile.component';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
-import { EditComponent } from './edit/edit.component';
 
 @NgModule({
-  declarations: [ProfileComponent, StructureEditionSummaryComponent, EditComponent],
+  declarations: [ProfileComponent, StructureEditionSummaryComponent, EditComponent, ProfileStructureComponent],
   imports: [CommonModule, ProfileRoutingModule, SharedModule],
 })
 export class ProfileModule {}
diff --git a/src/assets/ico/fold.svg b/src/assets/ico/fold.svg
new file mode 100644
index 000000000..21c86e227
--- /dev/null
+++ b/src/assets/ico/fold.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 16L12.5 9L19 16" stroke="black" stroke-linecap="round" stroke-linejoin="round" />
+</svg>
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index a6b6fe08d..ad5dfafdf 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -520,5 +520,12 @@
 <path d="M10 21.1364L17.3889 27.5L23.1944 20.5L29 13.5" stroke="#47C562" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
 </symbol>
 
+<symbol id="unfold" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 10L12.5 17L19 10" stroke="black" stroke-linecap="round" stroke-linejoin="round" />
+</symbol>
+
+<symbol id="fold" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 16L12.5 9L19 16" stroke="black" stroke-linecap="round" stroke-linejoin="round" />
+</symbol>
 
 </svg>
diff --git a/src/assets/ico/unfold.svg b/src/assets/ico/unfold.svg
new file mode 100644
index 000000000..110722d2f
--- /dev/null
+++ b/src/assets/ico/unfold.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 10L12.5 17L19 10" stroke="black" stroke-linecap="round" stroke-linejoin="round" />
+</svg>
diff --git a/src/styles.scss b/src/styles.scss
index d3f5836ff..a2cb95d3e 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -346,33 +346,6 @@ button {
   }
 }
 
-.structureCard {
-  border: 1px solid $grey-4;
-  border-radius: 6px;
-  .structureInfo {
-    border-radius: 6px;
-    background: $white;
-    min-height: 100px;
-    padding: 33px 55px;
-    @media #{$large-phone} {
-      padding: 33px 25px;
-    }
-    a {
-      margin: 0;
-      &.structureName {
-        @include lato-bold-26;
-        color: $primary-color;
-        text-decoration: underline;
-      }
-    }
-    .ownerName {
-      @include lato-regular-18;
-      color: $grey-2;
-    }
-  }
-  @include background-hash($grey-2);
-}
-
 .loader {
   width: 100%;
   text-align: center;
-- 
GitLab


From 658f2d28ade90a4aeff9146b710e321f77fab540 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Tue, 6 Sep 2022 13:43:55 +0200
Subject: [PATCH 02/23] feat: warning icon on button

---
 .../profile-structure.component.html            |  5 +++--
 .../profile-structure.component.scss            | 17 +++++++++++++++++
 .../create-account-form.component.html          | 12 ++++++------
 .../form/{notvalidate.svg => notValidate.svg}   |  0
 4 files changed, 26 insertions(+), 8 deletions(-)
 rename src/assets/form/{notvalidate.svg => notValidate.svg} (100%)

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 6779d2feb..2b79501be 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -8,8 +8,8 @@
       </div>
     </div>
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
-      <div *ngIf="!isValid()" fxLayout="row" fxLayoutAlign="space-between center">
-        <app-svg-icon [iconClass]="'validation'" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
+      <div *ngIf="!isValid()" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="7px">
+        <app-svg-icon [iconClass]="'icon-26'" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
         <p class="invalidText">
           Informations <br />
           manquantes
@@ -38,6 +38,7 @@
           [style]="buttonTypeEnum.SecondaryWide"
           routerLink="./"
           [routerLinkActive]="'active'"
+          [ngClass]="{ warning: !isValid() }"
         ></app-button>
       </div>
     </div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index a9c0444d3..3c9d235a2 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -27,4 +27,21 @@
       color: $orange-warning;
     }
   }
+  app-button {
+    &.warning {
+      position: relative;
+      &:after {
+        content: '';
+        background-image: url('../../../assets/form/notValidate.svg');
+        background-size: cover;
+        width: 22px;
+        height: 22px;
+        position: absolute;
+        top: -5px;
+        right: -5px;
+        border: solid 1px $white;
+        border-radius: 50%;
+      }
+    }
+  }
 }
diff --git a/src/app/shared/components/create-account-form/create-account-form.component.html b/src/app/shared/components/create-account-form/create-account-form.component.html
index f515c1480..101ae9f8c 100644
--- a/src/app/shared/components/create-account-form/create-account-form.component.html
+++ b/src/app/shared/components/create-account-form/create-account-form.component.html
@@ -3,21 +3,21 @@
     <label for="email">Courriel du compte</label>
     <div fxLayout="row" fxLayoutGap="13px">
       <input type="text" autocomplete="on" formControlName="email" class="form-input" />
-      <img *ngIf="f.email.invalid && f.email.value" src="../../assets/form/notvalidate.svg" alt="logo invalid" />
+      <img *ngIf="f.email.invalid && f.email.value" src="../../assets/form/notValidate.svg" alt="logo invalid" />
     </div>
   </div>
   <div class="form-group" fxLayout="column">
     <label for="surname">Nom</label>
     <div fxLayout="row" fxLayoutGap="13px">
       <input type="text" autocomplete="on" formControlName="surname" class="form-input" />
-      <img *ngIf="f.surname.invalid && f.surname.value" src="../../assets/form/notvalidate.svg" alt="logo invalid" />
+      <img *ngIf="f.surname.invalid && f.surname.value" src="../../assets/form/notValidate.svg" alt="logo invalid" />
     </div>
   </div>
   <div class="form-group" fxLayout="column">
     <label for="name">Prénom</label>
     <div fxLayout="row" fxLayoutGap="13px">
       <input type="text" autocomplete="on" formControlName="name" class="form-input" />
-      <img *ngIf="f.name.invalid && f.name.value" src="../../assets/form/notvalidate.svg" alt="logo invalid" />
+      <img *ngIf="f.name.invalid && f.name.value" src="../../assets/form/notValidate.svg" alt="logo invalid" />
     </div>
   </div>
   <div class="form-group" fxLayout="column">
@@ -30,7 +30,7 @@
         formControlName="phone"
         class="form-input"
       />
-      <img *ngIf="f.phone.invalid && f.phone.value" src="../../assets/form/notvalidate.svg" alt="logo invalid" />
+      <img *ngIf="f.phone.invalid && f.phone.value" src="../../assets/form/notValidate.svg" alt="logo invalid" />
     </div>
   </div>
   <div class="form-group password" fxLayout="column">
@@ -52,7 +52,7 @@
         src="../../assets/form/eyePassword.svg"
         alt="logo eyePassword"
       />
-      <img *ngIf="f.password.invalid && f.password.value" src="../../assets/form/notvalidate.svg" alt="logo invalid" />
+      <img *ngIf="f.password.invalid && f.password.value" src="../../assets/form/notValidate.svg" alt="logo invalid" />
     </div>
   </div>
   <div class="form-group password" fxLayout="column">
@@ -72,7 +72,7 @@
       />
       <img
         *ngIf="f.confirmPassword.invalid && f.confirmPassword.value"
-        src="../../assets/form/notvalidate.svg"
+        src="../../assets/form/notValidate.svg"
         alt="logo invalid"
       />
     </div>
diff --git a/src/assets/form/notvalidate.svg b/src/assets/form/notValidate.svg
similarity index 100%
rename from src/assets/form/notvalidate.svg
rename to src/assets/form/notValidate.svg
-- 
GitLab


From 978849382f13649d91c5c18740faed73abf372da Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Tue, 6 Sep 2022 17:56:41 +0200
Subject: [PATCH 03/23] feat: display members + collapse

---
 .../profile-structure-member.component.html   | 13 ++++
 .../profile-structure-member.component.scss   | 16 ++++
 .../profile-structure-member.component.ts     | 21 ++++++
 .../profile-structure.component.html          | 75 ++++++++++++-------
 .../profile-structure.component.scss          |  4 +
 .../profile-structure.component.ts            | 24 +++++-
 src/app/profile/profile.component.html        |  4 +-
 src/app/profile/profile.module.ts             |  9 ++-
 8 files changed, 132 insertions(+), 34 deletions(-)
 create mode 100644 src/app/profile/profile-structure-member/profile-structure-member.component.html
 create mode 100644 src/app/profile/profile-structure-member/profile-structure-member.component.scss
 create mode 100644 src/app/profile/profile-structure-member/profile-structure-member.component.ts

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure-member/profile-structure-member.component.html
new file mode 100644
index 000000000..939ef40d1
--- /dev/null
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.html
@@ -0,0 +1,13 @@
+<div class="structureMember">
+  <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFill>
+    <app-svg-icon class="avatar" [type]="'avatar'" [icon]="'defaultAvatar'" [iconClass]="'icon-40'"></app-svg-icon>
+    <div class="nameJobSection" fxLayout="column" fxLayoutAlign="start start">
+      <p class="name">{{ member.name }} {{ member.surname }}</p>
+      <p>{{ getJob() }}, {{ getEmployer() }}</p>
+    </div>
+    <div fxLayout="column" fxLayoutAlign="space-between start">
+      <p>{{ member.phone }}</p>
+      <a href="mailto:{{ member.email }}">{{ member.email }}</a>
+    </div>
+  </div>
+</div>
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.scss b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
new file mode 100644
index 000000000..d202b1d79
--- /dev/null
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
@@ -0,0 +1,16 @@
+@import '../../../assets/scss/color';
+@import '../../../assets/scss/typography';
+@import '../../../assets/scss/breakpoint';
+@import '../../../assets/scss/shapes';
+
+.structureMember {
+  p {
+    margin: 0 !important;
+    &.name {
+      @include lato-bold-14;
+    }
+  }
+  .nameJobSection {
+    width: 50%;
+  }
+}
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.ts b/src/app/profile/profile-structure-member/profile-structure-member.component.ts
new file mode 100644
index 000000000..903b8d378
--- /dev/null
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.ts
@@ -0,0 +1,21 @@
+import { Component, Input } from '@angular/core';
+import { User } from './../../models/user.model';
+
+@Component({
+  selector: 'app-profile-structure-member',
+  templateUrl: './profile-structure-member.component.html',
+  styleUrls: ['./profile-structure-member.component.scss'],
+})
+export class ProfileStructureMemberComponent {
+  @Input() public member: User;
+
+  constructor() {}
+
+  getJob() {
+    return this.member.job.name;
+  }
+
+  getEmployer() {
+    return this.member.employer.name;
+  }
+}
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 2b79501be..df438e21e 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -1,5 +1,11 @@
-<div class="structureCard">
-  <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+<div class="structureCard" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px">
+  <div
+    class="collapseHeader"
+    fxLayout="row"
+    fxLayoutAlign="space-between center"
+    fxLayoutGap="20px"
+    (click)="toggleDetails()"
+  >
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
       <div fxLayout="column" fxLayoutAlign="space-between start">
@@ -18,42 +24,57 @@
       <app-svg-icon [type]="'ico'" [icon]="'fold'" [iconClass]="'icon-26'"></app-svg-icon>
     </div>
   </div>
-  <div fxLayout="column">
-    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
-      <p class="section-title">INFORMATIONS</p>
-      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
-        <app-button
-          [type]="'button'"
-          [iconBtn]="'eyePassword'"
-          [iconType]="'form'"
-          [text]="'Voir la structure'"
-          [style]="buttonTypeEnum.SecondaryWide"
-          routerLink="./"
-          [routerLinkActive]="'active'"
-        ></app-button>
+  <div [hidden]="!showDetails">
+    <div fxLayout="column">
+      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+        <p class="section-title">INFORMATIONS</p>
+        <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
+          <app-button
+            [type]="'button'"
+            [iconBtn]="'eyePassword'"
+            [iconType]="'form'"
+            [text]="'Voir la structure'"
+            [style]="buttonTypeEnum.SecondaryWide"
+            routerLink="./"
+            [routerLinkActive]="'active'"
+          ></app-button>
+          <app-button
+            [type]="'button'"
+            [iconBtn]="'edit'"
+            [text]="'Modifier la structure'"
+            [style]="buttonTypeEnum.SecondaryWide"
+            routerLink="./"
+            [routerLinkActive]="'active'"
+            [ngClass]="{ warning: !isValid() }"
+          ></app-button>
+        </div>
+      </div>
+      <p>{{ getAddress() }}</p>
+      <p>{{ structure.structure.contactPhone }}</p>
+      <p>{{ structure.structure.contactPersonEmail }}</p>
+    </div>
+    <div *ngIf="members.length > 0" fxLayout="column" fxLayoutGap="14px">
+      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+        <p class="section-title">MEMBRES</p>
         <app-button
           [type]="'button'"
           [iconBtn]="'edit'"
-          [text]="'Modifier la structure'"
+          [text]="'Gérer les membres'"
           [style]="buttonTypeEnum.SecondaryWide"
           routerLink="./"
           [routerLinkActive]="'active'"
-          [ngClass]="{ warning: !isValid() }"
         ></app-button>
       </div>
+      <div *ngFor="let member of members; let i = index">
+        <app-profile-structure-member [member]="member"></app-profile-structure-member>
+      </div>
     </div>
-    <p>{{ getAddress() }}</p>
-    <p>{{ structure.structure.contactPhone }}</p>
-    <p>{{ structure.structure.contactPersonEmail }}</p>
-  </div>
-  <div fxLayout="column" fxLayoutGap="14px">
-    <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
-      <p class="section-title">MEMBRES</p>
+    <div class="call-to-action" *ngIf="members.length === 0">
       <app-button
         [type]="'button'"
-        [iconBtn]="'edit'"
-        [text]="'Gérer les membres'"
-        [style]="buttonTypeEnum.SecondaryWide"
+        [iconBtn]="'add'"
+        [text]="'Ajouter un membre'"
+        [style]="buttonTypeEnum.SecondaryUltraWide"
         routerLink="./"
         [routerLinkActive]="'active'"
       ></app-button>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 3c9d235a2..8d4a6630c 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -44,4 +44,8 @@
       }
     }
   }
+  .call-to-action {
+    margin-top: 40px;
+    align-self: center;
+  }
 }
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 12ed589d9..8b45d6952 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -1,11 +1,13 @@
-import { Structure } from '@gouvfr-anct/mediation-numerique';
 import { Component, Input, OnInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { Router } from '@angular/router';
+import { Structure } from '@gouvfr-anct/mediation-numerique';
+import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
 import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
 import { StructureWithOwners } from '../../models/structureWithOwners.model';
 import { formUtils } from '../../utils/formUtils';
-import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
+import { User } from './../../models/user.model';
+import { UserService } from './../../services/user.service';
 
 @Component({
   selector: 'app-profile-structure',
@@ -14,14 +16,25 @@ import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
 })
 export class ProfileStructureComponent implements OnInit {
   @Input() public structure: StructureWithOwners;
+  @Input() public userProfile: User;
+  public members: User[] = [];
   public structureForm: FormGroup;
   public buttonTypeEnum = ButtonType;
+  public showDetails: boolean = false;
 
-  constructor(private router: Router) {}
+  constructor(private router: Router, private userService: UserService) {}
 
   ngOnInit(): void {
-    console.log('INITIALISATION PROFILE STRUCTURE');
     this.structureForm = new formUtils().createStructureForm(this.structure.structure);
+    this.structure.owners
+      .filter((owner) => {
+        return owner._id !== this.userProfile._id;
+      })
+      .forEach((owner) => {
+        this.userService.getUser(owner._id).subscribe((res) => {
+          this.members.push(res);
+        });
+      });
   }
 
   public goBack(): void {
@@ -36,6 +49,9 @@ export class ProfileStructureComponent implements OnInit {
   public getStructureTypeLabel(): string {
     return new Structure(this.structure.structure).getLabelTypeStructure();
   }
+  public toggleDetails(): void {
+    this.showDetails = !this.showDetails;
+  }
 
   public getAddress(): string {
     const address = this.structure.structure.address;
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 0ff1c988d..5531e1329 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -76,10 +76,10 @@
         [routerLinkActive]="'active'"
       ></app-button>
     </div>
-    <div style="width: 100%" fxLayoutGap="18px" fxLayout="column">
+    <div style="width: 100%" fxLayoutGap="16px" fxLayout="column">
       <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
         <div *ngFor="let structure of structures; let i = index">
-          <app-profile-structure [structure]="structure"></app-profile-structure>
+          <app-profile-structure [structure]="structure" [userProfile]="this.userProfile"></app-profile-structure>
         </div>
       </ng-container>
     </div>
diff --git a/src/app/profile/profile.module.ts b/src/app/profile/profile.module.ts
index 762318168..7fad3846d 100644
--- a/src/app/profile/profile.module.ts
+++ b/src/app/profile/profile.module.ts
@@ -3,12 +3,19 @@ import { NgModule } from '@angular/core';
 import { SharedModule } from '../shared/shared.module';
 import { EditComponent } from './edit/edit.component';
 import { ProfileRoutingModule } from './profile-routing.module';
+import { ProfileStructureMemberComponent } from './profile-structure-member/profile-structure-member.component';
 import { ProfileStructureComponent } from './profile-structure/profile-structure.component';
 import { ProfileComponent } from './profile.component';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
 
 @NgModule({
-  declarations: [ProfileComponent, StructureEditionSummaryComponent, EditComponent, ProfileStructureComponent],
+  declarations: [
+    ProfileComponent,
+    StructureEditionSummaryComponent,
+    EditComponent,
+    ProfileStructureComponent,
+    ProfileStructureMemberComponent,
+  ],
   imports: [CommonModule, ProfileRoutingModule, SharedModule],
 })
 export class ProfileModule {}
-- 
GitLab


From 48db38553faa210bb61965bbf2821d9ceb5dcd2b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Wed, 7 Sep 2022 17:23:48 +0200
Subject: [PATCH 04/23] style: collapse structure animation

---
 .../profile-structure.component.html          | 86 ++++++++++---------
 .../profile-structure.component.scss          | 60 +++++++------
 .../profile-structure.component.ts            | 16 +++-
 src/app/utils/formUtils.ts                    |  2 +-
 src/assets/form/notValidateWithBorder.svg     |  4 +
 src/assets/form/sprite.svg                    |  6 ++
 6 files changed, 105 insertions(+), 69 deletions(-)
 create mode 100644 src/assets/form/notValidateWithBorder.svg

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index df438e21e..adb3d17e3 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -1,4 +1,4 @@
-<div class="structureCard" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="20px">
+<div class="structureCard" fxLayout="column" fxLayoutAlign="center">
   <div
     class="collapseHeader"
     fxLayout="row"
@@ -21,63 +21,67 @@
           manquantes
         </p>
       </div>
-      <app-svg-icon [type]="'ico'" [icon]="'fold'" [iconClass]="'icon-26'"></app-svg-icon>
+      <app-svg-icon *ngIf="!showDetails" [type]="'ico'" [icon]="'unfold'" [iconClass]="'icon-26'"></app-svg-icon>
+      <app-svg-icon *ngIf="showDetails" [type]="'ico'" [icon]="'fold'" [iconClass]="'icon-26'"></app-svg-icon>
     </div>
   </div>
-  <div [hidden]="!showDetails">
-    <div fxLayout="column">
-      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
-        <p class="section-title">INFORMATIONS</p>
-        <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
-          <app-button
-            [type]="'button'"
-            [iconBtn]="'eyePassword'"
-            [iconType]="'form'"
-            [text]="'Voir la structure'"
-            [style]="buttonTypeEnum.SecondaryWide"
-            routerLink="./"
-            [routerLinkActive]="'active'"
-          ></app-button>
+  <div [@collapse]="showDetails">
+    <div class="collapseContent" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
+      <div fxLayout="column">
+        <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
+          <p class="section-title">INFORMATIONS</p>
+          <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
+            <app-button
+              [type]="'button'"
+              [iconBtn]="'eyePassword'"
+              [iconType]="'form'"
+              [text]="'Voir la structure'"
+              [style]="buttonTypeEnum.SecondaryWide"
+              routerLink="./"
+              [queryParams]="{ id: structure.structure._id }"
+              [routerLinkActive]="'active'"
+            ></app-button>
+            <app-button
+              [type]="'button'"
+              [iconBtn]="'edit'"
+              [text]="'Modifier la structure'"
+              [style]="buttonTypeEnum.SecondaryWide"
+              routerLink="./"
+              [routerLinkActive]="'active'"
+              [ngClass]="{ warning: !isValid() }"
+            ></app-button>
+          </div>
+        </div>
+        <p>{{ getAddress() }}</p>
+        <p>{{ structure.structure.contactPhone }}</p>
+        <p>{{ structure.structure.contactPersonEmail }}</p>
+      </div>
+      <div *ngIf="members.length > 0" fxLayout="column" fxLayoutGap="9px">
+        <div fxLayout="row" fxLayoutAlign="space-between center">
+          <p class="section-title">MEMBRES</p>
           <app-button
             [type]="'button'"
             [iconBtn]="'edit'"
-            [text]="'Modifier la structure'"
+            [text]="'Gérer les membres'"
             [style]="buttonTypeEnum.SecondaryWide"
             routerLink="./"
             [routerLinkActive]="'active'"
-            [ngClass]="{ warning: !isValid() }"
           ></app-button>
         </div>
+        <div *ngFor="let member of members; let i = index">
+          <app-profile-structure-member [member]="member"></app-profile-structure-member>
+        </div>
       </div>
-      <p>{{ getAddress() }}</p>
-      <p>{{ structure.structure.contactPhone }}</p>
-      <p>{{ structure.structure.contactPersonEmail }}</p>
-    </div>
-    <div *ngIf="members.length > 0" fxLayout="column" fxLayoutGap="14px">
-      <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
-        <p class="section-title">MEMBRES</p>
+      <div class="call-to-action" *ngIf="members.length === 0" fxLayout="row" fxLayoutAlign="center">
         <app-button
           [type]="'button'"
-          [iconBtn]="'edit'"
-          [text]="'Gérer les membres'"
-          [style]="buttonTypeEnum.SecondaryWide"
+          [iconBtn]="'add'"
+          [text]="'Ajouter un membre'"
+          [style]="buttonTypeEnum.SecondaryUltraWide"
           routerLink="./"
           [routerLinkActive]="'active'"
         ></app-button>
       </div>
-      <div *ngFor="let member of members; let i = index">
-        <app-profile-structure-member [member]="member"></app-profile-structure-member>
-      </div>
-    </div>
-    <div class="call-to-action" *ngIf="members.length === 0">
-      <app-button
-        [type]="'button'"
-        [iconBtn]="'add'"
-        [text]="'Ajouter un membre'"
-        [style]="buttonTypeEnum.SecondaryUltraWide"
-        routerLink="./"
-        [routerLinkActive]="'active'"
-      ></app-button>
     </div>
   </div>
 </div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 8d4a6630c..9e9d19428 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -4,27 +4,38 @@
 @import '../../../assets/scss/shapes';
 
 .structureCard {
-  padding: 5px 16px;
+  padding: 5px 6px;
   border: 1px solid $grey-5;
   border-radius: 4px;
-  p {
-    margin: 0 !important;
-    &.structureName {
-      @include lato-bold-16;
-    }
-    &.structureType {
-      @include lato-regular-14;
-      font-style: italic;
-      color: $grey-3;
-    }
-    &.section-title {
-      @include lato-bold-14;
-      color: $grey-3;
+  overflow: hidden;
+
+  .collapseHeader {
+    p {
+      margin: 0 !important;
+      &.structureName {
+        @include lato-bold-16;
+      }
+      &.structureType {
+        @include lato-regular-14;
+        font-style: italic;
+        color: $grey-3;
+      }
+      &.invalidText {
+        @include lato-regular-13;
+        margin: 0 0.5rem;
+        color: $orange-warning;
+      }
     }
-    &.invalidText {
-      @include lato-regular-13;
-      margin: 0 0.5rem;
-      color: $orange-warning;
+  }
+
+  .collapseContent {
+    padding: 0 10px;
+    p {
+      margin: 2px !important;
+      &.section-title {
+        @include lato-bold-14;
+        color: $grey-3;
+      }
     }
   }
   app-button {
@@ -32,20 +43,17 @@
       position: relative;
       &:after {
         content: '';
-        background-image: url('../../../assets/form/notValidate.svg');
+        background-image: url('../../../assets/form/notValidateWithBorder.svg');
         background-size: cover;
-        width: 22px;
-        height: 22px;
+        width: 24px;
+        height: 24px;
         position: absolute;
-        top: -5px;
-        right: -5px;
-        border: solid 1px $white;
-        border-radius: 50%;
+        top: -6px;
+        right: -6px;
       }
     }
   }
   .call-to-action {
     margin-top: 40px;
-    align-self: center;
   }
 }
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 8b45d6952..5b1367645 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -1,3 +1,4 @@
+import { animate, AUTO_STYLE, state, style, transition, trigger } from '@angular/animations';
 import { Component, Input, OnInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { Router } from '@angular/router';
@@ -13,6 +14,14 @@ import { UserService } from './../../services/user.service';
   selector: 'app-profile-structure',
   templateUrl: './profile-structure.component.html',
   styleUrls: ['./profile-structure.component.scss'],
+  animations: [
+    trigger('collapse', [
+      state('true', style({ height: AUTO_STYLE, visibility: AUTO_STYLE, margin: '8px 0' })),
+      state('false', style({ height: '0px', visibility: 'hidden', margin: '0' })),
+      transition('true => false', animate('300ms ease-out')),
+      transition('false => true', animate('300ms ease-out')),
+    ]),
+  ],
 })
 export class ProfileStructureComponent implements OnInit {
   @Input() public structure: StructureWithOwners;
@@ -25,7 +34,7 @@ export class ProfileStructureComponent implements OnInit {
   constructor(private router: Router, private userService: UserService) {}
 
   ngOnInit(): void {
-    this.structureForm = new formUtils().createStructureForm(this.structure.structure);
+    this.structureForm = new formUtils().createStructureForm(this.structure.structure, true);
     this.structure.owners
       .filter((owner) => {
         return owner._id !== this.userProfile._id;
@@ -44,6 +53,11 @@ export class ProfileStructureComponent implements OnInit {
     this.router.navigate(['/form/structure', this.structure.structure._id, structureFormStep[step]]);
   }
   public isValid(): boolean {
+    Object.keys(this.structureForm.controls).forEach((key) => {
+      if (this.structureForm.get(key).valid === false) {
+        console.log(`${this.structure.structure.structureName} ${key} ${this.structureForm.get(key).valid}`);
+      }
+    });
     return this.structureForm.valid;
   }
   public getStructureTypeLabel(): string {
diff --git a/src/app/utils/formUtils.ts b/src/app/utils/formUtils.ts
index 045487e85..5574c80cf 100644
--- a/src/app/utils/formUtils.ts
+++ b/src/app/utils/formUtils.ts
@@ -90,7 +90,7 @@ export class formUtils {
         Validators.required,
         Validators.pattern(CustomRegExp.PHONE),
       ]),
-      contactPersonFirstname: new FormControl(structure.contactPersonLastName, !isEditMode && Validators.required),
+      contactPersonFirstname: new FormControl(structure.contactPersonFirstName, !isEditMode && Validators.required),
       contactPersonLastname: new FormControl(structure.contactPersonLastName, !isEditMode && Validators.required),
       contactPersonEmail: new FormControl(
         structure.contactPersonEmail,
diff --git a/src/assets/form/notValidateWithBorder.svg b/src/assets/form/notValidateWithBorder.svg
new file mode 100644
index 000000000..5b57de44d
--- /dev/null
+++ b/src/assets/form/notValidateWithBorder.svg
@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="12" cy="12" r="11.5" fill="#DA6C2E" stroke="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.0835 7.00067C11.0835 6.49441 11.4939 6.084 12.0001 6.08398C12.5064 6.08397 12.9168 6.49437 12.9168 7.00063L12.917 14.0006C12.917 14.5069 12.5066 14.9173 12.0003 14.9173C11.4941 14.9173 11.0837 14.5069 11.0836 14.0007L11.0835 7.00067ZM11.0837 17.6896C11.0837 17.1833 11.4941 16.7729 12.0004 16.7729C12.5066 16.7729 12.917 17.1833 12.917 17.6896L12.917 18.0318C12.917 18.5381 12.5066 18.9485 12.0004 18.9485C11.4941 18.9485 11.0837 18.5381 11.0837 18.0318L11.0837 17.6896Z" fill="white"/>
+</svg>
diff --git a/src/assets/form/sprite.svg b/src/assets/form/sprite.svg
index 35ec22ab1..4d495ae8d 100644
--- a/src/assets/form/sprite.svg
+++ b/src/assets/form/sprite.svg
@@ -748,6 +748,12 @@
             stroke-linejoin="round" />
     </symbol>
 
+    <symbol id="notValidateWithBorder" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <circle cx="12" cy="12" r="11.5" fill="#DA6C2E" stroke="white"/>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M11.0835 7.00067C11.0835 6.49441 11.4939 6.084 12.0001 6.08398C12.5064 6.08397 12.9168 6.49437 12.9168 7.00063L12.917 14.0006C12.917 14.5069 12.5066 14.9173 12.0003 14.9173C11.4941 14.9173 11.0837 14.5069 11.0836 14.0007L11.0835 7.00067ZM11.0837 17.6896C11.0837 17.1833 11.4941 16.7729 12.0004 16.7729C12.5066 16.7729 12.917 17.1833 12.917 17.6896L12.917 18.0318C12.917 18.5381 12.5066 18.9485 12.0004 18.9485C11.4941 18.9485 11.0837 18.5381 11.0837 18.0318L11.0837 17.6896Z" fill="white"/>
+</symbol>
+
+
     <symbol id="validate" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
         <circle cx="13" cy="13" r="13" fill="#47C562" />
         <path d="M8 13.8182L11.8889 17L18 10" stroke="white" stroke-width="3" stroke-linecap="round"
-- 
GitLab


From c5d1e0b130b2018ceb5d8f116aaf9c62be038500 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 8 Sep 2022 14:15:15 +0200
Subject: [PATCH 05/23] feat: added link on buttons

---
 .../profile-structure-member.component.html                    | 2 +-
 .../profile-structure-member.component.scss                    | 3 +++
 .../profile/profile-structure/profile-structure.component.html | 2 +-
 src/app/profile/profile.component.html                         | 2 +-
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure-member/profile-structure-member.component.html
index 939ef40d1..bc5802ddf 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.html
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.html
@@ -2,7 +2,7 @@
   <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFill>
     <app-svg-icon class="avatar" [type]="'avatar'" [icon]="'defaultAvatar'" [iconClass]="'icon-40'"></app-svg-icon>
     <div class="nameJobSection" fxLayout="column" fxLayoutAlign="start start">
-      <p class="name">{{ member.name }} {{ member.surname }}</p>
+      <a routerLink="/profile/{{ member._id }}" class="name">{{ member.name }} {{ member.surname }}</a>
       <p>{{ getJob() }}, {{ getEmployer() }}</p>
     </div>
     <div fxLayout="column" fxLayoutAlign="space-between start">
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.scss b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
index d202b1d79..87ddb7a18 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.scss
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
@@ -6,8 +6,11 @@
 .structureMember {
   p {
     margin: 0 !important;
+  }
+  a {
     &.name {
       @include lato-bold-14;
+      color: $black;
     }
   }
   .nameJobSection {
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index adb3d17e3..5bcb11c61 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -46,7 +46,7 @@
               [iconBtn]="'edit'"
               [text]="'Modifier la structure'"
               [style]="buttonTypeEnum.SecondaryWide"
-              routerLink="./"
+              routerLink="./edit-structure/{{ structure.structure._id }}"
               [routerLinkActive]="'active'"
               [ngClass]="{ warning: !isValid() }"
             ></app-button>
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 5531e1329..60d224797 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -64,7 +64,7 @@
         [iconBtn]="'edit'"
         [text]="'Gérer mes structures'"
         [style]="buttonTypeEnum.SecondaryWide"
-        routerLink="/profile/edit"
+        routerLink="./"
         [routerLinkActive]="'active'"
       ></app-button>
       <app-button
-- 
GitLab


From 9bdf523945d962c3941122d428afb62edcf93d47 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 8 Sep 2022 15:48:06 +0200
Subject: [PATCH 06/23] feat: added structure contact mail

---
 .../profile-structure.component.html             | 16 +++++++++++++---
 .../profile-structure.component.scss             | 13 ++++++++-----
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 5bcb11c61..8855f481f 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -52,9 +52,19 @@
             ></app-button>
           </div>
         </div>
-        <p>{{ getAddress() }}</p>
-        <p>{{ structure.structure.contactPhone }}</p>
-        <p>{{ structure.structure.contactPersonEmail }}</p>
+        <div class="infoSection" fxLayout="column" fxLayoutAlign="space-between start" fxLayoutGap="4px">
+          <div>
+            <p>{{ getAddress() }}</p>
+          </div>
+          <div>
+            <p>{{ structure.structure.contactPhone }}</p>
+          </div>
+          <div>
+            <a class="mail" href="mailto:{{ structure.structure.contactMail }}">{{
+              structure.structure.contactMail
+            }}</a>
+          </div>
+        </div>
       </div>
       <div *ngIf="members.length > 0" fxLayout="column" fxLayoutGap="9px">
         <div fxLayout="row" fxLayoutAlign="space-between center">
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 9e9d19428..44afd8b74 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -30,12 +30,15 @@
 
   .collapseContent {
     padding: 0 10px;
+    .infoSection {
+      @include lato-regular-14;
+    }
+    .section-title {
+      @include lato-bold-14;
+      color: $grey-3;
+    }
     p {
-      margin: 2px !important;
-      &.section-title {
-        @include lato-bold-14;
-        color: $grey-3;
-      }
+      margin: 0 !important;
     }
   }
   app-button {
-- 
GitLab


From 53f35ab66137db0f139a0da47b0194c3c7108453 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 8 Sep 2022 17:22:43 +0200
Subject: [PATCH 07/23] feat: added mobile responsiveness

---
 .../profile-structure-member.component.html   |  7 +++-
 .../profile-structure.component.html          | 32 ++++++++++++++++++-
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure-member/profile-structure-member.component.html
index bc5802ddf..b906ab53d 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.html
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.html
@@ -1,6 +1,11 @@
 <div class="structureMember">
   <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px" fxFill>
-    <app-svg-icon class="avatar" [type]="'avatar'" [icon]="'defaultAvatar'" [iconClass]="'icon-40'"></app-svg-icon>
+    <app-svg-icon
+      class="avatar hide-on-mobile"
+      [type]="'avatar'"
+      [icon]="'defaultAvatar'"
+      [iconClass]="'icon-40'"
+    ></app-svg-icon>
     <div class="nameJobSection" fxLayout="column" fxLayoutAlign="start start">
       <a routerLink="/profile/{{ member._id }}" class="name">{{ member.name }} {{ member.surname }}</a>
       <p>{{ getJob() }}, {{ getEmployer() }}</p>
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 8855f481f..0afddedf1 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -16,7 +16,7 @@
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <div *ngIf="!isValid()" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="7px">
         <app-svg-icon [iconClass]="'icon-26'" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
-        <p class="invalidText">
+        <p class="invalidText hide-on-mobile">
           Informations <br />
           manquantes
         </p>
@@ -32,6 +32,7 @@
           <p class="section-title">INFORMATIONS</p>
           <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
             <app-button
+              class="hide-on-mobile"
               [type]="'button'"
               [iconBtn]="'eyePassword'"
               [iconType]="'form'"
@@ -42,6 +43,17 @@
               [routerLinkActive]="'active'"
             ></app-button>
             <app-button
+              class="hide-on-desktop"
+              [type]="'button'"
+              [iconBtn]="'eyePassword'"
+              [iconType]="'form'"
+              [style]="buttonTypeEnum.SecondaryOnlyIcon"
+              routerLink="./"
+              [queryParams]="{ id: structure.structure._id }"
+              [routerLinkActive]="'active'"
+            ></app-button>
+            <app-button
+              class="hide-on-mobile"
               [type]="'button'"
               [iconBtn]="'edit'"
               [text]="'Modifier la structure'"
@@ -50,6 +62,15 @@
               [routerLinkActive]="'active'"
               [ngClass]="{ warning: !isValid() }"
             ></app-button>
+            <app-button
+              class="hide-on-desktop"
+              [type]="'button'"
+              [iconBtn]="'edit'"
+              [style]="buttonTypeEnum.SecondaryOnlyIcon"
+              routerLink="./edit-structure/{{ structure.structure._id }}"
+              [routerLinkActive]="'active'"
+              [ngClass]="{ warning: !isValid() }"
+            ></app-button>
           </div>
         </div>
         <div class="infoSection" fxLayout="column" fxLayoutAlign="space-between start" fxLayoutGap="4px">
@@ -70,6 +91,7 @@
         <div fxLayout="row" fxLayoutAlign="space-between center">
           <p class="section-title">MEMBRES</p>
           <app-button
+            class="hide-on-mobile"
             [type]="'button'"
             [iconBtn]="'edit'"
             [text]="'Gérer les membres'"
@@ -77,6 +99,14 @@
             routerLink="./"
             [routerLinkActive]="'active'"
           ></app-button>
+          <app-button
+            class="hide-on-desktop"
+            [type]="'button'"
+            [iconBtn]="'edit'"
+            [style]="buttonTypeEnum.SecondaryOnlyIcon"
+            routerLink="./"
+            [routerLinkActive]="'active'"
+          ></app-button>
         </div>
         <div *ngFor="let member of members; let i = index">
           <app-profile-structure-member [member]="member"></app-profile-structure-member>
-- 
GitLab


From 421ccec333c061bcc6927a94e3d4e14758085d59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 8 Sep 2022 17:56:31 +0200
Subject: [PATCH 08/23] feat: handle public profiles

---
 .../profile-structure-member.component.html   |  2 +-
 .../profile-structure-member.component.ts     | 19 ++++++++------
 .../profile-structure.component.html          | 25 +++++++++----------
 .../profile-structure.component.scss          |  1 +
 .../profile-structure.component.ts            |  7 +++---
 src/app/profile/profile.component.html        |  6 ++++-
 6 files changed, 35 insertions(+), 25 deletions(-)

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure-member/profile-structure-member.component.html
index b906ab53d..d65cf38e7 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.html
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.html
@@ -8,7 +8,7 @@
     ></app-svg-icon>
     <div class="nameJobSection" fxLayout="column" fxLayoutAlign="start start">
       <a routerLink="/profile/{{ member._id }}" class="name">{{ member.name }} {{ member.surname }}</a>
-      <p>{{ getJob() }}, {{ getEmployer() }}</p>
+      <p>{{ getJobEmployer() }}</p>
     </div>
     <div fxLayout="column" fxLayoutAlign="space-between start">
       <p>{{ member.phone }}</p>
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.ts b/src/app/profile/profile-structure-member/profile-structure-member.component.ts
index 903b8d378..b159313bd 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.ts
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.ts
@@ -4,18 +4,23 @@ import { User } from './../../models/user.model';
 @Component({
   selector: 'app-profile-structure-member',
   templateUrl: './profile-structure-member.component.html',
-  styleUrls: ['./profile-structure-member.component.scss'],
+  styleUrls: ['./profile-structure-member.component.scss']
 })
 export class ProfileStructureMemberComponent {
   @Input() public member: User;
 
   constructor() {}
 
-  getJob() {
-    return this.member.job.name;
-  }
-
-  getEmployer() {
-    return this.member.employer.name;
+  getJobEmployer(): string {
+    if (this.member.job?.name && this.member.employer?.name) {
+      return this.member.job.name + ', ' + this.member.employer.name;
+    }
+    if (this.member.job?.name && !this.member.employer?.name) {
+      return this.member.job.name;
+    }
+    if (!this.member.job?.name && this.member.employer?.name) {
+      return this.member.employer.name;
+    }
+    return '';
   }
 }
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 0afddedf1..76c3cc53d 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -1,11 +1,5 @@
 <div class="structureCard" fxLayout="column" fxLayoutAlign="center">
-  <div
-    class="collapseHeader"
-    fxLayout="row"
-    fxLayoutAlign="space-between center"
-    fxLayoutGap="20px"
-    (click)="toggleDetails()"
-  >
+  <div class="collapseHeader" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px" (click)="toggleDetails()">
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
       <div fxLayout="column" fxLayoutAlign="space-between start">
@@ -14,10 +8,11 @@
       </div>
     </div>
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
-      <div *ngIf="!isValid()" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="7px">
+      <div *ngIf="!isPublic && !isValid()" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="7px">
         <app-svg-icon [iconClass]="'icon-26'" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
         <p class="invalidText hide-on-mobile">
-          Informations <br />
+          Informations
+          <br />
           manquantes
         </p>
       </div>
@@ -32,6 +27,7 @@
           <p class="section-title">INFORMATIONS</p>
           <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
             <app-button
+              *ngIf="!isPublic"
               class="hide-on-mobile"
               [type]="'button'"
               [iconBtn]="'eyePassword'"
@@ -43,6 +39,7 @@
               [routerLinkActive]="'active'"
             ></app-button>
             <app-button
+              *ngIf="!isPublic"
               class="hide-on-desktop"
               [type]="'button'"
               [iconBtn]="'eyePassword'"
@@ -53,6 +50,7 @@
               [routerLinkActive]="'active'"
             ></app-button>
             <app-button
+              *ngIf="!isPublic"
               class="hide-on-mobile"
               [type]="'button'"
               [iconBtn]="'edit'"
@@ -63,6 +61,7 @@
               [ngClass]="{ warning: !isValid() }"
             ></app-button>
             <app-button
+              *ngIf="!isPublic"
               class="hide-on-desktop"
               [type]="'button'"
               [iconBtn]="'edit'"
@@ -81,9 +80,7 @@
             <p>{{ structure.structure.contactPhone }}</p>
           </div>
           <div>
-            <a class="mail" href="mailto:{{ structure.structure.contactMail }}">{{
-              structure.structure.contactMail
-            }}</a>
+            <a class="mail" href="mailto:{{ structure.structure.contactMail }}">{{ structure.structure.contactMail }}</a>
           </div>
         </div>
       </div>
@@ -91,6 +88,7 @@
         <div fxLayout="row" fxLayoutAlign="space-between center">
           <p class="section-title">MEMBRES</p>
           <app-button
+            *ngIf="!isPublic"
             class="hide-on-mobile"
             [type]="'button'"
             [iconBtn]="'edit'"
@@ -100,6 +98,7 @@
             [routerLinkActive]="'active'"
           ></app-button>
           <app-button
+            *ngIf="!isPublic"
             class="hide-on-desktop"
             [type]="'button'"
             [iconBtn]="'edit'"
@@ -112,7 +111,7 @@
           <app-profile-structure-member [member]="member"></app-profile-structure-member>
         </div>
       </div>
-      <div class="call-to-action" *ngIf="members.length === 0" fxLayout="row" fxLayoutAlign="center">
+      <div class="call-to-action" *ngIf="!isPublic && members.length === 0" fxLayout="row" fxLayoutAlign="center">
         <app-button
           [type]="'button'"
           [iconBtn]="'add'"
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 44afd8b74..4814a32c4 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -10,6 +10,7 @@
   overflow: hidden;
 
   .collapseHeader {
+    cursor: pointer;
     p {
       margin: 0 !important;
       &.structureName {
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 5b1367645..f11bda117 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -19,13 +19,14 @@ import { UserService } from './../../services/user.service';
       state('true', style({ height: AUTO_STYLE, visibility: AUTO_STYLE, margin: '8px 0' })),
       state('false', style({ height: '0px', visibility: 'hidden', margin: '0' })),
       transition('true => false', animate('300ms ease-out')),
-      transition('false => true', animate('300ms ease-out')),
-    ]),
-  ],
+      transition('false => true', animate('300ms ease-out'))
+    ])
+  ]
 })
 export class ProfileStructureComponent implements OnInit {
   @Input() public structure: StructureWithOwners;
   @Input() public userProfile: User;
+  @Input() public isPublic: boolean;
   public members: User[] = [];
   public structureForm: FormGroup;
   public buttonTypeEnum = ButtonType;
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 7f4deac9b..e3c1064b9 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -91,7 +91,11 @@
     <div style="width: 100%" fxLayoutGap="16px" fxLayout="column">
       <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
         <div *ngFor="let structure of structures; let i = index">
-          <app-profile-structure [structure]="structure" [userProfile]="this.userProfile"></app-profile-structure>
+          <app-profile-structure
+            [structure]="structure"
+            [userProfile]="this.userProfile"
+            [isPublic]="this.isPublic"
+          ></app-profile-structure>
         </div>
       </ng-container>
     </div>
-- 
GitLab


From f13081ea667ac43248d02a477577688d08bf3a51 Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Mon, 12 Sep 2022 08:56:10 +0200
Subject: [PATCH 09/23] feat(profile): add structure owners screen

---
 .ignore                                       |   3 +
 .../form/footer-form/footer-form.component.ts |   8 +-
 .../account-credentials.component.scss        |   5 +
 .../account-form/account-form.component.html  |   1 +
 .../account-form/account-form.component.ts    |   2 +-
 .../form-view/form-view-routing.module.ts     |  11 ++
 .../form/form-view/form-view.component.html   |   9 +-
 src/app/form/form-view/form-view.component.ts |  51 +++++---
 src/app/form/form-view/formType.enum.ts       |   1 +
 src/app/models/owner.model.ts                 |   2 +
 src/app/models/temp-user.model.ts             |   1 +
 src/app/profile/profile-routing.module.ts     |  10 ++
 src/app/profile/profile.module.ts             |  10 +-
 .../structure-add-member-modal.component.html |  32 +++++
 .../structure-add-member-modal.component.scss |  44 +++++++
 ...ructure-add-member-modal.component.spec.ts |  24 ++++
 .../structure-add-member-modal.component.ts   |  54 +++++++++
 ...tructure-members-management.component.html |  89 ++++++++++++++
 ...tructure-members-management.component.scss |  66 +++++++++++
 ...cture-members-management.component.spec.ts |  24 ++++
 .../structure-members-management.component.ts | 111 ++++++++++++++++++
 src/app/resolvers/temp-user.resolver.ts       |   2 +-
 src/app/services/structure.service.ts         |   7 ++
 .../modal-options.component.html              |   4 +
 .../structure-options-modal.component.ts      |   3 +
 .../enum/functionTypeModalOptions.enum.ts     |   1 +
 .../structure-details-wrapper.component.html  |   2 +-
 27 files changed, 552 insertions(+), 25 deletions(-)
 create mode 100644 .ignore
 create mode 100644 src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
 create mode 100644 src/app/profile/structure-add-member-modal/structure-add-member-modal.component.scss
 create mode 100644 src/app/profile/structure-add-member-modal/structure-add-member-modal.component.spec.ts
 create mode 100644 src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
 create mode 100644 src/app/profile/structure-members-management/structure-members-management.component.html
 create mode 100644 src/app/profile/structure-members-management/structure-members-management.component.scss
 create mode 100644 src/app/profile/structure-members-management/structure-members-management.component.spec.ts
 create mode 100644 src/app/profile/structure-members-management/structure-members-management.component.ts

diff --git a/.ignore b/.ignore
new file mode 100644
index 000000000..be10b0d32
--- /dev/null
+++ b/.ignore
@@ -0,0 +1,3 @@
+# Disable exclusion of files from .gitignore for vscode search (cf. https://stackoverflow.com/a/72059075 )
+# External libs
+!/projects
diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index efb974698..8ecfd8a62 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -22,7 +22,6 @@ export class FooterFormComponent implements OnChanges {
   @Input() currentForm: formType;
   @Input() isValid: boolean;
   @Input() isClaimMode: boolean;
-  @Input() isAccountMode: boolean;
   @Input() btnName: string[];
   @Input() nbPagesForm: number;
   @Input() form: FormGroup;
@@ -112,8 +111,11 @@ export class FooterFormComponent implements OnChanges {
       const user = new User(this.form.value);
       // Create user with structure
       user.structuresLink = this.linkedStructureId;
-      this.authService.register(user).subscribe(() => {});
-      this.newsletterService.newsletterSubscribe(user.email).subscribe(() => {});
+      this.authService.register(user).subscribe(() => {
+        if (this.acceptNewsletter) {
+          this.newsletterService.newsletterSubscribe(user.email).subscribe(() => {});
+        }
+      });
       document.getElementsByClassName('page')[0].scrollTo(0, 0);
     }
     if (this.isProfileLastPage()) {
diff --git a/src/app/form/form-view/account-form/account-credentials/account-credentials.component.scss b/src/app/form/form-view/account-form/account-credentials/account-credentials.component.scss
index 6399786d7..26d92dee3 100644
--- a/src/app/form/form-view/account-form/account-credentials/account-credentials.component.scss
+++ b/src/app/form/form-view/account-form/account-credentials/account-credentials.component.scss
@@ -1,6 +1,11 @@
 @import '../../../../../assets/scss/color';
 @import '../../../../../assets/scss/typography';
 
+.disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+
 p.special {
   @include lato-regular-14;
   color: $grey-3;
diff --git a/src/app/form/form-view/account-form/account-form.component.html b/src/app/form/form-view/account-form/account-form.component.html
index eda10b761..deda50a65 100644
--- a/src/app/form/form-view/account-form/account-form.component.html
+++ b/src/app/form/form-view/account-form/account-form.component.html
@@ -11,6 +11,7 @@
     <app-account-credentials
       [accountForm]="accountForm"
       [profile]="profile"
+      [isAccountMode]="isAccountMode"
       (validateForm)="setValidationsForm($event)"
       (userExists)="verifyUserExist($event)"
     ></app-account-credentials>
diff --git a/src/app/form/form-view/account-form/account-form.component.ts b/src/app/form/form-view/account-form/account-form.component.ts
index b3fc50198..ee1b336e2 100644
--- a/src/app/form/form-view/account-form/account-form.component.ts
+++ b/src/app/form/form-view/account-form/account-form.component.ts
@@ -14,8 +14,8 @@ export class AccountFormComponent implements OnChanges {
   @Input() nbSteps: number;
   @Input() currentStep: accountFormStep;
   @Input() accountForm: FormGroup;
+  @Input() isAccountMode: boolean;
   public isClaimMode = false;
-  public isAccountMode = false;
   public pagesValidation = [];
   public userAcceptSavedDate = false;
   public isPageValid: boolean;
diff --git a/src/app/form/form-view/form-view-routing.module.ts b/src/app/form/form-view/form-view-routing.module.ts
index 9768d97d6..a68d9f118 100644
--- a/src/app/form/form-view/form-view-routing.module.ts
+++ b/src/app/form/form-view/form-view-routing.module.ts
@@ -2,8 +2,10 @@ import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { AdminGuard } from '../../guards/admin.guard';
 import { AuthGuard } from '../../guards/auth.guard';
+import { DeactivateGuard } from '../../guards/deactivate.guard';
 import { RoleGuard } from '../../guards/role.guard';
 import { StructureResolver } from '../../resolvers/structure.resolver';
+import { TempUserResolver } from '../../resolvers/temp-user.resolver';
 import { RouteRole } from '../../shared/enum/routeRole.enum';
 import { AccountFormComponent } from './account-form/account-form.component';
 import { FormViewComponent } from './form-view.component';
@@ -22,9 +24,18 @@ const routes: Routes = [
       structure: StructureResolver,
     },
   },
+  {
+    path: 'register/:id',
+    component: FormViewComponent,
+    canDeactivate: [DeactivateGuard],
+    resolve: {
+      user: TempUserResolver,
+    },
+  },
   {
     path: '',
     component: FormViewComponent,
+    canDeactivate: [DeactivateGuard],
     children: [
       {
         path: 'structure',
diff --git a/src/app/form/form-view/form-view.component.html b/src/app/form/form-view/form-view.component.html
index ed72d6c08..a4089fd03 100644
--- a/src/app/form/form-view/form-view.component.html
+++ b/src/app/form/form-view/form-view.component.html
@@ -1,4 +1,9 @@
 <div class="formView">
+  <app-modal-confirmation
+    [openned]="showConfirmationModal"
+    [content]="'Il vous faudra de nouveau remplir le formulaire si vous quittez'"
+    (closed)="hasRedirectionAccepted($event)"
+  ></app-modal-confirmation>
   <app-progress-bar
     [formType]="formType[routeParam]"
     [isEditMode]="isEditMode"
@@ -6,12 +11,13 @@
     [nbSteps]="nbSteps"
   ></app-progress-bar>
   <div class="page">
-    <ng-container *ngIf="formType[routeParam] === formType.account">
+    <ng-container *ngIf="formType[routeParam] === formType.account || formType[this.routeParam] === formType.register">
       <app-account-form
         [nbSteps]="nbSteps"
         [accountForm]="accountForm"
         [hoursForm]="hoursForm"
         [currentStep]="currentPage"
+        [isAccountMode]="isAccountMode"
         (goNext)="nextPage()"
         (pageValid)="validatePage($event)"
         (acceptNewsletter)="acceptReceiveNewsletter($event)"
@@ -57,6 +63,7 @@
     [currentStep]="currentPage"
     [currentForm]="currentFormType"
     [form]="currentForm"
+    [linkedStructureId]="linkedStructureId"
     [btnName]="['Précédent', 'Suivant']"
     [isValid]="isPageValid"
     [acceptNewsletter]="userAcceptNewsletter"
diff --git a/src/app/form/form-view/form-view.component.ts b/src/app/form/form-view/form-view.component.ts
index a2d8a24c7..0fa69a9fe 100644
--- a/src/app/form/form-view/form-view.component.ts
+++ b/src/app/form/form-view/form-view.component.ts
@@ -60,6 +60,10 @@ export class FormViewComponent implements OnInit {
   public showWebsite: boolean;
   public showSocialNetwork: boolean;
 
+  // Modal canExit var
+  public showConfirmationModal = false;
+  private resolve: Function;
+
   public profile: User;
   public isAccountMode: boolean = false;
   public isClaimMode: boolean = false;
@@ -87,24 +91,7 @@ export class FormViewComponent implements OnInit {
       this.profile = user;
     });
     // Check if it's a new structure or edit structure
-    // this.isLoading = false;
-    if (history.state.newUser) {
-      this.isClaimMode = true;
-      // Handle join structure, the case is very similar to claim
-      if (history.state.isJoin) {
-        this.isJoinMode = true;
-      }
-      this.createAccountForm();
-      this.claimStructure = history.state.newUser;
-    }
-    // Handle account creation when pre-register
     this.route.data.subscribe((data) => {
-      if (data.user) {
-        this.isAccountMode = true;
-        this.createAccountForm(data.user.email);
-        this.linkedStructureId = data.user.pendingStructuresLink;
-        this.currentPage = accountFormStep.accountInfo;
-      }
       if (data.structure) {
         this.isEditMode = true;
         this.structure = data.structure;
@@ -136,6 +123,19 @@ export class FormViewComponent implements OnInit {
       this.createAccountForm();
       this.currentForm = this.accountForm;
     }
+    if (formType[this.routeParam] === formType.register) {
+      this.nbSteps = 3;
+      this.currentPage = accountFormStep.accountInfo;
+      this.currentFormType = formType.account;
+      this.route.data.subscribe((data) => {
+        if (data.user) {
+          this.createAccountForm(data.user.email);
+          this.linkedStructureId = data.user.pendingStructuresLink;
+          this.currentForm = this.accountForm;
+          this.isAccountMode = true;
+        }
+      });
+    }
     if (formType[this.routeParam] === formType.profile) {
       this.nbSteps = totalFormSteps;
       this.currentPage = profileFormStep.profileBeginningInfo;
@@ -357,4 +357,21 @@ export class FormViewComponent implements OnInit {
       history.back();
     });
   }
+
+  public canExit(): Promise<boolean> {
+    // Avoid confirmation when user submit form and leave.
+    if (this.currentPage === this.nbSteps || this.currentPage < 1 || this.isEditMode) {
+      return new Promise((resolve) => resolve(true));
+    } else {
+      return new Promise((resolve) => this.showModal(resolve));
+    }
+  }
+  private showModal(resolve: Function): void {
+    this.showConfirmationModal = true;
+    this.resolve = resolve;
+  }
+  public hasRedirectionAccepted(hasAccept: boolean): void {
+    this.resolve(hasAccept);
+    this.showConfirmationModal = false;
+  }
 }
diff --git a/src/app/form/form-view/formType.enum.ts b/src/app/form/form-view/formType.enum.ts
index c82157735..d5a7dd7dc 100644
--- a/src/app/form/form-view/formType.enum.ts
+++ b/src/app/form/form-view/formType.enum.ts
@@ -3,4 +3,5 @@ export enum formType {
   profile,
   personaloffer,
   account,
+  register,
 }
diff --git a/src/app/models/owner.model.ts b/src/app/models/owner.model.ts
index 55bc8c6c6..973d8fce0 100644
--- a/src/app/models/owner.model.ts
+++ b/src/app/models/owner.model.ts
@@ -2,4 +2,6 @@ export class Owner {
   email: string;
   _id: string;
   // id: string;
+  public name: string = null;
+  public surname: string = null;
 }
diff --git a/src/app/models/temp-user.model.ts b/src/app/models/temp-user.model.ts
index 8540ce74e..6572cb280 100644
--- a/src/app/models/temp-user.model.ts
+++ b/src/app/models/temp-user.model.ts
@@ -2,4 +2,5 @@ export class TempUser {
   _id: string;
   email: string;
   pendingStructuresLink: string[];
+  updatedAt: string;
 }
diff --git a/src/app/profile/profile-routing.module.ts b/src/app/profile/profile-routing.module.ts
index 20e114fbd..90ad6d1c3 100644
--- a/src/app/profile/profile-routing.module.ts
+++ b/src/app/profile/profile-routing.module.ts
@@ -3,6 +3,7 @@ import { Routes, RouterModule } from '@angular/router';
 import { RoleGuard } from '../guards/role.guard';
 import { StructureResolver } from '../resolvers/structure.resolver';
 import { RouteRole } from '../shared/enum/routeRole.enum';
+import { StructureMembersManagementComponent } from './structure-members-management/structure-members-management.component';
 import { ProfileComponent } from './profile.component';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
 
@@ -20,6 +21,15 @@ const routes: Routes = [
       structure: StructureResolver,
     },
   },
+  {
+    path: 'structure-members-management/:id',
+    component: StructureMembersManagementComponent,
+    canActivate: [RoleGuard],
+    data: { allowedRoles: [RouteRole.structureAdmin] },
+    resolve: {
+      structure: StructureResolver,
+    },
+  },
 ];
 @NgModule({
   imports: [RouterModule.forChild(routes)],
diff --git a/src/app/profile/profile.module.ts b/src/app/profile/profile.module.ts
index 845a5303a..31fcc2e86 100644
--- a/src/app/profile/profile.module.ts
+++ b/src/app/profile/profile.module.ts
@@ -5,9 +5,17 @@ import { CommonModule } from '@angular/common';
 import { ProfileRoutingModule } from './profile-routing.module';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
 import { EditComponent } from './edit/edit.component';
+import { StructureMembersManagementComponent } from './structure-members-management/structure-members-management.component';
+import { StructureAddMemberModalComponent } from './structure-add-member-modal/structure-add-member-modal.component';
 
 @NgModule({
-  declarations: [ProfileComponent, StructureEditionSummaryComponent, EditComponent],
+  declarations: [
+    ProfileComponent,
+    StructureEditionSummaryComponent,
+    EditComponent,
+    StructureMembersManagementComponent,
+    StructureAddMemberModalComponent,
+  ],
   imports: [CommonModule, ProfileRoutingModule, SharedModule],
 })
 export class ProfileModule {}
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
new file mode 100644
index 000000000..b8aea48a5
--- /dev/null
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
@@ -0,0 +1,32 @@
+<div class="modalBackground">
+  <div class="modal">
+    <div class="modalHeader">
+      <h3>Ajouter un membre</h3>
+    </div>
+    <form [formGroup]="formAddAccount" class="modalContent">
+      <div class="form-group" fxLayout="column">
+        <label for="email">Email de la personne à ajouter</label>
+        <p *ngIf="ownerAlreadyLinked" class="special invalid">L'email est déjà rattaché à la structure.</p>
+        <div fxLayout="row" fxLayoutGap="13px">
+          <input type="text" formControlName="email" class="form-input" autocomplete="on" />
+          <app-svg-icon *ngIf="fAddAccount.email.valid" [type]="'form'" [icon]="'validate'"></app-svg-icon>
+          <app-svg-icon
+            *ngIf="fAddAccount.email.invalid && fAddAccount.email.value"
+            [type]="'form'"
+            [icon]="'notValidate'"
+          ></app-svg-icon>
+        </div>
+      </div>
+      <div class="buttons" fxLayout="row" fxLayoutAlign="space-between center">
+        <app-button [text]="'Annuler'" (action)="closeModal(false)"></app-button>
+        <app-button
+          [text]="'Valider'"
+          [disabled]="formAddAccount.invalid"
+          (action)="addOwner()"
+          [style]="buttonTypeEnum.Primary"
+        >
+        </app-button>
+      </div>
+    </form>
+  </div>
+</div>
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.scss b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.scss
new file mode 100644
index 000000000..febea28dc
--- /dev/null
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.scss
@@ -0,0 +1,44 @@
+@import '../../../assets/scss/color';
+@import '../../../assets/scss/typography';
+@import '../../../assets/scss/shapes';
+@import '../../../assets/scss/z-index';
+
+.modalBackground {
+  .modal {
+    max-width: 390px;
+    background-color: $white;
+    .modalHeader {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      border: 1px solid $grey-6;
+      padding: 0 8px;
+      h3 {
+        @include lato-bold-18;
+      }
+    }
+
+    .modalContent {
+      padding: 24px 40px;
+    }
+
+    p {
+      text-align: center;
+      margin: 10px 0;
+
+      &.special {
+        margin: 8px 0;
+        @include lato-regular-14;
+        color: $grey-3;
+        &.invalid {
+          color: $orange-warning;
+        }
+      }
+    }
+
+    .buttons {
+      gap: 24px;
+      padding-top: 8px;
+    }
+  }
+}
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.spec.ts b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.spec.ts
new file mode 100644
index 000000000..c66205e6d
--- /dev/null
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.spec.ts
@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StructureAddMemberModalComponent } from './structure-add-member-modal.component';
+
+describe('StructureMembersManagementComponent', () => {
+  let component: StructureAddMemberModalComponent;
+  let fixture: ComponentFixture<StructureAddMemberModalComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [StructureAddMemberModalComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(StructureAddMemberModalComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
new file mode 100644
index 000000000..d40897ffd
--- /dev/null
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
@@ -0,0 +1,54 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
+import { StructureWithOwners } from '../../models/structureWithOwners.model';
+import { TempUser } from '../../models/temp-user.model';
+import { StructureService } from '../../services/structure.service';
+import { CustomRegExp } from '../../utils/CustomRegExp';
+
+@Component({
+  selector: 'app-structure-add-member-modal',
+  templateUrl: './structure-add-member-modal.component.html',
+  styleUrls: ['./structure-add-member-modal.component.scss'],
+})
+export class StructureAddMemberModalComponent implements OnInit {
+  @Input() public structure: StructureWithOwners;
+  @Output() closed = new EventEmitter();
+  public buttonTypeEnum = ButtonType;
+  public formAddAccount: FormGroup;
+  public ownerAlreadyLinked = false;
+
+  constructor(private formBuilder: FormBuilder, private structureService: StructureService) {}
+
+  ngOnInit(): void {
+    this.formAddAccount = this.formBuilder.group({
+      email: ['', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]],
+    });
+  }
+
+  public closeModal(value: boolean): void {
+    this.closed.emit(value);
+  }
+
+  // getter for form fields
+  get fAddAccount(): { [key: string]: AbstractControl } {
+    return this.formAddAccount.controls;
+  }
+
+  public addOwner(): void {
+    // stop here if form is invalid
+    if (this.formAddAccount.invalid) {
+      return;
+    }
+    const user = new TempUser();
+    user.email = this.fAddAccount.email.value;
+    this.structureService.addOwnerToStructure(user, this.structure.structure._id).subscribe(
+      () => {
+        this.closed.emit(true);
+      },
+      (err) => {
+        this.ownerAlreadyLinked = true;
+      }
+    );
+  }
+}
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.html b/src/app/profile/structure-members-management/structure-members-management.component.html
new file mode 100644
index 000000000..cf4f42c52
--- /dev/null
+++ b/src/app/profile/structure-members-management/structure-members-management.component.html
@@ -0,0 +1,89 @@
+<div class="container" tabindex="1">
+  <div class="header">
+    <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+      <div fxLayout="row" fxLayoutAlign="start center">
+        <app-svg-icon [iconClass]="'backArrow'" [type]="'ico'" [icon]="'arrowBack'" (click)="goBack()"></app-svg-icon>
+        <h1>Gérer les membres<br />de {{ structure.structureName }}</h1>
+      </div>
+      <app-button
+        [style]="buttonTypeEnum.Secondary"
+        [text]="'Ajouter un membre'"
+        (click)="addMemberModalOpenned = true"
+        tabindex="0"
+      ></app-button>
+    </div>
+  </div>
+  <div *ngIf="structureWithOwners && tempUsers">
+    <div fxLayout="column" fxLayoutGap="8px" fxLayoutAlign="baseline baseline">
+      <div *ngFor="let member of structureWithOwners.owners" class="member-card">
+        <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+          <div fxLayout="row" fxLayoutAlign="start center">
+            <app-svg-icon
+              class="avatar"
+              [type]="'avatar'"
+              [icon]="'defaultAvatar'"
+              [iconClass]="'icon-40'"
+            ></app-svg-icon>
+            <div class="info-member">
+              <p class="member">{{ displayMemberName(member) }}</p>
+              <p class="job" *ngIf="displayJobEmployer(member)">{{ displayJobEmployer(member) }}</p>
+            </div>
+          </div>
+          <app-button
+            class="button-member"
+            [style]="buttonTypeEnum.Secondary"
+            [text]="'Exclure ce membre'"
+            (click)="memberToExclude = member; excludeModalOpenned = true"
+            tabindex="0"
+          ></app-button>
+        </div>
+      </div>
+      <div *ngFor="let member of tempUsers" class="member-card">
+        <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+          <div fxLayout="row" fxLayoutAlign="start center">
+            <app-svg-icon
+              class="avatar"
+              [type]="'avatar'"
+              [icon]="'defaultAvatar'"
+              [iconClass]="'icon-40'"
+            ></app-svg-icon>
+            <div class="info-member">
+              <p class="member">{{ member.email }}</p>
+            </div>
+          </div>
+          <div fxLayout="row" fxLayoutAlign="start center">
+            <div class="info-pendingStructure">
+              <p class="text">Demande de rattachement envoyée le {{ member.updatedAt | date: 'dd/MM/YYYY' }}</p>
+            </div>
+            <app-button
+              [style]="buttonTypeEnum.Secondary"
+              [text]="'Annuler la demande'"
+              (click)="tempUserToCancel = member; cancelAddTempUserModalOpenned = true"
+              tabindex="0"
+            ></app-button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<app-structure-add-member-modal
+  *ngIf="addMemberModalOpenned"
+  [openned]="addMemberModalOpenned"
+  [structure]="structureWithOwners"
+  (closed)="closeAddMemberModal($event)"
+></app-structure-add-member-modal>
+<app-modal-confirmation
+  *ngIf="excludeModalOpenned"
+  [openned]="excludeModalOpenned"
+  [content]="'Souhaitez-vous exclure ce membre\n(' + displayMemberName(memberToExclude) + ')&nbsp;?'"
+  [customConfirmationText]="'Oui'"
+  (closed)="excludeMember(memberToExclude, $event)"
+></app-modal-confirmation>
+<app-modal-confirmation
+  *ngIf="cancelAddTempUserModalOpenned"
+  [openned]="cancelAddTempUserModalOpenned"
+  [content]="'Souhaitez-vous annuler la demande de rattachement de ce membre\n(' + tempUserToCancel.email + ')&nbsp;?'"
+  [customConfirmationText]="'Oui'"
+  (closed)="cancelAddTempUser(tempUserToCancel, $event)"
+></app-modal-confirmation>
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
new file mode 100644
index 000000000..1848abe7a
--- /dev/null
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -0,0 +1,66 @@
+@import '../../../assets/scss/color';
+@import '../../../assets/scss/typography';
+
+.container {
+  margin: 1rem auto;
+  width: 100%;
+  max-width: 980px;
+  padding: 2rem;
+  background: $white;
+  border-radius: 8px;
+  border: 1px solid $grey-6;
+  .header {
+    margin-bottom: 2rem;
+  }
+  h1 {
+    @include lato-regular-24;
+    color: $grey-1;
+  }
+}
+
+.member-card {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .avatar {
+    background-color: $grey-8;
+    border-radius: 4px;
+  }
+  .info-member {
+    margin-left: 1rem;
+    p {
+      margin: 0;
+    }
+    .member {
+      @include lato-bold-14;
+    }
+    .job {
+      @include lato-regular-14;
+    }
+  }
+  .info-pendingStructure {
+    margin-right: 1rem;
+    max-width: 155px;
+    p {
+      margin: 0;
+    }
+    .text {
+      @include lato-regular-13;
+      color: $grey-3;
+    }
+  }
+}
+
+::ng-deep .btn-regular.secondary .text {
+  width: 184px !important;
+  height: 24px !important;
+}
+.button-member {
+  ::ng-deep .btn-regular.secondary .text {
+    color: $red !important;
+  }
+}
+::ng-deep .modalBackground p {
+  white-space: pre-wrap;
+}
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.spec.ts b/src/app/profile/structure-members-management/structure-members-management.component.spec.ts
new file mode 100644
index 000000000..d0178b47b
--- /dev/null
+++ b/src/app/profile/structure-members-management/structure-members-management.component.spec.ts
@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StructureMembersManagementComponent } from './structure-members-management.component';
+
+describe('StructureMembersManagementComponent', () => {
+  let component: StructureMembersManagementComponent;
+  let fixture: ComponentFixture<StructureMembersManagementComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [StructureMembersManagementComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(StructureMembersManagementComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.ts b/src/app/profile/structure-members-management/structure-members-management.component.ts
new file mode 100644
index 000000000..678bbd4c7
--- /dev/null
+++ b/src/app/profile/structure-members-management/structure-members-management.component.ts
@@ -0,0 +1,111 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { Structure } from '@gouvfr-anct/mediation-numerique';
+import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
+import { Owner } from '../../models/owner.model';
+import { StructureWithOwners } from '../../models/structureWithOwners.model';
+import { TempUser } from '../../models/temp-user.model';
+import { User } from '../../models/user.model';
+import { NotificationService } from '../../services/notification.service';
+import { StructureService } from '../../services/structure.service';
+import { Utils } from '../../utils/utils';
+import { ProfileService } from '../services/profile.service';
+
+@Component({
+  selector: 'app-structure-members-management',
+  templateUrl: './structure-members-management.component.html',
+  styleUrls: ['./structure-members-management.component.scss'],
+})
+export class StructureMembersManagementComponent implements OnInit {
+  public structure: Structure;
+  public structureWithOwners: StructureWithOwners;
+  public tempUsers: TempUser[];
+  public tempUserToCancel: TempUser;
+  public memberToExclude: Owner;
+  public addMemberModalOpenned = false;
+  public excludeModalOpenned = false;
+  public cancelAddTempUserModalOpenned = false;
+  public buttonTypeEnum = ButtonType;
+
+  constructor(
+    private route: ActivatedRoute,
+    private structureService: StructureService,
+    private profileService: ProfileService,
+    private notificationService: NotificationService
+  ) {}
+
+  ngOnInit(): void {
+    this.route.data.subscribe(async (data) => {
+      if (data.structure) {
+        this.structure = new Structure(data.structure);
+        let currentProfile = await this.profileService.getProfile();
+        this.structureService.getStructureWithOwners(data.structure._id, currentProfile).subscribe((s) => {
+          this.structureWithOwners = s;
+        });
+        this.structureService.getTempUsers(data.structure._id).subscribe((data) => {
+          this.tempUsers = data;
+        });
+      }
+    });
+  }
+  public goBack(): void {
+    history.back();
+  }
+  public displayJobEmployer(profile: User): string {
+    return new Utils().getJobEmployer(profile);
+  }
+  public displayMemberName(member: Owner): string {
+    return member.name + ' ' + member.surname.toUpperCase();
+  }
+
+  public excludeMember(member: Owner, shouldExclude: boolean): void {
+    this.excludeModalOpenned = false;
+    if (shouldExclude) {
+      this.structureService.removeOwnerFromStructure(member._id, this.structure._id).subscribe(
+        () => {
+          this.structureWithOwners.owners = this.structureWithOwners.owners.filter((obj) => obj._id !== member._id);
+          this.notificationService.showSuccess(
+            `${this.displayMemberName(member)} a bien été exclu de ${this.structure.structureName}`,
+            ''
+          );
+        },
+        () => {
+          this.notificationService.showError(
+            `${this.displayMemberName(member)} n'a pas pu être exclu de ${
+              this.structure.structureName
+            }. Merci de réessayer plus tard.`,
+            "Echec de l'exclusion"
+          );
+        }
+      );
+    }
+  }
+
+  public cancelAddTempUser(member: TempUser, shouldExclude: boolean): void {
+    this.cancelAddTempUserModalOpenned = false;
+    if (shouldExclude) {
+      this.structureService.removeTempUserFromStructure(member._id, this.structure._id).subscribe(
+        () => {
+          this.tempUsers = this.tempUsers.filter((obj) => obj._id !== member._id);
+          this.notificationService.showSuccess(
+            `La demande d'ajout de ${member.email} à ${this.structure.structureName} a bien été annulée`,
+            ''
+          );
+        },
+        () => {
+          this.notificationService.showError(
+            `La demande d'ajout de ${member.email} à ${this.structure.structureName} n'a pas pu être annulée. Merci de réessayer plus tard.`,
+            "Echec de l'annulation"
+          );
+        }
+      );
+    }
+  }
+
+  public closeAddMemberModal(memberAddRequested: boolean): void {
+    this.addMemberModalOpenned = false;
+    if (memberAddRequested) {
+      this.ngOnInit();
+    }
+  }
+}
diff --git a/src/app/resolvers/temp-user.resolver.ts b/src/app/resolvers/temp-user.resolver.ts
index 2ae604aa6..0f2b61a67 100644
--- a/src/app/resolvers/temp-user.resolver.ts
+++ b/src/app/resolvers/temp-user.resolver.ts
@@ -10,7 +10,7 @@ export class TempUserResolver implements Resolve<TempUser> {
   constructor(private tempUserService: TempUserService, private router: Router) {}
 
   resolve(route: ActivatedRouteSnapshot): Observable<TempUser> {
-    const userId = route.queryParams.id;
+    const userId = route.params.id;
     return this.tempUserService.getUser(userId).pipe(
       map((res) => res),
       catchError(() => {
diff --git a/src/app/services/structure.service.ts b/src/app/services/structure.service.ts
index 2d24291a6..2c75bfa0a 100644
--- a/src/app/services/structure.service.ts
+++ b/src/app/services/structure.service.ts
@@ -60,6 +60,9 @@ export class StructureService {
     return this.http.delete<Structure>(`${this.baseUrl}/${id}`);
   }
 
+  public removeTempUserFromStructure(idOwner: string, idStructure: string): Observable<any> {
+    return this.http.delete<any>(`${this.baseUrl}/${idStructure}/tempUser/${idOwner}`);
+  }
   public removeOwnerFromStructure(idOwner: string, idStructure: string): Observable<any> {
     return this.http.delete<any>(`${this.baseUrl}/${idStructure}/owner/${idOwner}`);
   }
@@ -171,6 +174,10 @@ export class StructureService {
     });
   }
 
+  public getTempUsers(structureId: string): Observable<TempUser[]> {
+    return this.http.get<TempUser[]>(`${this.baseUrl}/${structureId}/tempUsers`);
+  }
+
   public sendMailOnStructureError(structureId: string, content: string): Observable<any> {
     return this.http.post<any>(`${this.baseUrl}/reportStructureError`, {
       structureId,
diff --git a/src/app/shared/components/modal-options/modal-options.component.html b/src/app/shared/components/modal-options/modal-options.component.html
index 0e45ca7cc..b1f514924 100644
--- a/src/app/shared/components/modal-options/modal-options.component.html
+++ b/src/app/shared/components/modal-options/modal-options.component.html
@@ -14,6 +14,10 @@
     </div>
   </div>
   <div *ngIf="!isModalProfileOpts" class="modalContent" fxLayout="column" fxLayoutGap="10px">
+    <div (click)="closeModal(functionType.manageOwners)" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="9px">
+      <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'edit'"></app-svg-icon>
+      <p>Gérer les membres</p>
+    </div>
     <div (click)="closeModal(functionType.addUser)" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="9px">
       <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'add'"></app-svg-icon>
       <p>Ajouter un compte</p>
diff --git a/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts b/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts
index 0090b3115..72cda89e4 100644
--- a/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts
+++ b/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts
@@ -83,6 +83,9 @@ export class StructureOptionsModalComponent implements OnInit {
       case FunctionTypeModalOptions.deleteAccount:
         this.toggleDeleteAccountModal();
         break;
+      case FunctionTypeModalOptions.manageOwners:
+        this.router.navigateByUrl(`/profile/structure-members-management/${this.structure.structure._id}`);
+        break;
       case FunctionTypeModalOptions.addUser:
         this.editModal = TypeModalProfile.addAccount;
         this.ownerAlreadyLinked = false;
diff --git a/src/app/shared/enum/functionTypeModalOptions.enum.ts b/src/app/shared/enum/functionTypeModalOptions.enum.ts
index 2ec4677af..338457416 100644
--- a/src/app/shared/enum/functionTypeModalOptions.enum.ts
+++ b/src/app/shared/enum/functionTypeModalOptions.enum.ts
@@ -2,6 +2,7 @@ export enum FunctionTypeModalOptions {
   changeEmail = 1,
   changePassword,
   deleteAccount,
+  manageOwners,
   addUser,
   removeUser,
   editStructure,
diff --git a/src/app/structure/components/structure-details-wrapper/structure-details-wrapper.component.html b/src/app/structure/components/structure-details-wrapper/structure-details-wrapper.component.html
index 678979d07..48e2f5966 100644
--- a/src/app/structure/components/structure-details-wrapper/structure-details-wrapper.component.html
+++ b/src/app/structure/components/structure-details-wrapper/structure-details-wrapper.component.html
@@ -41,7 +41,7 @@
       <div *ngFor="let member of structureAdmins" class="member-card">
         <app-svg-icon class="avatar" [type]="'avatar'" [icon]="'defaultAvatar'" [iconClass]="'icon-40'"></app-svg-icon>
         <div class="info-member">
-          <p class="member">{{ member.name | uppercase }} {{ member.surname | titlecase }}</p>
+          <p class="member">{{ member.name }} {{ member.surname | uppercase }}</p>
           <p class="job" *ngIf="displayJobEmployer(member)">{{ displayJobEmployer(member) }}</p>
         </div>
       </div>
-- 
GitLab


From 2410ffd6c0ff5b5013f8c40d142d7643276afa61 Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Mon, 12 Sep 2022 11:36:35 +0200
Subject: [PATCH 10/23] fix footer

---
 ...tructure-members-management.component.html | 114 +++++++++---------
 ...tructure-members-management.component.scss |   1 -
 2 files changed, 58 insertions(+), 57 deletions(-)

diff --git a/src/app/profile/structure-members-management/structure-members-management.component.html b/src/app/profile/structure-members-management/structure-members-management.component.html
index cf4f42c52..57734e2e7 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.html
+++ b/src/app/profile/structure-members-management/structure-members-management.component.html
@@ -1,68 +1,70 @@
-<div class="container" tabindex="1">
-  <div class="header">
-    <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-      <div fxLayout="row" fxLayoutAlign="start center">
-        <app-svg-icon [iconClass]="'backArrow'" [type]="'ico'" [icon]="'arrowBack'" (click)="goBack()"></app-svg-icon>
-        <h1>Gérer les membres<br />de {{ structure.structureName }}</h1>
-      </div>
-      <app-button
-        [style]="buttonTypeEnum.Secondary"
-        [text]="'Ajouter un membre'"
-        (click)="addMemberModalOpenned = true"
-        tabindex="0"
-      ></app-button>
-    </div>
-  </div>
-  <div *ngIf="structureWithOwners && tempUsers">
-    <div fxLayout="column" fxLayoutGap="8px" fxLayoutAlign="baseline baseline">
-      <div *ngFor="let member of structureWithOwners.owners" class="member-card">
-        <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-          <div fxLayout="row" fxLayoutAlign="start center">
-            <app-svg-icon
-              class="avatar"
-              [type]="'avatar'"
-              [icon]="'defaultAvatar'"
-              [iconClass]="'icon-40'"
-            ></app-svg-icon>
-            <div class="info-member">
-              <p class="member">{{ displayMemberName(member) }}</p>
-              <p class="job" *ngIf="displayJobEmployer(member)">{{ displayJobEmployer(member) }}</p>
-            </div>
-          </div>
-          <app-button
-            class="button-member"
-            [style]="buttonTypeEnum.Secondary"
-            [text]="'Exclure ce membre'"
-            (click)="memberToExclude = member; excludeModalOpenned = true"
-            tabindex="0"
-          ></app-button>
+<div class="content-container full-screen">
+  <div class="container">
+    <div class="header">
+      <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+        <div fxLayout="row" fxLayoutAlign="start center">
+          <app-svg-icon [iconClass]="'backArrow'" [type]="'ico'" [icon]="'arrowBack'" (click)="goBack()"></app-svg-icon>
+          <h1>Gérer les membres<br />de {{ structure.structureName }}</h1>
         </div>
+        <app-button
+          [style]="buttonTypeEnum.Secondary"
+          [text]="'Ajouter un membre'"
+          (click)="addMemberModalOpenned = true"
+          tabindex="0"
+        ></app-button>
       </div>
-      <div *ngFor="let member of tempUsers" class="member-card">
-        <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-          <div fxLayout="row" fxLayoutAlign="start center">
-            <app-svg-icon
-              class="avatar"
-              [type]="'avatar'"
-              [icon]="'defaultAvatar'"
-              [iconClass]="'icon-40'"
-            ></app-svg-icon>
-            <div class="info-member">
-              <p class="member">{{ member.email }}</p>
-            </div>
-          </div>
-          <div fxLayout="row" fxLayoutAlign="start center">
-            <div class="info-pendingStructure">
-              <p class="text">Demande de rattachement envoyée le {{ member.updatedAt | date: 'dd/MM/YYYY' }}</p>
+    </div>
+    <div *ngIf="structureWithOwners && tempUsers">
+      <div fxLayout="column" fxLayoutGap="8px" fxLayoutAlign="baseline baseline">
+        <div *ngFor="let member of structureWithOwners.owners" class="member-card">
+          <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+            <div fxLayout="row" fxLayoutAlign="start center">
+              <app-svg-icon
+                class="avatar"
+                [type]="'avatar'"
+                [icon]="'defaultAvatar'"
+                [iconClass]="'icon-40'"
+              ></app-svg-icon>
+              <div class="info-member">
+                <p class="member">{{ displayMemberName(member) }}</p>
+                <p class="job" *ngIf="displayJobEmployer(member)">{{ displayJobEmployer(member) }}</p>
+              </div>
             </div>
             <app-button
+              class="button-member"
               [style]="buttonTypeEnum.Secondary"
-              [text]="'Annuler la demande'"
-              (click)="tempUserToCancel = member; cancelAddTempUserModalOpenned = true"
+              [text]="'Exclure ce membre'"
+              (click)="memberToExclude = member; excludeModalOpenned = true"
               tabindex="0"
             ></app-button>
           </div>
         </div>
+        <div *ngFor="let member of tempUsers" class="member-card">
+          <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
+            <div fxLayout="row" fxLayoutAlign="start center">
+              <app-svg-icon
+                class="avatar"
+                [type]="'avatar'"
+                [icon]="'defaultAvatar'"
+                [iconClass]="'icon-40'"
+              ></app-svg-icon>
+              <div class="info-member">
+                <p class="member">{{ member.email }}</p>
+              </div>
+            </div>
+            <div fxLayout="row" fxLayoutAlign="start center">
+              <div class="info-pendingStructure">
+                <p class="text">Demande de rattachement envoyée le {{ member.updatedAt | date: 'dd/MM/YYYY' }}</p>
+              </div>
+              <app-button
+                [style]="buttonTypeEnum.Secondary"
+                [text]="'Annuler la demande'"
+                (click)="tempUserToCancel = member; cancelAddTempUserModalOpenned = true"
+                tabindex="0"
+              ></app-button>
+            </div>
+          </div>
+        </div>
       </div>
     </div>
   </div>
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
index 1848abe7a..813a2f1b7 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.scss
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -3,7 +3,6 @@
 
 .container {
   margin: 1rem auto;
-  width: 100%;
   max-width: 980px;
   padding: 2rem;
   background: $white;
-- 
GitLab


From 0ef6fe308fbab02677ea2c628e44a6cf2f1911ba Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Mon, 12 Sep 2022 17:17:51 +0200
Subject: [PATCH 11/23] feat(onboarding): add user register case

---
 src/app/form/footer-form/footer-form.component.ts  | 8 ++++++++
 src/app/form/form-view/form-view-routing.module.ts | 1 -
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 8ecfd8a62..466e396b8 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -77,6 +77,14 @@ export class FooterFormComponent implements OnChanges {
       ) {
         this.isLastFormStep = true;
       }
+      if (!this.isEditMode && this.currentStep === structureFormStep.structureChoice) {
+        const user: User = await this.profileService.getProfile();
+        if (user.structuresLink.length) {
+          // if register a new user as a new member structure, no structure to choose
+          this.changeCurrentStep.emit(structureFormStep.noStructure);
+          return;
+        }
+      }
     }
   }
 
diff --git a/src/app/form/form-view/form-view-routing.module.ts b/src/app/form/form-view/form-view-routing.module.ts
index a68d9f118..39128d2ea 100644
--- a/src/app/form/form-view/form-view-routing.module.ts
+++ b/src/app/form/form-view/form-view-routing.module.ts
@@ -35,7 +35,6 @@ const routes: Routes = [
   {
     path: '',
     component: FormViewComponent,
-    canDeactivate: [DeactivateGuard],
     children: [
       {
         path: 'structure',
-- 
GitLab


From d3cb9e9042c342ed537b068c4d35548c72d4d94c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Tue, 13 Sep 2022 10:22:06 +0200
Subject: [PATCH 12/23] feat(form): can remove the second hour line

---
 src/app/form/form-view/form-view.component.ts | 16 ++---
 .../structure-form.component.ts               | 62 ++++++++-----------
 .../hour-picker/hour-picker.component.html    |  3 +
 .../hour-picker/hour-picker.component.scss    |  7 ++-
 .../hour-picker/hour-picker.component.ts      | 46 +++++++-------
 5 files changed, 61 insertions(+), 73 deletions(-)

diff --git a/src/app/form/form-view/form-view.component.ts b/src/app/form/form-view/form-view.component.ts
index 89a08f75f..13272be30 100644
--- a/src/app/form/form-view/form-view.component.ts
+++ b/src/app/form/form-view/form-view.component.ts
@@ -24,7 +24,7 @@ type stepType = accountFormStep | profileFormStep | structureFormStep | personal
 @Component({
   selector: 'app-form-view',
   templateUrl: './form-view.component.html',
-  styleUrls: ['./form-view.component.scss'],
+  styleUrls: ['./form-view.component.scss']
 })
 export class FormViewComponent implements OnInit {
   public routeParam: string;
@@ -181,9 +181,9 @@ export class FormViewComponent implements OnInit {
         phone: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.PHONE)]),
         password: new FormControl('', [
           Validators.required,
-          Validators.pattern(CustomRegExp.PASSWORD), //NOSONAR
+          Validators.pattern(CustomRegExp.PASSWORD) //NOSONAR
         ]),
-        confirmPassword: new FormControl(''),
+        confirmPassword: new FormControl('')
       },
       [MustMatch('password', 'confirmPassword')]
     );
@@ -193,14 +193,14 @@ export class FormViewComponent implements OnInit {
     this.profileForm = new FormGroup({
       employer: new FormGroup({
         name: new FormControl('', [Validators.required]),
-        validated: new FormControl(false, [Validators.required]),
+        validated: new FormControl(false, [Validators.required])
       }),
       job: new FormGroup({
         name: new FormControl('', [Validators.required]),
         validated: new FormControl(true, [Validators.required]),
-        hasPersonalOffer: new FormControl(true, [Validators.required]),
+        hasPersonalOffer: new FormControl(true, [Validators.required])
       }),
-      structure: new FormControl('', [Validators.required]),
+      structure: new FormControl('', [Validators.required])
     });
   }
 
@@ -216,7 +216,7 @@ export class FormViewComponent implements OnInit {
       accessRight: new FormControl(personalOffer.accessRight),
       digitalCultureSecurity: new FormControl(personalOffer.digitalCultureSecurity),
       socialAndProfessional: new FormControl(personalOffer.socialAndProfessional),
-      parentingHelp: new FormControl(personalOffer.parentingHelp),
+      parentingHelp: new FormControl(personalOffer.parentingHelp)
     });
   }
 
@@ -318,7 +318,7 @@ export class FormViewComponent implements OnInit {
         .pipe(
           map((res) => res),
           catchError((_e) => of())
-        ),
+        )
     }).subscribe(() => {
       this.router.navigateByUrl('form/structure');
     });
diff --git a/src/app/form/form-view/structure-form/structure-form.component.ts b/src/app/form/form-view/structure-form/structure-form.component.ts
index 2de6b71df..56c64d0fb 100644
--- a/src/app/form/form-view/structure-form/structure-form.component.ts
+++ b/src/app/form/form-view/structure-form/structure-form.component.ts
@@ -11,7 +11,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;
@@ -50,11 +50,7 @@ export class StructureFormComponent implements OnChanges, OnInit {
   public publicsAccompaniment: Category;
   public publics: 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) {
@@ -145,38 +141,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('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:
@@ -184,23 +180,23 @@ 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('publics').valid
       };
       this.pagesValidation[structureFormStep.structureDigitalHelpingAccompaniment] = {
-        valid: this.structureForm.get('proceduresAccompaniment').valid,
+        valid: this.structureForm.get('proceduresAccompaniment').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('equipmentsAndServices').valid
       };
       this.pagesValidation[structureFormStep.structureEquipments] = {
         valid:
@@ -209,23 +205,23 @@ export class StructureFormComponent implements OnChanges, OnInit {
           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('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();
     }
@@ -268,15 +264,7 @@ export class StructureFormComponent implements OnChanges, OnInit {
     });
   }
 
-  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: FormArray = this.structureForm.get(formControlName) as FormArray;
     if (event) {
       // Add a new control in the arrayForm
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.html b/src/app/shared/components/hour-picker/hour-picker.component.html
index e96f43944..b207bb6c6 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.html
+++ b/src/app/shared/components/hour-picker/hour-picker.component.html
@@ -57,6 +57,9 @@
             [style]="buttonTypeEnum.Secondary"
           ></app-button>
         </div>
+        <div class="remove" *ngIf="day.hours.length === 2">
+          <a (click)="this.removeHours(day, 1)">Supprimer</a>
+        </div>
       </div>
     </div>
   </div>
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.scss b/src/app/shared/components/hour-picker/hour-picker.component.scss
index b285bc182..3af1a75d8 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.scss
+++ b/src/app/shared/components/hour-picker/hour-picker.component.scss
@@ -37,9 +37,10 @@
     }
     .add {
       display: grid;
-      grid-template-columns: 96px 40px;
-      column-gap: 10px;
-      // grid-template-columns: 80px 100px;
+      align-items: center;
+    }
+    .remove {
+      display: grid;
       align-items: center;
     }
 
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.ts b/src/app/shared/components/hour-picker/hour-picker.component.ts
index b9b2fe40c..3b5d2a101 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.ts
+++ b/src/app/shared/components/hour-picker/hour-picker.component.ts
@@ -8,7 +8,7 @@ import { CheckHours } from '../../validator/form';
 @Component({
   selector: 'app-hour-picker',
   templateUrl: './hour-picker.component.html',
-  styleUrls: ['./hour-picker.component.scss'],
+  styleUrls: ['./hour-picker.component.scss']
 })
 export class HourPickerComponent implements OnChanges, OnDestroy {
   @Input() modifiedFields: any;
@@ -23,7 +23,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   private isInputSelected = false;
   public copiedDayName = '';
   public structure = {
-    hours: this.initHoursDefault(),
+    hours: this.initHoursDefault()
   };
   public structureHoursDefault: any[] = this.initHoursDefault();
 
@@ -45,44 +45,44 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
         name: 'Lundi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Mardi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Mercredi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Jeudi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Vendredi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Samedi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
+        active: false
       },
       {
         name: 'Dimanche',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false,
-      },
+        active: false
+      }
     ];
   }
 
@@ -100,20 +100,20 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
               return {
                 start: hour.opening,
                 end: hour.closing,
-                error: null,
+                error: null
               };
             } else {
               if (hour.opening) {
                 return {
                   start: hour.opening,
                   end: '',
-                  error: 'incomplete',
+                  error: 'incomplete'
                 };
               } else {
                 return {
                   start: '',
                   end: hour.closing,
-                  error: 'incomplete',
+                  error: 'incomplete'
                 };
               }
             }
@@ -125,21 +125,16 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
     this.structure.hours = this.structureHoursDefault;
   }
 
-  private parseToDay(data: {
-    name: string;
-    hours: { start: string; end: string }[];
-    open: boolean;
-    active: boolean;
-  }): Day {
+  private parseToDay(data: { name: string; hours: { start: string; end: string }[]; open: boolean; active: boolean }): Day {
     return new Day({
       open: data.open,
       time: data.hours.map(
         (hour) =>
           new Time({
             opening: hour.start,
-            closing: hour.end,
+            closing: hour.end
           })
-      ),
+      )
     });
   }
 
@@ -151,7 +146,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
       thursday: this.createDay(this.parseToDay(this.structure.hours[3])),
       friday: this.createDay(this.parseToDay(this.structure.hours[4])),
       saturday: this.createDay(this.parseToDay(this.structure.hours[5])),
-      sunday: this.createDay(this.parseToDay(this.structure.hours[6])),
+      sunday: this.createDay(this.parseToDay(this.structure.hours[6]))
     });
   }
 
@@ -214,7 +209,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
     day.hours.push({
       start: '',
       end: '',
-      error: 'incomplete',
+      error: 'incomplete'
     });
     this.submitForm();
   }
@@ -225,6 +220,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   public removeHours(day: any, index: number): void {
     if (index > -1) {
       day.hours.splice(index, 1);
+      this.submitForm();
     }
   }
 
@@ -302,14 +298,14 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   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,
+      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, Validators.required),
-      closing: new FormControl(time.closing, [Validators.required, CheckHours(time.opening)]),
+      closing: new FormControl(time.closing, [Validators.required, CheckHours(time.opening)])
     });
   }
 }
-- 
GitLab


From 12ec16307a5ba344351dd44deefa6b6b31416451 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Tue, 13 Sep 2022 10:24:05 +0200
Subject: [PATCH 13/23] Revert "feat(form): can remove the second hour line"

This reverts commit d3cb9e9042c342ed537b068c4d35548c72d4d94c.
---
 src/app/form/form-view/form-view.component.ts | 16 ++---
 .../structure-form.component.ts               | 62 +++++++++++--------
 .../hour-picker/hour-picker.component.html    |  3 -
 .../hour-picker/hour-picker.component.scss    |  7 +--
 .../hour-picker/hour-picker.component.ts      | 46 +++++++-------
 5 files changed, 73 insertions(+), 61 deletions(-)

diff --git a/src/app/form/form-view/form-view.component.ts b/src/app/form/form-view/form-view.component.ts
index 13272be30..89a08f75f 100644
--- a/src/app/form/form-view/form-view.component.ts
+++ b/src/app/form/form-view/form-view.component.ts
@@ -24,7 +24,7 @@ type stepType = accountFormStep | profileFormStep | structureFormStep | personal
 @Component({
   selector: 'app-form-view',
   templateUrl: './form-view.component.html',
-  styleUrls: ['./form-view.component.scss']
+  styleUrls: ['./form-view.component.scss'],
 })
 export class FormViewComponent implements OnInit {
   public routeParam: string;
@@ -181,9 +181,9 @@ export class FormViewComponent implements OnInit {
         phone: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.PHONE)]),
         password: new FormControl('', [
           Validators.required,
-          Validators.pattern(CustomRegExp.PASSWORD) //NOSONAR
+          Validators.pattern(CustomRegExp.PASSWORD), //NOSONAR
         ]),
-        confirmPassword: new FormControl('')
+        confirmPassword: new FormControl(''),
       },
       [MustMatch('password', 'confirmPassword')]
     );
@@ -193,14 +193,14 @@ export class FormViewComponent implements OnInit {
     this.profileForm = new FormGroup({
       employer: new FormGroup({
         name: new FormControl('', [Validators.required]),
-        validated: new FormControl(false, [Validators.required])
+        validated: new FormControl(false, [Validators.required]),
       }),
       job: new FormGroup({
         name: new FormControl('', [Validators.required]),
         validated: new FormControl(true, [Validators.required]),
-        hasPersonalOffer: new FormControl(true, [Validators.required])
+        hasPersonalOffer: new FormControl(true, [Validators.required]),
       }),
-      structure: new FormControl('', [Validators.required])
+      structure: new FormControl('', [Validators.required]),
     });
   }
 
@@ -216,7 +216,7 @@ export class FormViewComponent implements OnInit {
       accessRight: new FormControl(personalOffer.accessRight),
       digitalCultureSecurity: new FormControl(personalOffer.digitalCultureSecurity),
       socialAndProfessional: new FormControl(personalOffer.socialAndProfessional),
-      parentingHelp: new FormControl(personalOffer.parentingHelp)
+      parentingHelp: new FormControl(personalOffer.parentingHelp),
     });
   }
 
@@ -318,7 +318,7 @@ export class FormViewComponent implements OnInit {
         .pipe(
           map((res) => res),
           catchError((_e) => of())
-        )
+        ),
     }).subscribe(() => {
       this.router.navigateByUrl('form/structure');
     });
diff --git a/src/app/form/form-view/structure-form/structure-form.component.ts b/src/app/form/form-view/structure-form/structure-form.component.ts
index 56c64d0fb..2de6b71df 100644
--- a/src/app/form/form-view/structure-form/structure-form.component.ts
+++ b/src/app/form/form-view/structure-form/structure-form.component.ts
@@ -11,7 +11,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;
@@ -50,7 +50,11 @@ export class StructureFormComponent implements OnChanges, OnInit {
   public publicsAccompaniment: Category;
   public publics: 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) {
@@ -141,38 +145,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('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:
@@ -180,23 +184,23 @@ 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('publics').valid,
       };
       this.pagesValidation[structureFormStep.structureDigitalHelpingAccompaniment] = {
-        valid: this.structureForm.get('proceduresAccompaniment').valid
+        valid: this.structureForm.get('proceduresAccompaniment').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('equipmentsAndServices').valid,
       };
       this.pagesValidation[structureFormStep.structureEquipments] = {
         valid:
@@ -205,23 +209,23 @@ export class StructureFormComponent implements OnChanges, OnInit {
           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('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();
     }
@@ -264,7 +268,15 @@ export class StructureFormComponent implements OnChanges, OnInit {
     });
   }
 
-  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: FormArray = this.structureForm.get(formControlName) as FormArray;
     if (event) {
       // Add a new control in the arrayForm
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.html b/src/app/shared/components/hour-picker/hour-picker.component.html
index b207bb6c6..e96f43944 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.html
+++ b/src/app/shared/components/hour-picker/hour-picker.component.html
@@ -57,9 +57,6 @@
             [style]="buttonTypeEnum.Secondary"
           ></app-button>
         </div>
-        <div class="remove" *ngIf="day.hours.length === 2">
-          <a (click)="this.removeHours(day, 1)">Supprimer</a>
-        </div>
       </div>
     </div>
   </div>
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.scss b/src/app/shared/components/hour-picker/hour-picker.component.scss
index 3af1a75d8..b285bc182 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.scss
+++ b/src/app/shared/components/hour-picker/hour-picker.component.scss
@@ -37,10 +37,9 @@
     }
     .add {
       display: grid;
-      align-items: center;
-    }
-    .remove {
-      display: grid;
+      grid-template-columns: 96px 40px;
+      column-gap: 10px;
+      // grid-template-columns: 80px 100px;
       align-items: center;
     }
 
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.ts b/src/app/shared/components/hour-picker/hour-picker.component.ts
index 3b5d2a101..b9b2fe40c 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.ts
+++ b/src/app/shared/components/hour-picker/hour-picker.component.ts
@@ -8,7 +8,7 @@ import { CheckHours } from '../../validator/form';
 @Component({
   selector: 'app-hour-picker',
   templateUrl: './hour-picker.component.html',
-  styleUrls: ['./hour-picker.component.scss']
+  styleUrls: ['./hour-picker.component.scss'],
 })
 export class HourPickerComponent implements OnChanges, OnDestroy {
   @Input() modifiedFields: any;
@@ -23,7 +23,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   private isInputSelected = false;
   public copiedDayName = '';
   public structure = {
-    hours: this.initHoursDefault()
+    hours: this.initHoursDefault(),
   };
   public structureHoursDefault: any[] = this.initHoursDefault();
 
@@ -45,44 +45,44 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
         name: 'Lundi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Mardi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Mercredi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Jeudi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Vendredi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Samedi',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
+        active: false,
       },
       {
         name: 'Dimanche',
         hours: [{ start: '', end: '', error: 'incomplete' }],
         open: false,
-        active: false
-      }
+        active: false,
+      },
     ];
   }
 
@@ -100,20 +100,20 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
               return {
                 start: hour.opening,
                 end: hour.closing,
-                error: null
+                error: null,
               };
             } else {
               if (hour.opening) {
                 return {
                   start: hour.opening,
                   end: '',
-                  error: 'incomplete'
+                  error: 'incomplete',
                 };
               } else {
                 return {
                   start: '',
                   end: hour.closing,
-                  error: 'incomplete'
+                  error: 'incomplete',
                 };
               }
             }
@@ -125,16 +125,21 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
     this.structure.hours = this.structureHoursDefault;
   }
 
-  private parseToDay(data: { name: string; hours: { start: string; end: string }[]; open: boolean; active: boolean }): Day {
+  private parseToDay(data: {
+    name: string;
+    hours: { start: string; end: string }[];
+    open: boolean;
+    active: boolean;
+  }): Day {
     return new Day({
       open: data.open,
       time: data.hours.map(
         (hour) =>
           new Time({
             opening: hour.start,
-            closing: hour.end
+            closing: hour.end,
           })
-      )
+      ),
     });
   }
 
@@ -146,7 +151,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
       thursday: this.createDay(this.parseToDay(this.structure.hours[3])),
       friday: this.createDay(this.parseToDay(this.structure.hours[4])),
       saturday: this.createDay(this.parseToDay(this.structure.hours[5])),
-      sunday: this.createDay(this.parseToDay(this.structure.hours[6]))
+      sunday: this.createDay(this.parseToDay(this.structure.hours[6])),
     });
   }
 
@@ -209,7 +214,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
     day.hours.push({
       start: '',
       end: '',
-      error: 'incomplete'
+      error: 'incomplete',
     });
     this.submitForm();
   }
@@ -220,7 +225,6 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   public removeHours(day: any, index: number): void {
     if (index > -1) {
       day.hours.splice(index, 1);
-      this.submitForm();
     }
   }
 
@@ -298,14 +302,14 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
   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
+      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, Validators.required),
-      closing: new FormControl(time.closing, [Validators.required, CheckHours(time.opening)])
+      closing: new FormControl(time.closing, [Validators.required, CheckHours(time.opening)]),
     });
   }
 }
-- 
GitLab


From 9fcbe161be7b200ba1af534c5ad3d725756b70ba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Tue, 13 Sep 2022 15:20:35 +0200
Subject: [PATCH 14/23] fix: retours review

---
 .../profile-structure-member.component.html   |  6 +-
 .../profile-structure-member.component.scss   | 21 +++++-
 .../profile-structure.component.html          |  4 +-
 .../profile-structure.component.scss          | 15 ++++-
 .../profile-structure.component.ts            |  5 --
 src/app/profile/profile.component.html        | 64 ++++++++++---------
 src/assets/ico/sprite.svg                     | 19 ++----
 7 files changed, 76 insertions(+), 58 deletions(-)

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure-member/profile-structure-member.component.html
index d65cf38e7..af05c3784 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.html
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.html
@@ -8,11 +8,11 @@
     ></app-svg-icon>
     <div class="nameJobSection" fxLayout="column" fxLayoutAlign="start start">
       <a routerLink="/profile/{{ member._id }}" class="name">{{ member.name }} {{ member.surname }}</a>
-      <p>{{ getJobEmployer() }}</p>
+      <p class="jobEmployer">{{ getJobEmployer() }}</p>
     </div>
-    <div fxLayout="column" fxLayoutAlign="space-between start">
+    <div fxLayout="column" fxLayoutAlign="space-between start" fxLayoutGap="4px">
       <p>{{ member.phone }}</p>
-      <a href="mailto:{{ member.email }}">{{ member.email }}</a>
+      <a class="email" href="mailto:{{ member.email }}">{{ member.email }}</a>
     </div>
   </div>
 </div>
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.scss b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
index 87ddb7a18..1101796a1 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.scss
+++ b/src/app/profile/profile-structure-member/profile-structure-member.component.scss
@@ -4,15 +4,34 @@
 @import '../../../assets/scss/shapes';
 
 .structureMember {
+  @include lato-regular-14;
+
+  .avatar {
+    display: flex;
+    align-items: center;
+    background-color: $grey-8;
+    border-radius: 4px;
+  }
+
   p {
-    margin: 0 !important;
+    margin: 0;
+    &.jobEmployer {
+      display: flex;
+      height: 34px;
+      align-items: center;
+    }
   }
   a {
     &.name {
       @include lato-bold-14;
       color: $black;
     }
+    &.email {
+      text-decoration: underline;
+      color: $grey-1;
+    }
   }
+
   .nameJobSection {
     width: 50%;
   }
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 76c3cc53d..46c70909f 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -1,4 +1,4 @@
-<div class="structureCard" fxLayout="column" fxLayoutAlign="center">
+<div class="structureCard" fxLayout="column" fxLayoutAlign="center" [ngClass]="{ fold: !showDetails }">
   <div class="collapseHeader" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px" (click)="toggleDetails()">
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
@@ -80,7 +80,7 @@
             <p>{{ structure.structure.contactPhone }}</p>
           </div>
           <div>
-            <a class="mail" href="mailto:{{ structure.structure.contactMail }}">{{ structure.structure.contactMail }}</a>
+            <a class="email" href="mailto:{{ structure.structure.contactMail }}">{{ structure.structure.contactMail }}</a>
           </div>
         </div>
       </div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 4814a32c4..9cc59e47e 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -9,6 +9,11 @@
   border-radius: 4px;
   overflow: hidden;
 
+  &.fold {
+    background-color: $grey-8;
+    border: 1px solid $grey-8;
+  }
+
   .collapseHeader {
     cursor: pointer;
     p {
@@ -33,6 +38,11 @@
     padding: 0 10px;
     .infoSection {
       @include lato-regular-14;
+
+      .email {
+        text-decoration: underline;
+        color: $grey-1;
+      }
     }
     .section-title {
       @include lato-bold-14;
@@ -58,6 +68,9 @@
     }
   }
   .call-to-action {
-    margin-top: 40px;
+    margin-top: 18px;
   }
 }
+::ng-deep app-button.warning button .text {
+  border: 1px solid $orange-warning !important;
+}
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index f11bda117..066c637d5 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -54,11 +54,6 @@ export class ProfileStructureComponent implements OnInit {
     this.router.navigate(['/form/structure', this.structure.structure._id, structureFormStep[step]]);
   }
   public isValid(): boolean {
-    Object.keys(this.structureForm.controls).forEach((key) => {
-      if (this.structureForm.get(key).valid === false) {
-        console.log(`${this.structure.structure.structureName} ${key} ${this.structureForm.get(key).valid}`);
-      }
-    });
     return this.structureForm.valid;
   }
   public getStructureTypeLabel(): string {
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index e3c1064b9..7f8b6527c 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -67,37 +67,39 @@
   </section>
 
   <section>
-    <div fxLayout="row" fxLayoutAlign="start center" fxFill>
-      <h1>Structures</h1>
-      <app-button
-        *ngIf="!isPublic"
-        class="hide-on-mobile"
-        [type]="'button'"
-        [iconBtn]="'edit'"
-        [text]="'Gérer mes structures'"
-        [style]="buttonTypeEnum.SecondaryWide"
-        routerLink="./"
-        [routerLinkActive]="'active'"
-      ></app-button>
-      <app-button
-        class="hide-on-desktop"
-        [type]="'button'"
-        [iconBtn]="'edit'"
-        [style]="buttonTypeEnum.SecondaryOnlyIcon"
-        routerLink="/profile/edit"
-        [routerLinkActive]="'active'"
-      ></app-button>
-    </div>
-    <div style="width: 100%" fxLayoutGap="16px" fxLayout="column">
-      <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
-        <div *ngFor="let structure of structures; let i = index">
-          <app-profile-structure
-            [structure]="structure"
-            [userProfile]="this.userProfile"
-            [isPublic]="this.isPublic"
-          ></app-profile-structure>
-        </div>
-      </ng-container>
+    <div fxLayoutGap="12px" fxLayout="column" fxFill>
+      <div fxLayout="row" fxLayoutAlign="start center" fxFill>
+        <h1>Structures</h1>
+        <app-button
+          *ngIf="!isPublic"
+          class="hide-on-mobile"
+          [type]="'button'"
+          [iconBtn]="'edit'"
+          [text]="'Gérer mes structures'"
+          [style]="buttonTypeEnum.SecondaryWide"
+          routerLink="./"
+          [routerLinkActive]="'active'"
+        ></app-button>
+        <app-button
+          class="hide-on-desktop"
+          [type]="'button'"
+          [iconBtn]="'edit'"
+          [style]="buttonTypeEnum.SecondaryOnlyIcon"
+          routerLink="/profile/edit"
+          [routerLinkActive]="'active'"
+        ></app-button>
+      </div>
+      <div fxLayoutGap="16px" fxLayout="column" fxFill>
+        <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
+          <div *ngFor="let structure of structures; let i = index">
+            <app-profile-structure
+              [structure]="structure"
+              [userProfile]="this.userProfile"
+              [isPublic]="this.isPublic"
+            ></app-profile-structure>
+          </div>
+        </ng-container>
+      </div>
     </div>
   </section>
 
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index ad5dfafdf..39f9b0157 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -98,8 +98,10 @@
 </defs>
 </symbol>
 
-<symbol id="edit" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M17.3745 2.62547C17.72 2.28003 18.3461 2.34613 18.7731 2.7731L20.3193 4.3193C20.7463 4.74627 20.8124 5.37243 20.4669 5.71787L18.6115 7.57331L15.5191 4.48091L17.3745 2.62547ZM17.993 8.1918L14.9006 5.0994L5.62344 14.3766L8.71584 17.469L17.993 8.1918ZM8.09736 18.0874L5.00496 14.995L4.74469 15.2553C4.60266 15.3973 4.52461 15.5949 4.52337 15.8155L3.77535 18.7134C3.7736 19.0246 4.0678 19.3188 4.37904 19.3171L7.27695 18.569C7.49751 18.5678 7.69506 18.4897 7.83709 18.3477L8.09736 18.0874Z" stroke="none"/>
+<symbol id="edit" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M4.28317 15.287L3.65575 18.6944C3.65575 18.9504 3.85693 19.1516 4.11297 19.1516L7.52029 18.5242C7.63917 18.5242 7.75804 18.4784 7.84034 18.387L17.4626 8.77388L14.0335 5.34473L4.42034 14.9578C4.32889 15.0493 4.28317 15.159 4.28317 15.287Z" stroke="#333333" stroke-width="1.5" />
+  <path d="M19.1358 7.09997C19.4924 6.74334 19.4924 6.16724 19.1358 5.81061L16.996 3.67082C16.8252 3.49959 16.5932 3.40336 16.3513 3.40336C16.1094 3.40336 15.8775 3.49959 15.7067 3.67082L14.0332 5.34424L17.4624 8.7734L19.1358 7.09997Z" stroke="#333333" stroke-width="1.5" />
+  <path d="M4.78906 14.6543L8.15154 18.0168" stroke="#333333" stroke-width="1.5" />
 </symbol>
 
 <symbol id="liste" viewBox="0 0 32 32"  xmlns="http://www.w3.org/2000/svg">
@@ -498,19 +500,6 @@
   <path d="M15.875 15.625C18.1877 15.625 20.0625 13.7502 20.0625 11.4375C20.0625 9.1248 18.1877 7.25 15.875 7.25C13.5623 7.25 11.6875 9.1248 11.6875 11.4375C11.6875 13.7502 13.5623 15.625 15.875 15.625Z" stroke="#333333" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </symbol>
 
-<symbol id="edit" viewBox="0 0 23 23" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g clip-path="url(#clip0_7929_46214)">
-  <path d="M4.28317 15.287L3.65575 18.6944C3.65575 18.9504 3.85693 19.1516 4.11297 19.1516L7.52029 18.5242C7.63917 18.5242 7.75804 18.4784 7.84034 18.387L17.4626 8.77388L14.0335 5.34473L4.42034 14.9578C4.32889 15.0493 4.28317 15.159 4.28317 15.287Z" stroke="#333333" stroke-width="1.5"/>
-  <path d="M19.1358 7.09997C19.4924 6.74334 19.4924 6.16724 19.1358 5.81061L16.996 3.67082C16.8252 3.49959 16.5932 3.40336 16.3513 3.40336C16.1094 3.40336 15.8775 3.49959 15.7067 3.67082L14.0332 5.34424L17.4624 8.7734L19.1358 7.09997Z" stroke="#333333" stroke-width="1.5"/>
-  <path d="M4.78906 14.6543L8.15154 18.0168" stroke="#333333" stroke-width="1.5"/>
-  </g>
-  <defs>
-  <clipPath id="clip0_7929_46214">
-  <rect width="22" height="22" fill="white" transform="translate(0.5 0.5)"/>
-  </clipPath>
-  </defs>
-</symbol>
-
 <symbol id="toastError" width="40" height="41" viewBox="0 0 40 41" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M26.8169 11.4821C27.3593 10.9397 28.2738 10.9749 28.8596 11.5607C29.4454 12.1464 29.4806 13.061 28.9382 13.6034L13.2247 29.3169C12.6823 29.8593 11.7677 29.8241 11.1819 29.2383C10.5962 28.6525 10.561 27.738 11.1034 27.1956L26.8169 11.4821Z" fill="#FF0000"/>
 <path d="M28.8169 27.5179C29.3593 28.0603 29.3241 28.9749 28.7383 29.5607C28.1525 30.1464 27.2379 30.1816 26.6955 29.6392L10.9821 13.9257C10.4397 13.3833 10.4748 12.4688 11.0606 11.883C11.6464 11.2972 12.561 11.262 13.1034 11.8044L28.8169 27.5179Z" fill="#FF0000"/>
-- 
GitLab


From 9ac1bd9c985f7eccfdcf3a05e907fd3b0a69b077 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Wed, 14 Sep 2022 11:28:57 +0200
Subject: [PATCH 15/23] style: CSS capitalization

---
 .../profile-structure/profile-structure.component.html        | 4 ++--
 .../profile-structure/profile-structure.component.scss        | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 46c70909f..1d2beb94f 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -24,7 +24,7 @@
     <div class="collapseContent" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
       <div fxLayout="column">
         <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
-          <p class="section-title">INFORMATIONS</p>
+          <p class="section-title">informations</p>
           <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="12px">
             <app-button
               *ngIf="!isPublic"
@@ -86,7 +86,7 @@
       </div>
       <div *ngIf="members.length > 0" fxLayout="column" fxLayoutGap="9px">
         <div fxLayout="row" fxLayoutAlign="space-between center">
-          <p class="section-title">MEMBRES</p>
+          <p class="section-title">membres</p>
           <app-button
             *ngIf="!isPublic"
             class="hide-on-mobile"
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 9cc59e47e..6165b9269 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -45,6 +45,7 @@
       }
     }
     .section-title {
+      text-transform: capitalize;
       @include lato-bold-14;
       color: $grey-3;
     }
-- 
GitLab


From 47708f20391ea066a428092845d425ce146a7985 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Wed, 14 Sep 2022 11:38:46 +0200
Subject: [PATCH 16/23] fix: rename structure into structureWithOwners

---
 .../profile-structure.component.html             | 16 +++++++++-------
 .../profile-structure.component.ts               | 12 ++++++------
 src/app/profile/profile.component.html           |  2 +-
 3 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 1d2beb94f..cacc35751 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -3,7 +3,7 @@
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
       <div fxLayout="column" fxLayoutAlign="space-between start">
-        <p class="structureName">{{ structure.structure.structureName }}</p>
+        <p class="structureName">{{ structureWithOwners.structure.structureName }}</p>
         <p class="structureType">{{ getStructureTypeLabel() }}</p>
       </div>
     </div>
@@ -35,7 +35,7 @@
               [text]="'Voir la structure'"
               [style]="buttonTypeEnum.SecondaryWide"
               routerLink="./"
-              [queryParams]="{ id: structure.structure._id }"
+              [queryParams]="{ id: structureWithOwners.structure._id }"
               [routerLinkActive]="'active'"
             ></app-button>
             <app-button
@@ -46,7 +46,7 @@
               [iconType]="'form'"
               [style]="buttonTypeEnum.SecondaryOnlyIcon"
               routerLink="./"
-              [queryParams]="{ id: structure.structure._id }"
+              [queryParams]="{ id: structureWithOwners.structure._id }"
               [routerLinkActive]="'active'"
             ></app-button>
             <app-button
@@ -56,7 +56,7 @@
               [iconBtn]="'edit'"
               [text]="'Modifier la structure'"
               [style]="buttonTypeEnum.SecondaryWide"
-              routerLink="./edit-structure/{{ structure.structure._id }}"
+              routerLink="./edit-structure/{{ structureWithOwners.structure._id }}"
               [routerLinkActive]="'active'"
               [ngClass]="{ warning: !isValid() }"
             ></app-button>
@@ -66,7 +66,7 @@
               [type]="'button'"
               [iconBtn]="'edit'"
               [style]="buttonTypeEnum.SecondaryOnlyIcon"
-              routerLink="./edit-structure/{{ structure.structure._id }}"
+              routerLink="./edit-structure/{{ structureWithOwners.structure._id }}"
               [routerLinkActive]="'active'"
               [ngClass]="{ warning: !isValid() }"
             ></app-button>
@@ -77,10 +77,12 @@
             <p>{{ getAddress() }}</p>
           </div>
           <div>
-            <p>{{ structure.structure.contactPhone }}</p>
+            <p>{{ structureWithOwners.structure.contactPhone }}</p>
           </div>
           <div>
-            <a class="email" href="mailto:{{ structure.structure.contactMail }}">{{ structure.structure.contactMail }}</a>
+            <a class="email" href="mailto:{{ structureWithOwners.structure.contactMail }}">
+              {{ structureWithOwners.structure.contactMail }}
+            </a>
           </div>
         </div>
       </div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 066c637d5..e32c3e41e 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -24,7 +24,7 @@ import { UserService } from './../../services/user.service';
   ]
 })
 export class ProfileStructureComponent implements OnInit {
-  @Input() public structure: StructureWithOwners;
+  @Input() public structureWithOwners: StructureWithOwners;
   @Input() public userProfile: User;
   @Input() public isPublic: boolean;
   public members: User[] = [];
@@ -35,8 +35,8 @@ export class ProfileStructureComponent implements OnInit {
   constructor(private router: Router, private userService: UserService) {}
 
   ngOnInit(): void {
-    this.structureForm = new formUtils().createStructureForm(this.structure.structure, true);
-    this.structure.owners
+    this.structureForm = new formUtils().createStructureForm(this.structureWithOwners.structure, true);
+    this.structureWithOwners.owners
       .filter((owner) => {
         return owner._id !== this.userProfile._id;
       })
@@ -51,20 +51,20 @@ export class ProfileStructureComponent implements OnInit {
     history.back();
   }
   public goToEdit(step: structureFormStep): void {
-    this.router.navigate(['/form/structure', this.structure.structure._id, structureFormStep[step]]);
+    this.router.navigate(['/form/structure', this.structureWithOwners.structure._id, structureFormStep[step]]);
   }
   public isValid(): boolean {
     return this.structureForm.valid;
   }
   public getStructureTypeLabel(): string {
-    return new Structure(this.structure.structure).getLabelTypeStructure();
+    return new Structure(this.structureWithOwners.structure).getLabelTypeStructure();
   }
   public toggleDetails(): void {
     this.showDetails = !this.showDetails;
   }
 
   public getAddress(): string {
-    const address = this.structure.structure.address;
+    const address = this.structureWithOwners.structure.address;
     return address.numero + ' ' + address.street + ' - ' + address.commune;
   }
 }
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 7f8b6527c..78dba8fc4 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -93,7 +93,7 @@
         <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
           <div *ngFor="let structure of structures; let i = index">
             <app-profile-structure
-              [structure]="structure"
+              [structureWithOwners]="structure"
               [userProfile]="this.userProfile"
               [isPublic]="this.isPublic"
             ></app-profile-structure>
-- 
GitLab


From 0e13af85dfde5000fb7647b0e6eddfdcf449824d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Wed, 14 Sep 2022 11:42:27 +0200
Subject: [PATCH 17/23] fix: moved profile-structure-member component

---
 .../profile-structure-member.component.html               | 0
 .../profile-structure-member.component.scss               | 8 ++++----
 .../profile-structure-member.component.ts                 | 2 +-
 src/app/profile/profile.module.ts                         | 6 +++---
 4 files changed, 8 insertions(+), 8 deletions(-)
 rename src/app/profile/{ => profile-structure}/profile-structure-member/profile-structure-member.component.html (100%)
 rename src/app/profile/{ => profile-structure}/profile-structure-member/profile-structure-member.component.scss (73%)
 rename src/app/profile/{ => profile-structure}/profile-structure-member/profile-structure-member.component.ts (93%)

diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.html b/src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.html
similarity index 100%
rename from src/app/profile/profile-structure-member/profile-structure-member.component.html
rename to src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.html
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.scss b/src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.scss
similarity index 73%
rename from src/app/profile/profile-structure-member/profile-structure-member.component.scss
rename to src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.scss
index 1101796a1..f559d1d63 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.scss
+++ b/src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.scss
@@ -1,7 +1,7 @@
-@import '../../../assets/scss/color';
-@import '../../../assets/scss/typography';
-@import '../../../assets/scss/breakpoint';
-@import '../../../assets/scss/shapes';
+@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/typography';
+@import '../../../../assets/scss/breakpoint';
+@import '../../../../assets/scss/shapes';
 
 .structureMember {
   @include lato-regular-14;
diff --git a/src/app/profile/profile-structure-member/profile-structure-member.component.ts b/src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.ts
similarity index 93%
rename from src/app/profile/profile-structure-member/profile-structure-member.component.ts
rename to src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.ts
index b159313bd..7e49f99ef 100644
--- a/src/app/profile/profile-structure-member/profile-structure-member.component.ts
+++ b/src/app/profile/profile-structure/profile-structure-member/profile-structure-member.component.ts
@@ -1,5 +1,5 @@
 import { Component, Input } from '@angular/core';
-import { User } from './../../models/user.model';
+import { User } from '../../../models/user.model';
 
 @Component({
   selector: 'app-profile-structure-member',
diff --git a/src/app/profile/profile.module.ts b/src/app/profile/profile.module.ts
index 7fad3846d..c68bad865 100644
--- a/src/app/profile/profile.module.ts
+++ b/src/app/profile/profile.module.ts
@@ -3,7 +3,7 @@ import { NgModule } from '@angular/core';
 import { SharedModule } from '../shared/shared.module';
 import { EditComponent } from './edit/edit.component';
 import { ProfileRoutingModule } from './profile-routing.module';
-import { ProfileStructureMemberComponent } from './profile-structure-member/profile-structure-member.component';
+import { ProfileStructureMemberComponent } from './profile-structure/profile-structure-member/profile-structure-member.component';
 import { ProfileStructureComponent } from './profile-structure/profile-structure.component';
 import { ProfileComponent } from './profile.component';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
@@ -14,8 +14,8 @@ import { StructureEditionSummaryComponent } from './structure-edition-summary/st
     StructureEditionSummaryComponent,
     EditComponent,
     ProfileStructureComponent,
-    ProfileStructureMemberComponent,
+    ProfileStructureMemberComponent
   ],
-  imports: [CommonModule, ProfileRoutingModule, SharedModule],
+  imports: [CommonModule, ProfileRoutingModule, SharedModule]
 })
 export class ProfileModule {}
-- 
GitLab


From 663bcf373a8febd325fa91147e803f43e4c91fde Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Wed, 14 Sep 2022 17:04:34 +0200
Subject: [PATCH 18/23] feat(onboarding): fix register new user case

---
 .../form/footer-form/footer-form.component.ts |  8 ------
 src/app/form/form-view/form-view.component.ts | 28 ++++++++++++++++---
 .../form-view/guards/personalOffer.guard.ts   |  6 +++-
 .../personal-offer-form.component.ts          |  4 +--
 4 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 466e396b8..8ecfd8a62 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -77,14 +77,6 @@ export class FooterFormComponent implements OnChanges {
       ) {
         this.isLastFormStep = true;
       }
-      if (!this.isEditMode && this.currentStep === structureFormStep.structureChoice) {
-        const user: User = await this.profileService.getProfile();
-        if (user.structuresLink.length) {
-          // if register a new user as a new member structure, no structure to choose
-          this.changeCurrentStep.emit(structureFormStep.noStructure);
-          return;
-        }
-      }
     }
   }
 
diff --git a/src/app/form/form-view/form-view.component.ts b/src/app/form/form-view/form-view.component.ts
index 0fa69a9fe..d9e38aeaf 100644
--- a/src/app/form/form-view/form-view.component.ts
+++ b/src/app/form/form-view/form-view.component.ts
@@ -73,6 +73,7 @@ export class FormViewComponent implements OnInit {
   public structureWithOwners: StructureWithOwners;
   public isPageValid: boolean = false;
   public hoursForm: FormGroup;
+  public isRegisterNewMember: boolean = false;
 
   constructor(
     private router: Router,
@@ -89,6 +90,16 @@ export class FormViewComponent implements OnInit {
     this.initPage();
     this.profileService.getProfile().then((user: User) => {
       this.profile = user;
+
+      if (!this.isEditMode && this.profile) {
+        if (this.profile.structuresLink.length) {
+          // if register a new user as a new member structure, no structure to choose
+          this.isRegisterNewMember = true;
+          this.structureService.getStructure(this.profile.structuresLink[0]).subscribe((structure) => {
+            this.structure = new Structure(structure);
+          });
+        }
+      }
     });
     // Check if it's a new structure or edit structure
     this.route.data.subscribe((data) => {
@@ -317,11 +328,20 @@ export class FormViewComponent implements OnInit {
       profile: this.profileService
         .updateProfile(this.profileForm.get('employer').value.name, this.profileForm.get('job').value.name)
         .pipe(
-          map((res) => res),
+          map((res) => (this.profile = res)),
           catchError((e) => of())
         ),
-    }).subscribe(() => {
-      this.router.navigateByUrl('form/structure');
+    }).subscribe(async () => {
+      // if register a new user as a new member structure, no structure to choose
+      if (this.isRegisterNewMember) {
+        if (this.profile.job && this.profile.job.hasPersonalOffer) {
+          this.router.navigateByUrl('form/personaloffer');
+        } else {
+          this.router.navigateByUrl('/profile');
+        }
+      } else {
+        this.router.navigateByUrl('form/structure');
+      }
     });
   }
 
@@ -337,7 +357,7 @@ export class FormViewComponent implements OnInit {
   public async saveStructureForm(): Promise<void> {
     const user = await this.profileService.getProfile();
     this.structureService.createStructure(this.structureForm.value, this.profile).subscribe((struct) => {
-      if (user.job.hasPersonalOffer) {
+      if (user.job && user.job.hasPersonalOffer) {
         this.structure = struct;
         this.router.navigateByUrl('form/personaloffer');
       } else {
diff --git a/src/app/form/form-view/guards/personalOffer.guard.ts b/src/app/form/form-view/guards/personalOffer.guard.ts
index 32b7d71c2..d7fc5a8bf 100644
--- a/src/app/form/form-view/guards/personalOffer.guard.ts
+++ b/src/app/form/form-view/guards/personalOffer.guard.ts
@@ -8,7 +8,11 @@ export class PersonalOfferGuard implements CanActivate {
   constructor(private router: Router) {}
 
   canActivate(route: ActivatedRouteSnapshot): UrlTree | boolean {
-    if (route.routeConfig.path === 'personaloffer' && this.router.routerState.snapshot.url === '/form/structure') {
+    if (
+      route.routeConfig.path === 'personaloffer' &&
+      (this.router.routerState.snapshot.url === '/form/profile' ||
+        this.router.routerState.snapshot.url === '/form/structure')
+    ) {
       return true;
     }
     return this.router.parseUrl('/home');
diff --git a/src/app/form/form-view/personal-offer-form/personal-offer-form.component.ts b/src/app/form/form-view/personal-offer-form/personal-offer-form.component.ts
index 90a861d08..dcb9953c2 100644
--- a/src/app/form/form-view/personal-offer-form/personal-offer-form.component.ts
+++ b/src/app/form/form-view/personal-offer-form/personal-offer-form.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output, SimpleChanges } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { Router } from '@angular/router';
 import { formType } from '../formType.enum';
@@ -8,7 +8,7 @@ import { personalOfferFormStep } from './personalOfferFormStep.enum';
   selector: 'app-personal-offer-form',
   templateUrl: './personal-offer-form.component.html',
 })
-export class PersonalOfferFormComponent {
+export class PersonalOfferFormComponent implements OnChanges {
   @Input() nbSteps: number;
   @Input() currentStep: personalOfferFormStep;
   @Input() personalOfferForm: FormGroup;
-- 
GitLab


From 424567e8564dbe20f7151a3d890702bfc428fc3d Mon Sep 17 00:00:00 2001
From: Marlene Simondant <msimondant@grandlyon.com>
Date: Thu, 15 Sep 2022 12:03:39 +0200
Subject: [PATCH 19/23] responsive style

---
 .../structure-members-management.component.html    |  9 +++++----
 .../structure-members-management.component.scss    | 14 +++++++++++++-
 src/assets/ico/sprite.svg                          |  3 +++
 3 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/src/app/profile/structure-members-management/structure-members-management.component.html b/src/app/profile/structure-members-management/structure-members-management.component.html
index 57734e2e7..53658c5eb 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.html
+++ b/src/app/profile/structure-members-management/structure-members-management.component.html
@@ -18,7 +18,7 @@
       <div fxLayout="column" fxLayoutGap="8px" fxLayoutAlign="baseline baseline">
         <div *ngFor="let member of structureWithOwners.owners" class="member-card">
           <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-            <div fxLayout="row" fxLayoutAlign="start center">
+            <div fxLayout="row" fxLayoutAlign="start center" class="user">
               <app-svg-icon
                 class="avatar"
                 [type]="'avatar'"
@@ -40,8 +40,8 @@
           </div>
         </div>
         <div *ngFor="let member of tempUsers" class="member-card">
-          <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-            <div fxLayout="row" fxLayoutAlign="start center">
+          <div fxLayout="row" fxLayoutAlign="space-between center" fxFill class="card-container">
+            <div fxLayout="row" fxLayoutAlign="start center" class="user">
               <app-svg-icon
                 class="avatar"
                 [type]="'avatar'"
@@ -52,8 +52,9 @@
                 <p class="member">{{ member.email }}</p>
               </div>
             </div>
-            <div fxLayout="row" fxLayoutAlign="start center">
+            <div fxLayout="row" fxLayoutAlign="start center" class="pendingContainer">
               <div class="info-pendingStructure">
+                <app-svg-icon class="check-icon" [type]="'ico'" [icon]="'check'"></app-svg-icon>
                 <p class="text">Demande de rattachement envoyée le {{ member.updatedAt | date: 'dd/MM/YYYY' }}</p>
               </div>
               <app-button
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
index 813a2f1b7..b936386ea 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.scss
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -1,5 +1,6 @@
 @import '../../../assets/scss/color';
 @import '../../../assets/scss/typography';
+@import '../../../assets/scss/breakpoint';
 
 .container {
   margin: 1rem auto;
@@ -22,6 +23,9 @@
   display: flex;
   justify-content: center;
   align-items: center;
+  .user {
+    margin-right: 15px;
+  }
   .avatar {
     background-color: $grey-8;
     border-radius: 4px;
@@ -39,14 +43,22 @@
     }
   }
   .info-pendingStructure {
+    display: flex;
     margin-right: 1rem;
-    max-width: 155px;
+    max-width: 200px;
     p {
       margin: 0;
     }
     .text {
       @include lato-regular-13;
       color: $grey-3;
+      margin-left: 3px;
+    }
+  }
+  .card-container {
+    @media #{$large-phone} {
+      flex-direction: column !important;
+      align-items: flex-start !important;
     }
   }
 }
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index a6b6fe08d..3e8d6d892 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -520,5 +520,8 @@
 <path d="M10 21.1364L17.3889 27.5L23.1944 20.5L29 13.5" stroke="#47C562" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
 </symbol>
 
+<symbol id="check" width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.9977 6.2526C19.4105 6.61952 19.4477 7.25159 19.0808 7.66437L10.9326 16.831C10.5785 17.2294 9.97428 17.28 9.55883 16.9462L4.37364 12.7795C3.94313 12.4336 3.87458 11.8041 4.22053 11.3736C4.56647 10.9431 5.19592 10.8746 5.62643 11.2205L10.0699 14.7912L17.586 6.33565C17.9529 5.92286 18.585 5.88568 18.9977 6.2526Z" fill="#696969" />
+</symbol>
 
 </svg>
-- 
GitLab


From 2f5e432b34cdc20b0e16ef787a01df03e719bf76 Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Thu, 15 Sep 2022 16:42:32 +0200
Subject: [PATCH 20/23] review fixes

---
 .../form/footer-form/footer-form.component.ts |  14 ++-
 ...tructure-members-management.component.html |   4 +-
 ...tructure-members-management.component.scss | 100 ++++++++++--------
 .../structure-members-management.component.ts |   3 +-
 4 files changed, 66 insertions(+), 55 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 99dcd05b8..717a1e178 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -16,7 +16,7 @@ import { structureFormStep } from '../form-view/structure-form/structureFormStep
 @Component({
   selector: 'app-footer-form',
   templateUrl: './footer-form.component.html',
-  styleUrls: ['./footer-form.component.scss']
+  styleUrls: ['./footer-form.component.scss'],
 })
 export class FooterFormComponent implements OnChanges {
   @Input() currentForm: formType;
@@ -72,7 +72,8 @@ export class FooterFormComponent implements OnChanges {
       }
       if (
         this.currentForm === formType.structure &&
-        (this.currentStep === structureFormStep.noStructure || this.currentStep === structureFormStep.StructureInfoUnknown)
+        (this.currentStep === structureFormStep.noStructure ||
+          this.currentStep === structureFormStep.StructureInfoUnknown)
       ) {
         this.isLastFormStep = true;
       }
@@ -134,7 +135,7 @@ export class FooterFormComponent implements OnChanges {
       user.structuresLink = this.linkedStructureId;
       this.authService.register(user).subscribe(() => {
         if (this.acceptNewsletter) {
-          this.newsletterService.newsletterSubscribe(user.email).subscribe(() => {});
+          this.newsletterService.newsletterSubscribe(user.email).subscribe();
         }
       });
       document.getElementsByClassName('page')[0].scrollTo(0, 0);
@@ -196,7 +197,9 @@ export class FooterFormComponent implements OnChanges {
 
   private isStructureChoiceValid(): boolean {
     return (
-      this.currentForm === formType.structure && this.currentStep === structureFormStep.structureChoice && this.form.value._id
+      this.currentForm === formType.structure &&
+      this.currentStep === structureFormStep.structureChoice &&
+      this.form.value._id
     );
   }
 
@@ -216,7 +219,8 @@ export class FooterFormComponent implements OnChanges {
 
   private isPersonalOfferpage(): boolean {
     return (
-      this.currentForm === formType.personaloffer && this.currentStep === personalOfferFormStep.personalOfferStructureChoice
+      this.currentForm === formType.personaloffer &&
+      this.currentStep === personalOfferFormStep.personalOfferStructureChoice
     );
   }
   public isPersonalOfferFirstPage(): boolean {
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.html b/src/app/profile/structure-members-management/structure-members-management.component.html
index 53658c5eb..903dffbfb 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.html
+++ b/src/app/profile/structure-members-management/structure-members-management.component.html
@@ -1,8 +1,8 @@
 <div class="content-container full-screen">
-  <div class="container">
+  <div class="container members-management">
     <div class="header">
       <div fxLayout="row" fxLayoutAlign="space-between center" fxFill>
-        <div fxLayout="row" fxLayoutAlign="start center">
+        <div fxLayout="row" fxLayoutAlign="start center" class="headerBack">
           <app-svg-icon [iconClass]="'backArrow'" [type]="'ico'" [icon]="'arrowBack'" (click)="goBack()"></app-svg-icon>
           <h1>Gérer les membres<br />de {{ structure.structureName }}</h1>
         </div>
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
index b936386ea..17db43964 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.scss
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -12,66 +12,72 @@
   .header {
     margin-bottom: 2rem;
   }
+  .headerBack {
+    cursor: pointer;
+  }
   h1 {
     @include lato-regular-24;
     color: $grey-1;
+    cursor: initial;
   }
-}
 
-.member-card {
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  .user {
-    margin-right: 15px;
-  }
-  .avatar {
-    background-color: $grey-8;
-    border-radius: 4px;
-  }
-  .info-member {
-    margin-left: 1rem;
-    p {
-      margin: 0;
-    }
-    .member {
-      @include lato-bold-14;
+  .member-card {
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .user {
+      margin-right: 1rem;
     }
-    .job {
-      @include lato-regular-14;
+    .avatar {
+      background-color: $grey-8;
+      border-radius: 4px;
     }
-  }
-  .info-pendingStructure {
-    display: flex;
-    margin-right: 1rem;
-    max-width: 200px;
-    p {
-      margin: 0;
+    .info-member {
+      margin-left: 1rem;
+      p {
+        margin: 0;
+      }
+      .member {
+        @include lato-bold-14;
+      }
+      .job {
+        @include lato-regular-14;
+      }
     }
-    .text {
-      @include lato-regular-13;
-      color: $grey-3;
-      margin-left: 3px;
+    .info-pendingStructure {
+      display: flex;
+      margin-right: 1rem;
+      max-width: 200px;
+      p {
+        margin: 0;
+      }
+      .text {
+        @include lato-regular-13;
+        color: $grey-3;
+        margin-left: 3px;
+      }
     }
-  }
-  .card-container {
-    @media #{$large-phone} {
-      flex-direction: column !important;
-      align-items: flex-start !important;
+    .card-container {
+      @media #{$large-phone} {
+        flex-direction: column !important;
+        align-items: flex-start !important;
+      }
     }
   }
 }
 
-::ng-deep .btn-regular.secondary .text {
-  width: 184px !important;
-  height: 24px !important;
-}
-.button-member {
+.members-management {
   ::ng-deep .btn-regular.secondary .text {
-    color: $red !important;
+    width: 184px !important;
+    height: 24px !important;
+  }
+  .button-member {
+    ::ng-deep .btn-regular.secondary .text {
+      color: $red !important;
+    }
+  }
+  ::ng-deep .modalBackground p {
+    white-space: pre-wrap;
   }
-}
-::ng-deep .modalBackground p {
-  white-space: pre-wrap;
 }
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.ts b/src/app/profile/structure-members-management/structure-members-management.component.ts
index 8c2816e45..5292e48f1 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.ts
+++ b/src/app/profile/structure-members-management/structure-members-management.component.ts
@@ -22,7 +22,7 @@ export class StructureMembersManagementComponent implements OnInit {
   public tempUsers: TempUser[];
   public tempUserToCancel: TempUser;
   public memberToExclude: Owner;
-  public addMemberModalOpenned = false;
+  public addMemberModalOpenned: boolean = false;
   public excludeModalOpenned = false;
   public cancelAddTempUserModalOpenned = false;
   public buttonTypeEnum = ButtonType;
@@ -106,6 +106,7 @@ export class StructureMembersManagementComponent implements OnInit {
     this.addMemberModalOpenned = false;
     if (memberAddRequested) {
       this.ngOnInit();
+      this.notificationService.showSuccess(`La demande d'ajout a bien été effectuée`, '');
     }
   }
 }
-- 
GitLab


From 4627381e7d6d9e65946630be7f2e92dca5f967cf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 15 Sep 2022 17:48:45 +0200
Subject: [PATCH 21/23] feat: US133 integration

---
 .../profile-structure.component.html          | 20 +++++++++++++----
 .../profile-structure.component.scss          |  2 +-
 .../profile-structure.component.ts            | 22 +++++++++++++++----
 3 files changed, 35 insertions(+), 9 deletions(-)

diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index cacc35751..5d6c08ddc 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -1,5 +1,11 @@
 <div class="structureCard" fxLayout="column" fxLayoutAlign="center" [ngClass]="{ fold: !showDetails }">
-  <div class="collapseHeader" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px" (click)="toggleDetails()">
+  <div
+    class="collapseHeader"
+    fxLayout="row"
+    fxLayoutAlign="space-between center"
+    fxLayoutGap="20px"
+    (click)="toggleDetails()"
+  >
     <div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
       <app-svg-icon [type]="'ico'" [icon]="'structureAvatar'" [iconClass]="'icon-52'"></app-svg-icon>
       <div fxLayout="column" fxLayoutAlign="space-between start">
@@ -96,7 +102,7 @@
             [iconBtn]="'edit'"
             [text]="'Gérer les membres'"
             [style]="buttonTypeEnum.SecondaryWide"
-            routerLink="./"
+            routerLink="./structure-members-management/{{ structureWithOwners.structure._id }}"
             [routerLinkActive]="'active'"
           ></app-button>
           <app-button
@@ -105,7 +111,7 @@
             [type]="'button'"
             [iconBtn]="'edit'"
             [style]="buttonTypeEnum.SecondaryOnlyIcon"
-            routerLink="./"
+            routerLink="./structure-members-management/{{ structureWithOwners.structure._id }}"
             [routerLinkActive]="'active'"
           ></app-button>
         </div>
@@ -119,10 +125,16 @@
           [iconBtn]="'add'"
           [text]="'Ajouter un membre'"
           [style]="buttonTypeEnum.SecondaryUltraWide"
-          routerLink="./"
           [routerLinkActive]="'active'"
+          (click)="addMemberModalOpenned = true"
         ></app-button>
       </div>
     </div>
   </div>
 </div>
+<app-structure-add-member-modal
+  *ngIf="addMemberModalOpenned"
+  [openned]="addMemberModalOpenned"
+  [structure]="structureWithOwners"
+  (closed)="closeAddMemberModal($event)"
+></app-structure-add-member-modal>
diff --git a/src/app/profile/profile-structure/profile-structure.component.scss b/src/app/profile/profile-structure/profile-structure.component.scss
index 6165b9269..f949c3e86 100644
--- a/src/app/profile/profile-structure/profile-structure.component.scss
+++ b/src/app/profile/profile-structure/profile-structure.component.scss
@@ -45,7 +45,7 @@
       }
     }
     .section-title {
-      text-transform: capitalize;
+      text-transform: uppercase;
       @include lato-bold-14;
       color: $grey-3;
     }
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index e32c3e41e..9567aad53 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -6,6 +6,7 @@ import { Structure } from '@gouvfr-anct/mediation-numerique';
 import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
 import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
 import { StructureWithOwners } from '../../models/structureWithOwners.model';
+import { NotificationService } from '../../services/notification.service';
 import { formUtils } from '../../utils/formUtils';
 import { User } from './../../models/user.model';
 import { UserService } from './../../services/user.service';
@@ -19,9 +20,9 @@ import { UserService } from './../../services/user.service';
       state('true', style({ height: AUTO_STYLE, visibility: AUTO_STYLE, margin: '8px 0' })),
       state('false', style({ height: '0px', visibility: 'hidden', margin: '0' })),
       transition('true => false', animate('300ms ease-out')),
-      transition('false => true', animate('300ms ease-out'))
-    ])
-  ]
+      transition('false => true', animate('300ms ease-out')),
+    ]),
+  ],
 })
 export class ProfileStructureComponent implements OnInit {
   @Input() public structureWithOwners: StructureWithOwners;
@@ -31,8 +32,13 @@ export class ProfileStructureComponent implements OnInit {
   public structureForm: FormGroup;
   public buttonTypeEnum = ButtonType;
   public showDetails: boolean = false;
+  public addMemberModalOpenned: boolean = false;
 
-  constructor(private router: Router, private userService: UserService) {}
+  constructor(
+    private router: Router,
+    private userService: UserService,
+    private notificationService: NotificationService
+  ) {}
 
   ngOnInit(): void {
     this.structureForm = new formUtils().createStructureForm(this.structureWithOwners.structure, true);
@@ -67,4 +73,12 @@ export class ProfileStructureComponent implements OnInit {
     const address = this.structureWithOwners.structure.address;
     return address.numero + ' ' + address.street + ' - ' + address.commune;
   }
+
+  public closeAddMemberModal(memberAddRequested: boolean): void {
+    this.addMemberModalOpenned = false;
+    if (memberAddRequested) {
+      this.ngOnInit();
+      this.notificationService.showSuccess(`La demande d'ajout a bien été effectuée`, '');
+    }
+  }
 }
-- 
GitLab


From 14996d507f4dba0dcf533b73a8a7392e2f51b16d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Thu, 15 Sep 2022 17:57:08 +0200
Subject: [PATCH 22/23] fix: updated import

---
 .../profile/profile-structure/profile-structure.component.ts  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 9567aad53..f05282193 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -2,11 +2,11 @@ import { animate, AUTO_STYLE, state, style, transition, trigger } from '@angular
 import { Component, Input, OnInit } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import { Router } from '@angular/router';
-import { Structure } from '@gouvfr-anct/mediation-numerique';
-import { ButtonType } from '@gouvfr-anct/mediation-numerique/shared';
 import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
+import { Structure } from '../../models/structure.model';
 import { StructureWithOwners } from '../../models/structureWithOwners.model';
 import { NotificationService } from '../../services/notification.service';
+import { ButtonType } from '../../shared/components/button/buttonType.enum';
 import { formUtils } from '../../utils/formUtils';
 import { User } from './../../models/user.model';
 import { UserService } from './../../services/user.service';
-- 
GitLab


From ce1f3f5223b8fc060cc691870c5f85833580976f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9mi=20Pailharey?= <rpailharey@grandlyon.com>
Date: Fri, 16 Sep 2022 10:10:43 +0200
Subject: [PATCH 23/23] fix: routing + disabled buttons

---
 src/app/app-routing.module.ts             | 10 +---------
 src/app/profile/profile-routing.module.ts | 17 ++++++++++++++++-
 src/app/profile/profile.component.html    |  4 +++-
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 54d1b5760..0251feb28 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -8,20 +8,18 @@ import { OrientationFormComponent } from './form/orientation-form/orientation-fo
 import { AdminGuard } from './guards/admin.guard';
 import { AuthGuard } from './guards/auth.guard';
 import { LoginGuard } from './guards/login.guard';
-import { DeactivateGuard } from './guards/deactivate.guard';
 import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
 import { LoginComponent } from './login/login.component';
 import { NewsletterSubscriptionComponent } from './newsletter-subscription/newsletter-subscription.component';
 import { PageComponent } from './page/page.component';
-import { EditComponent } from './profile/edit/edit.component';
 import { ResetEmailComponent } from './reset-email/reset-email.component';
 import { ResetPasswordComponent } from './reset-password/reset-password.component';
 import { StructureResolver } from './resolvers/structure.resolver';
 import { PasswordFormComponent } from './shared/components';
-import { StructureJoinComponent } from './structure/structure-join/structure-join.component';
 import { StructureDetailsComponent } from './structure-list/components/structure-details/structure-details.component';
 import { StructureListComponent } from './structure-list/structure-list.component';
 import { StructureExcludeComponent } from './structure/structure-exclude/structure-exclude.component';
+import { StructureJoinComponent } from './structure/structure-join/structure-join.component';
 
 const footerOutletRoute: Route = {
   path: '',
@@ -142,12 +140,6 @@ const routes: Routes = [
         canActivate: [AuthGuard],
         loadChildren: () => import('./profile/profile.module').then((m) => m.ProfileModule),
       },
-      {
-        path: 'edit',
-        canActivate: [AuthGuard],
-        component: EditComponent,
-      },
-      footerOutletRoute,
       {
         path: '',
         outlet: 'left-pane',
diff --git a/src/app/profile/profile-routing.module.ts b/src/app/profile/profile-routing.module.ts
index 688a99bc9..0143e14e2 100644
--- a/src/app/profile/profile-routing.module.ts
+++ b/src/app/profile/profile-routing.module.ts
@@ -1,13 +1,28 @@
 import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
+import { Routes, RouterModule, Route } from '@angular/router';
 import { RoleGuard } from '../guards/role.guard';
 import { StructureResolver } from '../resolvers/structure.resolver';
 import { RouteRole } from '../shared/enum/routeRole.enum';
 import { StructureMembersManagementComponent } from './structure-members-management/structure-members-management.component';
 import { ProfileComponent } from './profile.component';
 import { StructureEditionSummaryComponent } from './structure-edition-summary/structure-edition-summary.component';
+import { AuthGuard } from '../guards/auth.guard';
+import { EditComponent } from './edit/edit.component';
+import { FooterComponent } from '../footer/footer.component';
+
+const footerOutletRoute: Route = {
+  path: '',
+  outlet: 'footer',
+  component: FooterComponent,
+};
 
 const routes: Routes = [
+  {
+    path: 'edit',
+    canActivate: [AuthGuard],
+    component: EditComponent,
+  },
+  footerOutletRoute,
   {
     path: '',
     children: [
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 78dba8fc4..a5a2cfcc4 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -79,14 +79,16 @@
           [style]="buttonTypeEnum.SecondaryWide"
           routerLink="./"
           [routerLinkActive]="'active'"
+          [disabled]="true"
         ></app-button>
         <app-button
           class="hide-on-desktop"
           [type]="'button'"
           [iconBtn]="'edit'"
           [style]="buttonTypeEnum.SecondaryOnlyIcon"
-          routerLink="/profile/edit"
+          routerLink="/"
           [routerLinkActive]="'active'"
+          [disabled]="true"
         ></app-button>
       </div>
       <div fxLayoutGap="16px" fxLayout="column" fxFill>
-- 
GitLab