add missed trnaslation for client-stepper file inside clients modlue

src/app/clients/client-stepper/client-family-members-step/client-family-member-dialog/client-family-member-dialog.component.html

@@ -44,7 +44,7 @@
       <mat-label>{{"labels.inputs.Relationship" | translate}}</mat-label>
       <mat-select formControlName="relationshipId" required>
         <mat-option *ngFor="let relation of data.options.relationshipIdOptions" [value]="relation.id">
-          {{ relation.name  }}
+          {{ relation.name | translateKey:'catalogs' }}
         </mat-option>
       </mat-select>
       <mat-error *ngIf="familyMemberForm.controls.relationshipId.hasError('required')">
@@ -56,7 +56,7 @@
       <mat-label>{{"labels.inputs.Gender" | translate}}</mat-label>
       <mat-select formControlName="genderId" required>
         <mat-option *ngFor="let gender of data.options.genderIdOptions" [value]="gender.id">
-          {{ gender.name }}
+          {{ gender.name | translateKey:'catalogs' }}
         </mat-option>
       </mat-select>
       <mat-error *ngIf="familyMemberForm.controls.genderId.hasError('required')">
@@ -68,7 +68,7 @@
       <mat-label>{{"labels.inputs.Profession" | translate}}</mat-label>
       <mat-select formControlName="professionId">
         <mat-option *ngFor="let profession of data.options.professionIdOptions" [value]="profession.id">
-          {{ profession.name }}
+          {{ profession.name | translateKey:'catalogs' }}
         </mat-option>
       </mat-select>
     </mat-form-field>
@@ -78,7 +78,7 @@
       <mat-select formControlName="maritalStatusId">
         <mat-option *ngFor="let maritalStatus of data.options.maritalStatusIdOptions"
           [value]="maritalStatus.id">
-          {{ maritalStatus.name }}
+          {{ maritalStatus.name | translateKey:'catalogs' }}
         </mat-option>
       </mat-select>
     </mat-form-field>

src/app/clients/client-stepper/client-family-members-step/client-family-members-step.component.ts

@@ -3,6 +3,7 @@ import { Component, Input } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 
 /** Custom Components */
+import { TranslateService } from '@ngx-translate/core';
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
 import { ClientFamilyMemberDialogComponent } from './client-family-member-dialog/client-family-member-dialog.component';
 
@@ -23,8 +24,10 @@ export class ClientFamilyMembersStepComponent {
 
   /**
    * @param {MatDialog} dialog Mat Dialog
+   * @param {TranslateService} translateService Translate Service.
    */
-  constructor(public dialog: MatDialog) { }
+  constructor(public dialog: MatDialog,
+              private translateService: TranslateService) { }
 
   /**
    * Adds a family member.
@@ -32,7 +35,7 @@ export class ClientFamilyMembersStepComponent {
   addFamilyMember() {
     const addFamilyMemberDialogRef = this.dialog.open(ClientFamilyMemberDialogComponent, {
       data: {
-        context: 'Add',
+        context: this.translateService.instant('labels.buttons.Add'),
         options: this.clientTemplate.familyMemberOptions,
       },
       width: '50rem'