WEB-521 fix(i18n): add missing translations and apply translate pipes across …

src/app/account-transfers/list-standing-instructions/list-standing-instructions.component.html

@@ -16,10 +16,10 @@ <h3 class="mat-h3">{{ clientName }}</h3>
     @if (!isFromClient) {
       <div class="flex-fill">
         <mat-form-field class="flex-30">
-          <input matInput placeholder="ClientName" [formControl]="clientNameControl" />
+          <input matInput placeholder="{{ 'labels.text.ClientName' | translate }}" [formControl]="clientNameControl" />
         </mat-form-field>
         <mat-form-field class="flex-30">
-          <input matInput placeholder="From Client Id" [formControl]="fromClientId" />
+          <input matInput placeholder="{{ 'labels.text.FromClientId' | translate }}" [formControl]="fromClientId" />
         </mat-form-field>
       </div>
     }
@@ -38,7 +38,7 @@ <h3 class="mat-h3">{{ clientName }}</h3>
     </mat-form-field>
 
     <mat-form-field class="account-Id-field">
-      <input matInput placeholder="From Account Id" [formControl]="fromAccountId" />
+      <input matInput placeholder="{{ 'labels.text.FromAccountId' | translate }}" [formControl]="fromAccountId" />
     </mat-form-field>
 
     <button

src/app/account-transfers/make-account-transfers/make-account-transfers.component.html

@@ -57,7 +57,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transferred To' |
                   [(ngModel)]="phoneAccount"
                   maxlength="10"
                   required
-                  placeholder="Enter phone number"
+                  placeholder="{{ 'labels.text.EnterPhoneNumber' | translate }}"
                   title="Phone number"
                 />
                 <mat-hint align="end">{{ phoneAccount.length || 0 }}/10</mat-hint>
@@ -99,7 +99,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   [matDatepicker]="transferDatePicker"
                   required
                   formControlName="transferDate"
-                  placeholder="Select date"
+                  placeholder="{{ 'labels.text.SelectDate' | translate }}"
                   title="Transaction Date"
                 />
                 <mat-datepicker-toggle matSuffix [for]="transferDatePicker"></mat-datepicker-toggle>
@@ -133,7 +133,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   matInput
                   formControlName="toClientId"
                   [matAutocomplete]="clientsAutocomplete"
-                  placeholder="Select or type client name"
+                  placeholder="{{ 'labels.text.SelectOrTypeClientName' | translate }}"
                   title="Client name"
                 />
                 @if (makeAccountTransferForm.controls.toClientId.hasError('required')) {
@@ -191,7 +191,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   matInput
                   required
                   formControlName="transferAmount"
-                  placeholder="Enter amount"
+                  placeholder="{{ 'labels.text.EnterAmount' | translate }}"
                   title="Transfer amount"
                   min="0.01"
                   step="0.01"
@@ -216,7 +216,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   formControlName="transferDescription"
                   cdkTextareaAutosize
                   cdkAutosizeMinRows="2"
-                  placeholder="Enter transfer description"
+                  placeholder="{{ 'labels.text.EnterTransferDescription' | translate }}"
                   title="Transfer description"
                 ></textarea>
                 @if (makeAccountTransferForm.controls.transferDescription.hasError('required')) {
@@ -243,7 +243,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   [matDatepicker]="transferDatePicker"
                   required
                   formControlName="transferDate"
-                  placeholder="Select date"
+                  placeholder="{{ 'labels.text.SelectDate' | translate }}"
                   title="Transaction Date"
                 />
                 <mat-datepicker-toggle matSuffix [for]="transferDatePicker"></mat-datepicker-toggle>
@@ -257,25 +257,43 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
               </mat-form-field>
               <mat-form-field class="form-field">
                 <mat-label>{{ 'labels.inputs.Bank' | translate }}</mat-label>
-                <input matInput formControlName="toBank" [readonly]="true" placeholder="Bank" title="Bank" />
+                <input
+                  matInput
+                  formControlName="toBank"
+                  [readonly]="true"
+                  placeholder="{{ 'labels.inputs.Bank' | translate }}"
+                  title="Bank"
+                />
               </mat-form-field>
               <mat-form-field class="form-field">
                 <mat-label>{{ 'labels.inputs.Client' | translate }}</mat-label>
-                <input matInput formControlName="toClientId" [readonly]="true" placeholder="Client" title="Client" />
+                <input
+                  matInput
+                  formControlName="toClientId"
+                  [readonly]="true"
+                  placeholder="{{ 'labels.inputs.Client' | translate }}"
+                  title="Client"
+                />
               </mat-form-field>
               <mat-form-field class="form-field">
                 <mat-label>{{ 'labels.inputs.Account Type' | translate }}</mat-label>
                 <input
                   matInput
                   formControlName="toAccountType"
                   [readonly]="true"
-                  placeholder="Account Type"
+                  placeholder="{{ 'labels.inputs.Account Type' | translate }}"
                   title="Account Type"
                 />
               </mat-form-field>
               <mat-form-field class="form-field">
                 <mat-label>{{ 'labels.inputs.Account' | translate }}</mat-label>
-                <input matInput formControlName="toAccountId" [readonly]="true" placeholder="Account" title="Account" />
+                <input
+                  matInput
+                  formControlName="toAccountId"
+                  [readonly]="true"
+                  placeholder="{{ 'labels.inputs.Account' | translate }}"
+                  title="Account"
+                />
               </mat-form-field>
               <mat-form-field class="form-field">
                 <mat-label>{{ 'labels.inputs.Amount' | translate }}</mat-label>
@@ -284,7 +302,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   matInput
                   required
                   formControlName="transferAmount"
-                  placeholder="Enter amount"
+                  placeholder="{{ 'labels.text.EnterAmount' | translate }}"
                   title="Transfer amount"
                   min="0.01"
                   step="0.01"
@@ -314,7 +332,7 @@ <h3 class="section-title transfer-heading">{{ 'labels.heading.Transfer Details'
                   formControlName="transferDescription"
                   cdkTextareaAutosize
                   cdkAutosizeMinRows="2"
-                  placeholder="Enter transfer description"
+                  placeholder="{{ 'labels.text.EnterTransferDescription' | translate }}"
                   title="Transfer description"
                 ></textarea>
                 @if (makeAccountTransferForm.controls.transferDescription.hasError('required')) {

src/app/accounting/search-journal-entry/search-journal-entry.component.html

@@ -18,7 +18,7 @@
     <mat-select [formControl]="entryTypeFilter" (selectionChange)="applyFilter($event.value, 'manualEntriesOnly')">
       @for (filter of entryTypeFilterData; track filter) {
         <mat-option [value]="filter.value">
-          {{ filter.option }}
+          {{ filter.option | translate }}
         </mat-option>
       }
     </mat-select>

src/app/accounting/search-journal-entry/search-journal-entry.component.ts

@@ -93,15 +93,15 @@ export class SearchJournalEntryComponent implements OnInit, AfterViewInit {
   /** Entry type filter data. */
   entryTypeFilterData = [
     {
-      option: 'All',
+      option: 'labels.inputs.All',
       value: ''
     },
     {
-      option: 'Manual Entries',
+      option: 'labels.inputs.Manual Entries',
       value: true
     },
     {
-      option: 'System Entries',
+      option: 'labels.inputs.System Entries',
       value: false // Bug: unable to implement from server side
     }
   ];

src/app/centers/centers.component.html

@@ -2,10 +2,10 @@
   <div class="layout-column layout-gt-sm-row align-gt-sm-start-center">
     <div class="search-box m-r-30">
       <mat-form-field class="search-box">
-        <input matInput placeholder="Search by Name" [formControl]="name" />
+        <input matInput placeholder="{{ 'labels.text.SearchByName' | translate }}" [formControl]="name" />
       </mat-form-field>
       <mat-form-field class="search-box">
-        <input matInput placeholder="Search by ExternalID" [formControl]="externalId" />
+        <input matInput placeholder="{{ 'labels.text.SearchByExternalID' | translate }}" [formControl]="externalId" />
       </mat-form-field>
       <mat-checkbox #showClosedCenters labelPosition="after" (change)="changeShowClosedCenters()" class="m-r-10">
         {{ 'labels.inputs.Show Closed Centers' | translate }}

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

@@ -106,7 +106,7 @@ <h1 mat-dialog-title>{{ data.context }} {{ 'labels.heading.Family Member' | tran
         matInput
         [max]="maxDate"
         [matDatepicker]="dueDatePicker"
-        placeholder="Optional"
+        placeholder="{{ 'labels.text.Optional' | translate }}"
       />
       <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
       <mat-datepicker #dueDatePicker></mat-datepicker>

src/app/clients/clients-view/custom-dialogs/edit-notes-dialog/edit-notes-dialog.component.html

@@ -2,7 +2,7 @@ <h1 mat-dialog-title>{{ 'labels.heading.Edit Note' | translate }}</h1>
 <div>
   <form #formRef="ngForm" [formGroup]="noteForm">
     <mat-form-field>
-      <textarea formControlName="note" matInput placeholder="Write a note ...."></textarea>
+      <textarea formControlName="note" matInput placeholder="{{ 'labels.text.Write a note' | translate }}"></textarea>
     </mat-form-field>
     <mat-dialog-actions align="end">
       <button mat-raised-button mat-dialog-close>{{ 'labels.buttons.Cancel' | translate }}</button>

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

@@ -7,9 +7,9 @@
           formControlName="firstName"
           required
           matInput
-          aria-label="First Name"
-          placeholder="First Name"
-          title="First Name"
+          [attr.aria-label]="'labels.inputs.First Name' | translate"
+          placeholder="{{ 'labels.inputs.First Name' | translate }}"
+          [attr.title]="'labels.inputs.First Name' | translate"
         />
         @if (addFamilyMemberForm.controls.firstName.hasError('required')) {
           <mat-error>
@@ -24,9 +24,9 @@
         <input
           formControlName="middleName"
           matInput
-          aria-label="Middle Name"
-          placeholder="Middle Name"
-          title="Middle Name"
+          [attr.aria-label]="'labels.inputs.Middle Name' | translate"
+          placeholder="{{ 'labels.inputs.Middle Name' | translate }}"
+          [attr.title]="'labels.inputs.Middle Name' | translate"
         />
       </mat-form-field>
 
@@ -36,9 +36,9 @@
           formControlName="lastName"
           required
           matInput
-          aria-label="Last Name"
-          placeholder="Last Name"
-          title="Last Name"
+          [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>
@@ -53,9 +53,9 @@
         <input
           formControlName="qualification"
           matInput
-          aria-label="Qualification"
-          placeholder="Qualification"
-          title="Qualification"
+          [attr.aria-label]="'labels.inputs.Qualification' | translate"
+          placeholder="{{ 'labels.inputs.Qualification' | translate }}"
+          [attr.title]="'labels.inputs.Qualification' | translate"
         />
       </mat-form-field>
 
@@ -67,9 +67,9 @@
           matInput
           [min]="minAge"
           disabled
-          aria-label="Age"
-          placeholder="Age"
-          title="Age"
+          [attr.aria-label]="'labels.inputs.Age' | translate"
+          placeholder="{{ 'labels.inputs.Age' | translate }}"
+          [attr.title]="'labels.inputs.Age' | translate"
         />
       </mat-form-field>
 
@@ -140,9 +140,9 @@
           matInput
           [max]="maxDate"
           [matDatepicker]="dueDatePicker"
-          placeholder="Optional"
-          aria-label="Date Of Birth"
-          title="Date Of Birth"
+          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>

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

@@ -105,7 +105,7 @@
           matInput
           [max]="maxDate"
           [matDatepicker]="dueDatePicker"
-          placeholder="Optional"
+          placeholder="{{ 'labels.text.Optional' | translate }}"
         />
         <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
         <mat-datepicker #dueDatePicker></mat-datepicker>

src/app/clients/clients.component.html

@@ -4,7 +4,7 @@
       <mat-form-field class="search-box">
         <input
           matInput
-          placeholder="Search by client name, external Id, mobile"
+          placeholder="{{ 'labels.text.SearchByClient' | translate }}"
           class="search-box"
           (keydown.enter)="search($event.target.value)"
         />