fix: move help dialogs to nre performance page

src/app/components/dialogs/ceCalculatedFortificationInfoDialog/ceCalculatedFortificationInfoDialog.component.html

@@ -4,6 +4,6 @@
       (fortifiable and non-fortifiable) before adjusting for post-fortification micronutrient losses. It is calculated
       as the average fortification level among fortifiable food vehicle at point of fortification multiplied by the
       percent of food vehicle that is fortifiable/industrially processed. This value will change as you adjust the
-      “Baseline performance” values above.</p>
+      “Performance over time” values above.</p>
   </div>
 </app-base-dialog>

src/app/components/dialogs/ceFortificationInfoDialog/ceFortificationInfoDialog.component.html

@@ -6,6 +6,6 @@
       point of fortification (i.e., before adjusting for post-fortification micronutrient losses). It is calculated as
       the target/standard fortification level multiplied by the percent of fortifiable food vehicle that is fortified to
       any extent and by the average fortification level among fortified food vehicle as a percent of the standard. This
-      value will change as you adjust the “Baseline performance” values above.</p>
+      value will change as you adjust the “Performance over time” values above.</p>
   </div>
 </app-base-dialog>

src/app/pages/costEffectiveness/interventionReview/pages/interventionBaseline/interventionBaseline.component.html

@@ -1,60 +1,6 @@
 <div class="bmgf-maps-nice-scrollbar container">
   <div class="content">
     <app-intervention-description></app-intervention-description>
-    <!--     <div class="title">
-      <span>Baseline Performance
-        <button class="icon-display floater" mat-mini-fab color="primary"
-          (click)="openBaselinePerformanceInfoDialog()"><mat-icon class="icon-display">question_mark</mat-icon>
-        </button></span>
-    </div>
-    <div *ngIf="!this.compoundAvailable">
-      <app-quickmaps-no-results></app-quickmaps-no-results>
-    </div>
-    <div *ngIf="this.compoundAvailable">
-      <app-reusable-skeleton-table *ngIf="!dataLoaded"
-        [setData]="{ columns: 3, rows: 3 }"></app-reusable-skeleton-table>
-
-      <form [formGroup]="form" *ngIf="form">
-        <table mat-table [dataSource]="dataSource" formArrayName="items" class="table-full-width">
-          <ng-container matColumnDef="title">
-            <td class="row-title-left" mat-cell *matCellDef="let element">
-              {{ element.labelText }}
-              <i *ngIf="element.rowNotes" class="fas fa-question-circle" matTooltip="{{element.rowNotes}}"></i>
-            </td>
-          </ng-container>
-
-          <ng-container matColumnDef="year0">
-            <td mat-cell *matCellDef="let element; let index = index" [formGroupName]="index">
-              <div class="double-cell">
-                <div>
-                  {{ element.micronutrient}}
-                  <app-ce-input-field [index]="index" [year]="0" [element]="element" [form]="form"
-                    [tableData]="dataSource" [dirtyIndexes]="dirtyIndexes" [includeCopyRightButton]="false"
-                    [changeFunction]="updateBaselineAssumptions" [omitStyling]="true"></app-ce-input-field>
-                </div>
-                <a matTooltip="{{element.dataSource}}" class="sourceBtn sourceBtnWide" [href]="element.dataSource"
-                  target="_blank"
-                  *ngIf="element.dataSource.startsWith('http') && dirtyIndexes.includes(index) === false && element.year0Edited === false"
-                  mat-button color="primary">
-                  {{ element.dataSource}}&nbsp;<mat-icon iconPositionEnd>open_in_new</mat-icon>
-                </a>
-                <button matTooltip="{{element.dataSource}}" class="sourceBtn sourceBtnWide"
-                  *ngIf="!element.dataSource.startsWith('http') && dirtyIndexes.includes(index) === false && element.year0Edited === false"
-                  mat-button color="primary">
-                  {{ element.dataSource}}
-                </button>
-                <button *ngIf="dirtyIndexes.includes(index) || element.year0Edited === true" mat-button color="primary">
-                  User Input
-                </button>
-              </div>
-            </td>
-          </ng-container>
-
-          <tr mat-row *matRowDef="let row; columns: baselinedisplayedColumns;"></tr>
-        </table>
-      </form> -->
-
-
 
     <div *ngIf="this.compoundAvailable">
 
@@ -241,48 +187,6 @@
                 </td>
               </ng-container>
 
-              <ng-container matColumnDef="avgVal">
-                <th class="row-title-left header-top-align" mat-header-cell *matHeaderCellDef>Calculated baseline
-                  fortification levels in practice
-                  <button class="icon-display floater" mat-mini-fab color="primary"
-                    (click)="openFortificationInfoDialog()">
-                    <mat-icon class="icon-display">question_mark</mat-icon>
-                  </button>
-
-                </th>
-                <td mat-cell *matCellDef="let element">
-                  <ng-container class="double-cell">
-                    <span>
-                      {{ selectedCompounds[element.micronutrient].targetVal *
-                      baselineAssumptions?.actuallyFortified.year0 *
-                      baselineAssumptions?.averageFortificationLevel.year0 | sigFig: 3 }}
-                    </span>
-                  </ng-container>
-                </td>
-              </ng-container>
-
-
-              <ng-container matColumnDef="calcFort">
-                <th class="row-title-left header-top-align" mat-header-cell *matHeaderCellDef>
-                  Calculated average fortification level (mg/kg)
-                  among all food vehicle
-                  <button class="icon-display floater" mat-mini-fab color="primary"
-                    (click)="openCalculatedFortificationInfoDialog()">
-                    <mat-icon class="icon-display">question_mark</mat-icon>
-                  </button>
-                </th>
-                <td mat-cell *matCellDef="let element">
-                  <ng-container class="double-cell">
-                    <span *ngIf="null != baselineAssumptions">
-                      {{ selectedCompounds[element.micronutrient].targetVal *
-                      baselineAssumptions?.actuallyFortified.year0 *
-                      baselineAssumptions?.averageFortificationLevel.year0 *
-                      baselineAssumptions.potentiallyFortified.year0 | sigFig:3 }}
-                    </span>
-                  </ng-container>
-                </td>
-              </ng-container>
-
               <!-- <tr mat-header-row *matHeaderRowDef="baselineFVdisplayedColumns"></tr> -->
               <tr mat-row *matRowDef="let row; columns: baselineFVdisplayedColumns;"></tr>
             </table>

src/app/pages/costEffectiveness/interventionReview/pages/interventionBaseline/interventionBaseline.component.ts

@@ -225,15 +225,6 @@ export class InterventionBaselineComponent implements AfterViewInit {
     return true;
   }
 
-  public openFortificationInfoDialog(): void {
-    void this.dialogService.openFortificationInfoDialog();
-  }
-  public openCalculatedFortificationInfoDialog(): void {
-    void this.dialogService.openCalculatedFortificationInfoDialog();
-  }
-  public openBaselinePerformanceInfoDialog(): void {
-    void this.dialogService.openBaselinePerformanceInfoDialog();
-  }
   public openfoodVehicleStandardInfoDialog(): void {
     void this.dialogService.openfoodVehicleStandardInfoDialog();
   }

src/app/pages/costEffectiveness/interventionReview/pages/interventionCompliance/interventionCompliance.component.html

@@ -1,8 +1,12 @@
 <div class="bmgf-maps-nice-scrollbar container">
   <div class="content">
     <app-intervention-description></app-intervention-description>
-    <div class="title">
-      <span>Performance over time</span>
+    <div class="header-row">
+      <div class="title">
+        <span>Performance over time <button class="icon-display floater" mat-mini-fab color="primary"
+            (click)="openBaselinePerformanceInfoDialog()"><mat-icon class="icon-display">question_mark</mat-icon>
+          </button></span>
+      </div>
     </div>
 
     <app-reusable-skeleton-table *ngIf="!dataLoaded" [setData]="{ columns: 11, rows: 2 }"></app-reusable-skeleton-table>
@@ -39,9 +43,12 @@
       </table>
     </form>
     <div class="title">
-      <span>Average fortification level (mg/kg) among fortifiable food vehicle at point of fortification</span>
+      <span>Average fortification level (mg/kg) among fortifiable food vehicle at point of fortification<button
+          class="icon-display floater" mat-mini-fab color="primary" (click)="openFortificationInfoDialog()"><mat-icon
+            class="icon-display">question_mark</mat-icon>
+        </button></span>
     </div>
-    <div class="lower-table-wrapper">
+    <div class="lower-table-wrapper bmgf-maps-nice-scrollbar">
       <table mat-table [dataSource]="averageFortificationAtPointOfFortificationDataSource" matSort
         class="table-full-width">
         <ng-container matColumnDef="micronutrient">
@@ -150,9 +157,12 @@
 
 
     <div class="title">
-      <span>Average fortification level (mg/kg) among all food vehicle before accounting for micronutrient losses</span>
+      <span>Average fortification level (mg/kg) among all food vehicle before accounting for micronutrient losses<button
+          class="icon-display floater" mat-mini-fab color="primary"
+          (click)="openCalculatedFortificationInfoDialog()"><mat-icon class="icon-display">question_mark</mat-icon>
+        </button></span>
     </div>
-    <div class="lower-table-wrapper">
+    <div class="lower-table-wrapper  bmgf-maps-nice-scrollbar">
       <table mat-table [dataSource]="averageFortificationAmongAllFoodVehicleDataSource" matSort
         class="table-full-width">
         <ng-container matColumnDef="micronutrient">

src/app/pages/costEffectiveness/interventionReview/pages/interventionCompliance/interventionCompliance.component.scss

@@ -37,3 +37,8 @@ input.ng-dirty {
 .loading-indicator {
   display: inline-block;
 }
+
+.icon-display {
+  transform: scale(0.6);
+  display: inline-block !important;
+}

src/app/pages/costEffectiveness/interventionReview/pages/interventionCompliance/interventionCompliance.component.ts

@@ -19,6 +19,7 @@ import { InterventionDataService, InterventionForm } from 'src/app/services/inte
 import { InterventionSideNavContentService } from '../../components/interventionSideNavContent/interventionSideNavContent.service';
 import { Router } from '@angular/router';
 import { Intervention } from 'src/app/apiAndObjects/objects/intervention';
+import { DialogService } from 'src/app/components/dialogs/dialog.service';
 @Component({
   selector: 'app-intervention-compliance',
   templateUrl: './interventionCompliance.component.html',
@@ -75,6 +76,7 @@ export class InterventionComplianceComponent implements OnInit {
   constructor(
     public quickMapsService: QuickMapsService,
     public intSideNavService: InterventionSideNavContentService,
+    private dialogService: DialogService,
     private interventionDataService: InterventionDataService,
     private formBuilder: NonNullableFormBuilder,
     private router: Router,
@@ -130,6 +132,16 @@ export class InterventionComplianceComponent implements OnInit {
     // this.dataSource = new MatTableDataSource(this.rawDataArray);
   }
 
+  public openFortificationInfoDialog(): void {
+    void this.dialogService.openFortificationInfoDialog();
+  }
+  public openCalculatedFortificationInfoDialog(): void {
+    void this.dialogService.openCalculatedFortificationInfoDialog();
+  }
+  public openBaselinePerformanceInfoDialog(): void {
+    void this.dialogService.openBaselinePerformanceInfoDialog();
+  }
+
   public async createAvNutrientLevelTable(baselineAssumptions: BaselineAssumptions): Promise<void> {
     const fvArray = [];
     const pofArray = [];