feat: add RBI circulars, CKYC, KYC, Superset analytics, passbook modules and UI updates

Add new feature modules (RBI feeds, CKYC, KYC tab, Form60, Superset analytics, passbook),
update client family members, dashboard, login page, sidenav, images, translations,
environment config, and fix RBI feeds API auth by using relative URLs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.html

@@ -8,83 +8,31 @@
 
 <div class="add-family-member-container">
   <form [formGroup]="addFamilyMemberForm" (ngSubmit)="submit()">
+    <h3>{{ 'labels.heading.Nominee Details (DA1 / DA5)' | translate }}</h3>
+
     <div class="layout-row-wrap responsive-column align-start-center">
+      <!-- Nomination Type -->
       <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.First Name' | translate }}</mat-label>
-        <input
-          formControlName="firstName"
-          required
-          matInput
-          [attr.aria-label]="'labels.inputs.First Name' | translate"
-          placeholder="{{ 'labels.inputs.First Name' | translate }}"
-          [attr.title]="'labels.inputs.First Name' | translate"
-        />
+        <mat-label>{{ 'labels.inputs.Nomination Type' | translate }}</mat-label>
+        <mat-select formControlName="nominationType" required>
+          <mat-option value="DA1">{{ 'labels.inputs.DA1 - Add Nominee' | translate }}</mat-option>
+          <mat-option value="DA5">{{ 'labels.inputs.DA5 - Modify / Cancel Nominee' | translate }}</mat-option>
+        </mat-select>
+      </mat-form-field>
+
+      <!-- Nominee Name -->
+      <mat-form-field class="flex-50-minus-25px">
+        <mat-label>{{ 'labels.inputs.Nominee Name' | translate }}</mat-label>
+        <input formControlName="firstName" required matInput />
         @if (addFamilyMemberForm.controls.firstName.hasError('required')) {
           <mat-error>
-            {{ 'labels.inputs.First Name' | translate }} {{ 'labels.commons.is' | translate }}
+            {{ 'labels.inputs.Nominee Name' | translate }} {{ 'labels.commons.is' | translate }}
             <strong>{{ 'labels.commons.required' | translate }}</strong>
           </mat-error>
         }
       </mat-form-field>
 
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Middle Name' | translate }}</mat-label>
-        <input
-          formControlName="middleName"
-          matInput
-          [attr.aria-label]="'labels.inputs.Middle Name' | translate"
-          placeholder="{{ 'labels.inputs.Middle Name' | translate }}"
-          [attr.title]="'labels.inputs.Middle Name' | translate"
-        />
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Last Name' | translate }}</mat-label>
-        <input
-          formControlName="lastName"
-          required
-          matInput
-          [attr.aria-label]="'labels.inputs.Last Name' | translate"
-          placeholder="{{ 'labels.inputs.Last Name' | translate }}"
-          [attr.title]="'labels.inputs.Last Name' | translate"
-        />
-        @if (addFamilyMemberForm.controls.lastName.hasError('required')) {
-          <mat-error>
-            {{ 'labels.inputs.Last Name' | translate }} {{ 'labels.commons.is' | translate }}
-            <strong>{{ 'labels.commons.required' | translate }}</strong>
-          </mat-error>
-        }
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Qualification' | translate }}</mat-label>
-        <input
-          formControlName="qualification"
-          matInput
-          [attr.aria-label]="'labels.inputs.Qualification' | translate"
-          placeholder="{{ 'labels.inputs.Qualification' | translate }}"
-          [attr.title]="'labels.inputs.Qualification' | translate"
-        />
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Age' | translate }}</mat-label>
-        <input
-          type="number"
-          formControlName="age"
-          matInput
-          [min]="minAge"
-          disabled
-          [attr.aria-label]="'labels.inputs.Age' | translate"
-          placeholder="{{ 'labels.inputs.Age' | translate }}"
-          [attr.title]="'labels.inputs.Age' | translate"
-        />
-      </mat-form-field>
-
-      <mat-checkbox formControlName="isDependent" labelPosition="before" class="flex-50-minus-25px">
-        {{ 'labels.inputs.Is Dependent' | translate }}?
-      </mat-checkbox>
-
+      <!-- Relationship -->
       <mat-form-field class="flex-50-minus-25px">
         <mat-label>{{ 'labels.inputs.Relationship' | translate }}</mat-label>
         <mat-select formControlName="relationshipId" required>
@@ -102,46 +50,8 @@
         }
       </mat-form-field>
 
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Gender' | translate }}</mat-label>
-        <mat-select formControlName="genderId" required>
-          @for (gender of addFamilyMemberTemplate.genderIdOptions; track gender) {
-            <mat-option [value]="gender.id">
-              {{ gender.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-        @if (addFamilyMemberForm.controls.genderId.hasError('required')) {
-          <mat-error>
-            {{ 'labels.inputs.Gender' | translate }} {{ 'labels.commons.is' | translate }}
-            <strong>{{ 'labels.commons.required' | translate }}</strong>
-          </mat-error>
-        }
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Profession' | translate }}</mat-label>
-        <mat-select formControlName="professionId">
-          @for (profession of addFamilyMemberTemplate.professionIdOptions; track profession) {
-            <mat-option [value]="profession.id">
-              {{ profession.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Marital Status' | translate }}</mat-label>
-        <mat-select formControlName="maritalStatusId">
-          @for (maritalStatus of addFamilyMemberTemplate.maritalStatusIdOptions; track maritalStatus) {
-            <mat-option [value]="maritalStatus.id">
-              {{ maritalStatus.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-      </mat-form-field>
-
-      <mat-form-field class="flex-fill" (click)="dueDatePicker.open()">
+      <!-- Date of Birth -->
+      <mat-form-field class="flex-50-minus-25px" (click)="dueDatePicker.open()">
         <mat-label>{{ 'labels.inputs.Date Of Birth' | translate }}</mat-label>
         <input
           formControlName="dateOfBirth"
@@ -149,12 +59,45 @@
           [max]="maxDate"
           [matDatepicker]="dueDatePicker"
           placeholder="{{ 'labels.text.Optional' | translate }}"
-          [attr.aria-label]="'labels.inputs.Date Of Birth' | translate"
-          [attr.title]="'labels.inputs.Date Of Birth' | translate"
         />
         <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
         <mat-datepicker #dueDatePicker></mat-datepicker>
       </mat-form-field>
+
+      <!-- Percentage Share -->
+      <mat-form-field class="flex-50-minus-25px">
+        <mat-label>{{ 'labels.inputs.Percentage Share' | translate }} (%)</mat-label>
+        <input type="number" formControlName="percentageShare" matInput min="0" max="100" />
+      </mat-form-field>
+
+      <!-- Nominee is Minor -->
+      <mat-checkbox formControlName="isDependent" labelPosition="before" class="flex-50-minus-25px">
+        {{ 'labels.inputs.Nominee is Minor' | translate }}?
+      </mat-checkbox>
+    </div>
+
+    <!-- Guardian Details (shown when minor) -->
+    @if (addFamilyMemberForm.get('isDependent').value) {
+      <h3>{{ 'labels.heading.Guardian Details (If Minor)' | translate }}</h3>
+      <div class="layout-row-wrap responsive-column align-start-center">
+        <mat-form-field class="flex-50-minus-25px">
+          <mat-label>{{ 'labels.inputs.Guardian Name' | translate }}</mat-label>
+          <input formControlName="guardianName" matInput />
+        </mat-form-field>
+
+        <mat-form-field class="flex-50-minus-25px">
+          <mat-label>{{ 'labels.inputs.Relationship with Minor' | translate }}</mat-label>
+          <input formControlName="guardianRelationship" matInput />
+        </mat-form-field>
+      </div>
+    }
+
+    <!-- Remarks -->
+    <div class="layout-row-wrap responsive-column align-start-center">
+      <mat-form-field class="flex-fill">
+        <mat-label>{{ 'labels.inputs.Remarks' | translate }}</mat-label>
+        <input formControlName="remarks" matInput />
+      </mat-form-field>
     </div>
 
     <div class="layout-row gap-32px layout-align-center">

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.ts

@@ -40,8 +40,6 @@ export class AddFamilyMemberComponent implements OnInit {
 
   /** Maximum Due Date allowed. */
   maxDate = new Date();
-  /** Minimum age allowed is 0. */
-  minAge = 0;
   /** Add family member form. */
   addFamilyMemberForm: UntypedFormGroup;
   /** Add family member template. */
@@ -49,14 +47,6 @@ export class AddFamilyMemberComponent implements OnInit {
   /** Client ID */
   clientId: any;
 
-  /**
-   * @param {FormBuilder} formBuilder FormBuilder
-   * @param {Dates} dateUtils Date Utils
-   * @param {Router} router Router
-   * @param {Route} route Route
-   * @param {ClientsService} clientsService Clients Service
-   * @param {SettingsService} settingsService Setting service
-   */
   constructor() {
     this.route.data.subscribe((data: { clientTemplate: any }) => {
       this.addFamilyMemberTemplate = data.clientTemplate.familyMemberOptions;
@@ -67,91 +57,39 @@ export class AddFamilyMemberComponent implements OnInit {
   ngOnInit() {
     this.maxDate = this.settingsService.businessDate;
     this.createAddFamilyMemberForm();
-    this.addFamilyMemberForm.get('dateOfBirth').valueChanges.subscribe((dateOfBirth: any) => {
-      if (dateOfBirth) {
-        const age = this.calculateAge(dateOfBirth);
-        this.addFamilyMemberForm.get('age').setValue(age);
-      } else {
-        this.addFamilyMemberForm.get('age').setValue('');
-      }
-    });
   }
 
-  /**
-   * Calculates age from date of birth
-   * @param {Date} dateOfBirth Date of Birth
-   * @returns {number} Age
-   */
-  calculateAge(dateOfBirth: Date): number {
-    const today = new Date(this.settingsService.businessDate);
-    const birthDate = new Date(dateOfBirth);
-    let age = today.getFullYear() - birthDate.getFullYear();
-    const monthDiff = today.getMonth() - birthDate.getMonth();
-
-    if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthDate.getDate())) {
-      age--;
-    }
-
-    return age;
-  }
-
-  /**
-   * Creates the add family member form
-   */
   createAddFamilyMemberForm() {
     this.addFamilyMemberForm = this.formBuilder.group({
+      nominationType: ['DA1'],
       firstName: [
         '',
         Validators.required
       ],
-      middleName: [''],
-      lastName: [
-        '',
-        Validators.required
-      ],
-      qualification: [''],
-      age: [
-        { value: '', disabled: true }],
-      isDependent: [''],
       relationshipId: [
         '',
         Validators.required
       ],
-      genderId: [
-        '',
-        Validators.required
-      ],
-      professionId: [''],
-      maritalStatusId: [''],
-      dateOfBirth: ['']
+      dateOfBirth: [''],
+      percentageShare: [100],
+      isDependent: [false],
+      guardianName: [''],
+      guardianRelationship: [''],
+      remarks: ['']
     });
   }
 
-  /**
-   * Submits the form and adds the family member
-   */
   submit() {
-    // Get form values including disabled controls like age
-    const formValue = {
-      ...this.addFamilyMemberForm.getRawValue()
-    };
+    const formValue = { ...this.addFamilyMemberForm.value };
 
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    const prevDateOfBirth: Date = formValue.dateOfBirth;
 
-    // Calculate age from dateOfBirth if present
-    if (prevDateOfBirth) {
+    if (formValue.dateOfBirth) {
       if (formValue.dateOfBirth instanceof Date) {
-        formValue.dateOfBirth = this.dateUtils.formatDate(prevDateOfBirth, dateFormat);
-      }
-      // Ensure age is calculated even if it wasn't already
-      if (!formValue.age && prevDateOfBirth) {
-        formValue.age = this.calculateAge(prevDateOfBirth);
+        formValue.dateOfBirth = this.dateUtils.formatDate(formValue.dateOfBirth, dateFormat);
       }
     } else {
-      // If no date of birth, remove age and dateOfBirth from submission
-      delete formValue.age;
       delete formValue.dateOfBirth;
     }
 

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.html

@@ -8,48 +8,31 @@
 
 <div class="add-family-member-container">
   <form [formGroup]="editFamilyMemberForm" (ngSubmit)="submit()">
+    <h3>{{ 'labels.heading.Nominee Details (DA1 / DA5)' | translate }}</h3>
+
     <div class="layout-row-wrap responsive-column align-start-center">
+      <!-- Nomination Type -->
       <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.First Name' | translate }}</mat-label>
+        <mat-label>{{ 'labels.inputs.Nomination Type' | translate }}</mat-label>
+        <mat-select formControlName="nominationType" required>
+          <mat-option value="DA1">{{ 'labels.inputs.DA1 - Add Nominee' | translate }}</mat-option>
+          <mat-option value="DA5">{{ 'labels.inputs.DA5 - Modify / Cancel Nominee' | translate }}</mat-option>
+        </mat-select>
+      </mat-form-field>
+
+      <!-- Nominee Name -->
+      <mat-form-field class="flex-50-minus-25px">
+        <mat-label>{{ 'labels.inputs.Nominee Name' | translate }}</mat-label>
         <input formControlName="firstName" required matInput />
         @if (editFamilyMemberForm.controls.firstName.hasError('required')) {
           <mat-error>
-            {{ 'labels.inputs.First Name' | translate }} {{ 'labels.commons.is' | translate }}
+            {{ 'labels.inputs.Nominee Name' | translate }} {{ 'labels.commons.is' | translate }}
             <strong>{{ 'labels.commons.required' | translate }}</strong>
           </mat-error>
         }
       </mat-form-field>
 
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Middle Name' | translate }}</mat-label>
-        <input formControlName="middleName" matInput />
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Last Name' | translate }}</mat-label>
-        <input formControlName="lastName" required matInput />
-        @if (editFamilyMemberForm.controls.lastName.hasError('required')) {
-          <mat-error>
-            {{ 'labels.inputs.Last Name' | translate }} {{ 'labels.commons.is' | translate }}
-            <strong>{{ 'labels.commons.required' | translate }}</strong>
-          </mat-error>
-        }
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Qualification' | translate }}</mat-label>
-        <input formControlName="qualification" matInput />
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Age' | translate }}</mat-label>
-        <input type="number" formControlName="age" matInput disabled />
-      </mat-form-field>
-
-      <mat-checkbox formControlName="isDependent" labelPosition="before" class="flex-50-minus-25px">
-        {{ 'labels.inputs.Is Dependent' | translate }}
-      </mat-checkbox>
-
+      <!-- Relationship -->
       <mat-form-field class="flex-50-minus-25px">
         <mat-label>{{ 'labels.inputs.Relationship' | translate }}</mat-label>
         <mat-select formControlName="relationshipId" required>
@@ -67,46 +50,8 @@
         }
       </mat-form-field>
 
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Gender' | translate }}</mat-label>
-        <mat-select formControlName="genderId" required>
-          @for (gender of addFamilyMemberTemplate.genderIdOptions; track gender) {
-            <mat-option [value]="gender.id">
-              {{ gender.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-        @if (editFamilyMemberForm.controls.genderId.hasError('required')) {
-          <mat-error>
-            {{ 'labels.inputs.Gender' | translate }} {{ 'labels.commons.is' | translate }}
-            <strong>{{ 'labels.commons.required' | translate }}</strong>
-          </mat-error>
-        }
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Profession' | translate }}</mat-label>
-        <mat-select formControlName="professionId">
-          @for (profession of addFamilyMemberTemplate.professionIdOptions; track profession) {
-            <mat-option [value]="profession.id">
-              {{ profession.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-      </mat-form-field>
-
-      <mat-form-field class="flex-50-minus-25px">
-        <mat-label>{{ 'labels.inputs.Marital Status' | translate }}</mat-label>
-        <mat-select formControlName="maritalStatusId">
-          @for (maritalStatus of addFamilyMemberTemplate.maritalStatusIdOptions; track maritalStatus) {
-            <mat-option [value]="maritalStatus.id">
-              {{ maritalStatus.name | translateKey: 'catalogs' }}
-            </mat-option>
-          }
-        </mat-select>
-      </mat-form-field>
-
-      <mat-form-field class="flex-fill" (click)="dueDatePicker.open()">
+      <!-- Date of Birth -->
+      <mat-form-field class="flex-50-minus-25px" (click)="dueDatePicker.open()">
         <mat-label>{{ 'labels.inputs.Date Of Birth' | translate }}</mat-label>
         <input
           formControlName="dateOfBirth"
@@ -118,6 +63,41 @@
         <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
         <mat-datepicker #dueDatePicker></mat-datepicker>
       </mat-form-field>
+
+      <!-- Percentage Share -->
+      <mat-form-field class="flex-50-minus-25px">
+        <mat-label>{{ 'labels.inputs.Percentage Share' | translate }} (%)</mat-label>
+        <input type="number" formControlName="percentageShare" matInput min="0" max="100" />
+      </mat-form-field>
+
+      <!-- Nominee is Minor -->
+      <mat-checkbox formControlName="isDependent" labelPosition="before" class="flex-50-minus-25px">
+        {{ 'labels.inputs.Nominee is Minor' | translate }}?
+      </mat-checkbox>
+    </div>
+
+    <!-- Guardian Details (shown when minor) -->
+    @if (editFamilyMemberForm.get('isDependent').value) {
+      <h3>{{ 'labels.heading.Guardian Details (If Minor)' | translate }}</h3>
+      <div class="layout-row-wrap responsive-column align-start-center">
+        <mat-form-field class="flex-50-minus-25px">
+          <mat-label>{{ 'labels.inputs.Guardian Name' | translate }}</mat-label>
+          <input formControlName="guardianName" matInput />
+        </mat-form-field>
+
+        <mat-form-field class="flex-50-minus-25px">
+          <mat-label>{{ 'labels.inputs.Relationship with Minor' | translate }}</mat-label>
+          <input formControlName="guardianRelationship" matInput />
+        </mat-form-field>
+      </div>
+    }
+
+    <!-- Remarks -->
+    <div class="layout-row-wrap responsive-column align-start-center">
+      <mat-form-field class="flex-fill">
+        <mat-label>{{ 'labels.inputs.Remarks' | translate }}</mat-label>
+        <input formControlName="remarks" matInput />
+      </mat-form-field>
     </div>
 
     <div class="layout-row gap-32px layout-align-center">

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.ts

@@ -40,21 +40,13 @@ export class EditFamilyMemberComponent implements OnInit {
 
   /** Maximum Due Date allowed. */
   maxDate = new Date();
-  /** Add family member form. */
+  /** Edit family member form. */
   editFamilyMemberForm: UntypedFormGroup;
-  /** Add family member template. */
+  /** Family member template options. */
   addFamilyMemberTemplate: any;
   /** Family Members Details */
   familyMemberDetails: any;
 
-  /**
-   * @param {FormBuilder} formBuilder Form Builder
-   * @param {Dates} dateUtils Date Utils
-   * @param {Router} router Router
-   * @param {ActivatedRoute} route Route
-   * @param {ClientsService} clientsService Clients Service
-   * @param {SettingsService} settingsService Setting service
-   */
   constructor() {
     this.route.data.subscribe((data: { clientTemplate: any; editFamilyMember: any }) => {
       this.addFamilyMemberTemplate = data.clientTemplate.familyMemberOptions;
@@ -65,94 +57,41 @@ export class EditFamilyMemberComponent implements OnInit {
   ngOnInit() {
     this.maxDate = this.settingsService.businessDate;
     this.createEditFamilyMemberForm(this.familyMemberDetails);
-    this.editFamilyMemberForm.get('dateOfBirth').valueChanges.subscribe((dateOfBirth: any) => {
-      if (dateOfBirth) {
-        const age = this.calculateAge(dateOfBirth);
-        this.editFamilyMemberForm.get('age').setValue(age);
-      } else {
-        this.editFamilyMemberForm.get('age').setValue('');
-      }
-    });
   }
 
-  /**
-   * Calculates age from date of birth
-   * @param {Date} dateOfBirth Date of Birth
-   * @returns {number} Age
-   */
-  calculateAge(dateOfBirth: Date): number {
-    const today = new Date(this.settingsService.businessDate);
-    const birthDate = new Date(dateOfBirth);
-    let age = today.getFullYear() - birthDate.getFullYear();
-    const monthDiff = today.getMonth() - birthDate.getMonth();
-
-    if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birthDate.getDate())) {
-      age--;
-    }
-
-    return age;
-  }
-
-  /**
-   * Creates Edit Family Member Form
-   * @param {any} familyMember Family Member
-   */
   createEditFamilyMemberForm(familyMember: any) {
     this.editFamilyMemberForm = this.formBuilder.group({
+      nominationType: [familyMember.nominationType || 'DA1'],
       firstName: [
         familyMember.firstName,
         Validators.required
       ],
-      middleName: [familyMember.middleName],
-      lastName: [
-        familyMember.lastName,
-        Validators.required
-      ],
-      qualification: [familyMember.qualification],
-      age: [
-        { value: familyMember.age, disabled: true }],
-      isDependent: [familyMember.isDependent],
       relationshipId: [
         familyMember.relationshipId,
         Validators.required
       ],
-      genderId: [
-        familyMember.genderId,
-        Validators.required
-      ],
-      professionId: [familyMember.professionId],
-      maritalStatusId: [familyMember.maritalStatusId],
       dateOfBirth: [
         familyMember.dateOfBirth ? this.dateUtils.formatDate(familyMember.dateOfBirth, 'yyyy-MM-dd') : null
-      ]
+      ],
+      percentageShare: [familyMember.percentageShare ?? 100],
+      isDependent: [familyMember.isDependent || false],
+      guardianName: [familyMember.guardianName || ''],
+      guardianRelationship: [familyMember.guardianRelationship || ''],
+      remarks: [familyMember.remarks || '']
     });
   }
 
-  /**
-   * Submits the form and updates the client family member.
-   */
   submit() {
-    // Get form values including disabled controls like age
-    const formValue = {
-      ...this.editFamilyMemberForm.getRawValue()
-    };
+    const formValue = { ...this.editFamilyMemberForm.value };
 
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    const prevDateOfBirth: Date = formValue.dateOfBirth;
 
-    // Calculate age from dateOfBirth if present
-    if (prevDateOfBirth) {
+    if (formValue.dateOfBirth) {
       if (formValue.dateOfBirth instanceof Date) {
-        formValue.dateOfBirth = this.dateUtils.formatDate(prevDateOfBirth, dateFormat);
-      }
-      // Ensure age is calculated even if it wasn't already
-      if (!formValue.age && prevDateOfBirth) {
-        formValue.age = this.calculateAge(prevDateOfBirth);
+        formValue.dateOfBirth = this.dateUtils.formatDate(formValue.dateOfBirth, dateFormat);
       }
     } else {
-      // If no date of birth, remove age and dateOfBirth from submission
-      delete formValue.age;
       delete formValue.dateOfBirth;
     }
 

src/app/clients/clients-view/family-members-tab/family-members-tab.component.html

@@ -51,39 +51,35 @@
             </button>
           </div>
           <p>
+            @if (member.nominationType) {
+              <span>{{ 'labels.inputs.Nomination Type' | translate }} : {{ member.nominationType }}<br /></span>
+            }
             @if (member.firstName) {
-              <span>{{ 'labels.inputs.First Name' | translate }} : {{ member.firstName }}<br /></span>
+              <span>{{ 'labels.inputs.Nominee Name' | translate }} : {{ member.firstName }}<br /></span>
             }
-            @if (member.middleName) {
-              <span>{{ 'labels.inputs.Middle Name' | translate }} : {{ member.middleName }}<br /></span>
-            }
-            @if (member.lastName) {
-              <span>{{ 'labels.inputs.Last Name' | translate }} : {{ member.lastName }}<br /></span>
-            }
-            @if (member.qualification) {
-              <span>{{ 'labels.inputs.Qualification' | translate }} : {{ member.qualification }}<br /></span>
-            }
-            @if (member.mobileNumber) {
-              <span>{{ 'labels.inputs.Mobile Number' | translate }} : {{ member.mobileNumber }}<br /></span>
-            }
-            @if (member.age) {
-              <span>{{ 'labels.inputs.Age' | translate }} : {{ member.age }}<br /></span>
-            }
-            @if (member.isDependent) {
-              <span>{{ 'labels.inputs.Is Dependent' | translate }} : {{ member.isDependent | yesNo }}<br /></span>
-            }
-            @if (member.maritalStatus) {
-              <span>{{ 'labels.inputs.Marital Status' | translate }} : {{ member.maritalStatus }}<br /></span>
-            }
-            @if (member.gender) {
-              <span>{{ 'labels.inputs.Gender' | translate }} : {{ member.gender }}<br /></span>
-            }
-            @if (member.profession) {
-              <span>{{ 'labels.inputs.Profession' | translate }} : {{ member.profession }}<br /></span>
+            @if (member.relationship) {
+              <span>{{ 'labels.inputs.Relationship' | translate }} : {{ member.relationship }}<br /></span>
             }
             @if (member.dateOfBirth) {
               <span>{{ 'labels.inputs.Date Of Birth' | translate }} : {{ member.dateOfBirth | dateFormat }}<br /></span>
             }
+            @if (member.percentageShare != null) {
+              <span>{{ 'labels.inputs.Percentage Share' | translate }} : {{ member.percentageShare }}%<br /></span>
+            }
+            @if (member.isDependent) {
+              <span>{{ 'labels.inputs.Nominee is Minor' | translate }} : {{ member.isDependent | yesNo }}<br /></span>
+            }
+            @if (member.guardianName) {
+              <span>{{ 'labels.inputs.Guardian Name' | translate }} : {{ member.guardianName }}<br /></span>
+            }
+            @if (member.guardianRelationship) {
+              <span
+                >{{ 'labels.inputs.Relationship with Minor' | translate }} : {{ member.guardianRelationship }}<br
+              /></span>
+            }
+            @if (member.remarks) {
+              <span>{{ 'labels.inputs.Remarks' | translate }} : {{ member.remarks }}<br /></span>
+            }
           </p>
         </mat-expansion-panel>
       }

src/app/clients/clients-view/family-members-tab/family-members-tab.component.ts

@@ -74,7 +74,7 @@ export class FamilyMembersTabComponent {
    */
   deleteFamilyMember(clientId: string, id: string, name: string, index: number) {
     const deleteFamilyMemberDialogRef = this.dialog.open(DeleteDialogComponent, {
-      data: { deleteContext: `Family member id:${id} name : ${name} ${index}` }
+      data: { deleteContext: `Nominee id:${id} name : ${name}` }
     });
     deleteFamilyMemberDialogRef.afterClosed().subscribe((response: any) => {
       if (response.delete) {
@@ -86,13 +86,6 @@ export class FamilyMembersTabComponent {
   }
 
   displayName(member: any): string {
-    let fullName: string = member.firstName;
-    if (member.middleName) {
-      fullName = fullName + ' ' + member.middleName;
-    }
-    if (member.lastName) {
-      fullName = fullName + ' ' + member.lastName;
-    }
-    return fullName;
+    return member.firstName || '';
   }
 }