WEB-602 Use the env var for hidding client data information MIFOS_COMPLIANCE_HIDE_CLIENT_DATA and it is enabled to true the display name must be hidden using * characters for replacing the letters. (#3017)

src/app/clients/clients-view/clients-view.component.html

@@ -58,8 +58,14 @@
               [ngClass]="clientViewData.status.code | statusLookup"
               matTooltip="{{ 'labels.status.' + clientViewData.status.value | translate }}"
             ></i>
-            <b>{{ 'labels.inputs.Client Name' | translate }} :</b
-            ><mifosx-entity-name entityName="{{ clientViewData.displayName }}"></mifosx-entity-name>
+            <b>{{ 'labels.inputs.Client Name' | translate }} :</b>
+            <mifosx-entity-name
+              [entityName]="
+                complianceHideClientData ? maskName(clientViewData.displayName) : clientViewData.displayName
+              "
+              [display]="'right'"
+              [hideCopy]="complianceHideClientData"
+            ></mifosx-entity-name>
           </h3>
           <div class="flex-5 align-end-center">
             <button mat-icon-button [matMenuTriggerFor]="clientMenu" aria-label="Client actions" yPosition="below">
@@ -79,7 +85,7 @@
                     <td>
                       <b>{{ 'labels.inputs.Office' | translate }}</b>
                     </td>
-                    <td><mifosx-entity-name entityName="{{ clientViewData.officeName }}"></mifosx-entity-name></td>
+                    <td><mifosx-entity-name [entityName]="clientViewData.officeName"></mifosx-entity-name></td>
                   </tr>
                   <tr>
                     <td>
@@ -93,8 +99,11 @@
                     </td>
                     <td>
                       <mifosx-external-identifier
-                        externalId="{{ clientViewData.externalId }}"
-                        completed="true"
+                        [externalId]="
+                          complianceHideClientData ? maskValue(clientViewData.externalId) : clientViewData.externalId
+                        "
+                        [completed]="true"
+                        [hideCopy]="complianceHideClientData"
                       ></mifosx-external-identifier>
                     </td>
                   </tr>
@@ -151,8 +160,11 @@
                     </td>
                     <td>
                       <mifosx-external-identifier
-                        externalId="{{ clientViewData.mobileNo }}"
-                        completed="true"
+                        [externalId]="
+                          complianceHideClientData ? maskValue(clientViewData.mobileNo) : clientViewData.mobileNo
+                        "
+                        [completed]="true"
+                        [hideCopy]="complianceHideClientData"
                       ></mifosx-external-identifier>
                     </td>
                   </tr>
@@ -162,8 +174,13 @@
                     </td>
                     <td>
                       <mifosx-external-identifier
-                        externalId="{{ clientViewData.emailAddress }}"
-                        completed="true"
+                        [externalId]="
+                          complianceHideClientData
+                            ? maskEmail(clientViewData.emailAddress)
+                            : clientViewData.emailAddress
+                        "
+                        [completed]="true"
+                        [hideCopy]="complianceHideClientData"
                       ></mifosx-external-identifier>
                     </td>
                   </tr>

src/app/clients/clients-view/clients-view.component.ts

@@ -8,6 +8,7 @@
 
 /** Angular Imports */
 import { Component, OnInit, inject } from '@angular/core';
+import { environment } from 'src/environments/environment';
 import { ActivatedRoute, Router, RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
 import { DomSanitizer } from '@angular/platform-browser';
 import { MatDialog } from '@angular/material/dialog';
@@ -79,6 +80,53 @@ import { formatTabLabel } from 'app/shared/utils/format-tab-label.util';
   ]
 })
 export class ClientsViewComponent implements OnInit {
+  complianceHideClientData = environment.complianceHideClientData;
+  /**
+   * Mask a string, keeping first and last letter, masking the rest with *
+   */
+  maskName(name: string): string {
+    if (!name) return '';
+    return name
+      .trim()
+      .split(/(\s+)/)
+      .map((word) => {
+        if (!word.trim()) return word;
+        if (word.length <= 2) return word[0] + '*';
+        return word[0] + '*'.repeat(word.length - 2) + word[word.length - 1];
+      })
+      .join('');
+  }
+
+  /**
+   * Mask external id, mobile, etc (show only first char, rest as *)
+   */
+  maskValue(val: string): string {
+    if (!val) return '';
+    if (val.length <= 2) return val[0] + '*';
+    return val[0] + '*'.repeat(val.length - 1);
+  }
+
+  /**
+   * Mask email: v********@f*******
+   */
+  maskEmail(email: string): string {
+    if (!email) return '';
+    const [
+      user,
+      domain
+    ] = email.split('@');
+    if (!user || !domain || user.length < 1) return this.maskValue(email);
+    let maskedUser = user.length > 1 ? user[0] + '*'.repeat(user.length - 1) : user[0] + '*';
+    const domainLabel = domain.split('.')[0] || '';
+    const domainMaskLen = Math.max(0, domainLabel.length - 1);
+    let maskedDomain = domainLabel.length > 0 ? domainLabel[0] + '*'.repeat(domainMaskLen) : '';
+    let domainRest = '';
+    if (domain.length > domainLabel.length) {
+      domainRest = domain.substring(domainLabel.length);
+    }
+    if (!maskedDomain) return this.maskValue(email);
+    return maskedUser + '@' + maskedDomain + domainRest;
+  }
   formatTabLabel(label: string): string {
     return formatTabLabel(label);
   }