chore: added info icon for inactive contract agreements and minor cod…

…e refactoring
sovity · Jul 3, 2023 · dbb1441 · dbb1441
1 parent de0c787
commit dbb1441
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 19 deletions.
diff --git a/src/app/component-library/property-grid/property-grid/property-grid.component.html b/src/app/component-library/property-grid/property-grid/property-grid.component.html
@@ -20,9 +20,6 @@
       matTooltip="{{ prop.tooltip }}"
       [attr.title]="prop.labelTitle">
       {{ prop.label }}
-      <mat-icon *ngIf="prop.tooltip" class="text-warn mat-icon-[10px]"
-        >warning
-      </mat-icon>
     </div>
 
     <!-- Property Value (URL) -->
@@ -51,7 +48,10 @@
       *ngIf="!(prop.url || prop.onclick)"
       matTooltip="{{ prop.tooltip }}"
       [ngClass]="prop.additionalClasses"
-      >{{ prop.text }}</span
+      >{{ prop.text }}
+      <mat-icon *ngIf="prop.tooltip" class="mat-icon-[10px]"
+        >info
+      </mat-icon></span
     >
   </div>
   <button

diff --git a/...ontract-agreement-page/contract-agreement-cards/contract-agreement-card-mapped.service.ts b/...ontract-agreement-page/contract-agreement-cards/contract-agreement-card-mapped.service.ts
@@ -21,6 +21,7 @@ export class ContractAgreementCardMappedService {
     let asset = this.assetPropertyMapper.buildAssetFromProperties(
       contractAgreement.asset.properties,
     );
+
     return {
       ...contractAgreement,
       asset,
@@ -54,16 +55,25 @@ export class ContractAgreementCardMappedService {
       ...it,
       isConsumingLimitsEnforced: true,
       statusText: index < maxConsumingContracts ? 'Active' : 'Inactive',
-      statusTooltipText:
-        index >= maxConsumingContracts
-          ? maxConsumingContracts == 1
-            ? 'This connector is configured with a limit of ' +
-              maxConsumingContracts +
-              ' active consuming contract agreement, causing contract agreement to get disabled if new ones are negotiated.'
-            : 'This connector is configured with a limit of ' +
-              maxConsumingContracts +
-              ' active consuming contract agreements, causing contract agreements to get disabled if new ones are negotiated.'
-          : '',
+      statusTooltipText: this.getConsumingContractsInfoText(
+        index,
+        maxConsumingContracts,
+      ),
     }));
   }
+
+  private getConsumingContractsInfoText(
+    index: number,
+    maxConsumingContracts: number,
+  ): string {
+    if (index >= maxConsumingContracts) {
+      if (maxConsumingContracts == 1) {
+        return `This connector is configured with a limit of ${maxConsumingContracts} active consuming contract agreement, causing contract agreement to get disabled if new ones are negotiated.`;
+      } else {
+        return `This connector is configured with a limit of ${maxConsumingContracts} active consuming contract agreements, causing contract agreements to get disabled if new ones are negotiated.`;
+      }
+    } else {
+      return '';
+    }
+  }
 }
diff --git a/.../contract-agreement-page/contract-agreement-cards/contract-agreement-cards.component.html b/.../contract-agreement-page/contract-agreement-cards/contract-agreement-cards.component.html
@@ -79,14 +79,14 @@
           [matTooltip]="card.statusTooltipText">
           <div class="text-slate text-sm uppercase tracking-wider text-right">
             Status
-            <mat-icon
-              *ngIf="card.statusText === 'Inactive'"
-              class="text-warn mat-icon-[10px]"
-              >warning
-            </mat-icon>
           </div>
           <div class="text-right">
             {{ card.statusText }}
+            <mat-icon
+              *ngIf="card.statusText === 'Inactive'"
+              class="mat-icon-[10px]"
+              >info
+            </mat-icon>
           </div>
         </div>
       </div>