fix(personal0fferEdition): add structure name to personal offer edition screen and modal

src/app/profile/personal-offer-edition/personal-offer-edition.component.html

@@ -7,7 +7,10 @@
             <use [attr.xlink:href]="'assets/ico/sprite.svg#arrowBack'"></use>
           </svg>
         </a>
-        <h1>Gérer mon offre de service</h1>
+        <div>
+          <p *ngIf="structureName" class="overtitle">{{ structureName }}</p>
+          <h1>Gérer mon offre de service</h1>
+        </div>
       </div>
       <app-button
         class="hide-on-mobile deleteOffer"
@@ -81,7 +84,10 @@
     <div class="modal">
       <div class="modalHeader">
         <div class="empty"></div>
-        <h3>Supprimer mon offre</h3>
+        <div class="modalTitleText">
+          <p *ngIf="structureName" class="overtitle">{{ structureName }}</p>
+          <h3>Supprimer mon offre</h3>
+        </div>
         <svg class="close" aria-hidden="true" (click)="closeModal()">
           <use [attr.xlink:href]="'assets/form/sprite.svg#close'"></use>
         </svg>

src/app/profile/personal-offer-edition/personal-offer-edition.component.scss

@@ -33,7 +33,6 @@
 
   .header {
     justify-content: space-between;
-    padding-bottom: 18px;
     align-items: center;
 
     .title {
@@ -44,6 +43,7 @@
         @media #{$tablet} {
           @include lato-regular-20;
         }
+        padding-bottom: 1.25em;
       }
       // h1 {
       //   color: $grey-1;
@@ -137,8 +137,16 @@
       align-items: center;
       border: 1px solid $grey-6;
       padding: 0 8px;
+      .modalTitleText {
+        flex-direction: column;
+        margin: 1em 0;
+      }
       h3 {
         @include lato-bold-18;
+        margin: 0;
+      }
+      a {
+        align-self: flex-end;
       }
       svg,
       .empty {
@@ -166,3 +174,9 @@
     }
   }
 }
+
+.overtitle {
+  @include lato-regular-18;
+  color: $grey-3;
+  margin: 0 0 3px;
+}

src/app/profile/personal-offer-edition/personal-offer-edition.component.ts

@@ -31,6 +31,7 @@ export class PersonalOfferEditionComponent implements OnInit {
   public onlineProcedures: Category;
   public trainingCategories: CategoriesToggle[] = [];
   public deleteOfferModal: boolean;
+  public structureName: string;
 
   constructor(
     private route: ActivatedRoute,
@@ -49,6 +50,7 @@ export class PersonalOfferEditionComponent implements OnInit {
         this.initialPersonalOffer = this.personalOfferForm.value;
       }
     });
+    this.structureName = history.state.structureName;
   }
 
   private createPersonalOfferForm(personalOfferState): UntypedFormGroup {

src/app/profile/profile-structure/personal-offer/personal-offer.component.html

@@ -8,6 +8,7 @@
       [iconBtn]="'edit'"
       [text]="'Modifier mon offre'"
       [style]="buttonTypeEnum.SecondaryWide"
+      [state]="{ structureName: this.structureName }"
       routerLink="./edit-personal-offer/{{ this.personalOffer._id }}"
     />
     <app-button

src/app/profile/profile-structure/personal-offer/personal-offer.component.ts

@@ -19,6 +19,7 @@ import { PersonalOffer } from './../../../models/personalOffer.model';
 export class PersonalOfferComponent {
   @Input() public personalOffer: PersonalOffer;
   @Input() public isPublic: boolean;
+  @Input() public structureName?: string;
   public buttonTypeEnum = ButtonType;
   public showOnlineProcedures: boolean = false;
   public showBaseSkills: boolean = false;

src/app/profile/profile-structure/profile-structure.component.html

@@ -105,6 +105,7 @@
       *ngIf="this.personalOffer && !isPending"
       class="section"
       [personalOffer]="personalOffer"
+      [structureName]="structure.structureName"
       [isPublic]="isPublic"
     >
     </app-personal-offer>