From 6d653c35847fc448829a993d6dbdbe9b91083068 Mon Sep 17 00:00:00 2001
From: Omar-Nabil <omarabosalem66@gmail.com>
Date: Fri, 12 Jul 2024 09:19:51 +0300
Subject: [PATCH] transalte matTooltip

---
 .../create-floating-rate.component.html       | 18 +++++++--------
 .../edit-floating-rate.component.html         | 14 ++++++------
 .../loan-product-currency-step.component.html |  6 ++---
 .../loan-product-details-step.component.html  | 14 ++++++------
 .../loan-product-settings-step.component.html | 22 ++++++++-----------
 .../create-bucket.component.html              |  2 +-
 .../edit-bucket/edit-bucket.component.html    |  2 +-
 .../charges-tab/charges-tab.component.html    | 10 ++++-----
 8 files changed, 42 insertions(+), 46 deletions(-)

diff --git a/src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.html b/src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.html
index 27173eead..912309402 100644
--- a/src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.html
+++ b/src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.html
@@ -10,18 +10,18 @@
 
           <mat-form-field fxFlex="30%">
             <mat-label>{{'labels.inputs.Floating Rate Name' | translate}}</mat-label>
-            <input matInput required matTooltip="Unique name for the floating rate scheme." formControlName="name">
+            <input matInput required matTooltip="{{ 'tooltips.Unique name for the floating rate scheme' | translate}}" formControlName="name">
             <mat-error *ngIf="floatingRateForm.controls.name.hasError('required')">
               {{'labels.inputs.Floating Rate Name' | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
             </mat-error>
           </mat-form-field>
 
           <div class="checkbox-wrapper" fxFlex="30%">
-            <mat-checkbox formControlName="isBaseLendingRate" matTooltip="Check if this floating rate scheme is to be considered base lending rate for the organisation" class="checkbox" labelPosition="before">{{'labels.inputs.Is Base Lending Rate' | translate}}?</mat-checkbox>
+            <mat-checkbox formControlName="isBaseLendingRate" matTooltip="{{ 'tooltips.Base lending rate for the organisation' | translate}}" class="checkbox" labelPosition="before">{{'labels.inputs.Is Base Lending Rate' | translate}}?</mat-checkbox>
           </div>
 
           <div class="checkbox-wrapper" fxFlex="30%">
-            <mat-checkbox formControlName="isActive" matTooltip="Check if this floating rate scheme to be activated" class="checkbox" labelPosition="before">{{'labels.inputs.Active' | translate}}</mat-checkbox>
+            <mat-checkbox formControlName="isActive" matTooltip="{{ 'tooltips.Floating rate scheme to be activated' | translate}}" class="checkbox" labelPosition="before">{{'labels.inputs.Active' | translate}}</mat-checkbox>
           </div>
 
         </div>
@@ -34,7 +34,7 @@
 
         <div fxLayout="row wrap" fxLayoutGap="70%" fxLayoutGap.lt-md="0px" class="m-b-10" fxLayout.lt-md="column">
 
-          <p fxFlex="25%" class="mat-title">{{'labels.inputs.Floating Rate Periods' | translate}} <i class="fas fa-question" matTooltip="Floating interest rate and start date for this floating rate scheme"></i></p>
+          <p fxFlex="25%" class="mat-title">{{'labels.inputs.Floating Rate Periods' | translate}} <i class="fas fa-question" matTooltip="{{ 'tooltips.Floating interest rate and start date' | translate}}"></i></p>
 
           <button mat-mini-fab type="button" color="primary" (click)="addFloatingRatePeriod()">
             <fa-icon icon="plus"></fa-icon>
@@ -45,17 +45,17 @@
         <table mat-table [dataSource]="dataSource" matSort>
 
           <ng-container matColumnDef="fromDate">
-            <th mat-header-cell *matHeaderCellDef matTooltip="Interest effective from date" mat-sort-header> {{'labels.inputs.From Date' | translate}} </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Interest effective from date' | translate}}" mat-sort-header> {{'labels.inputs.From Date' | translate}} </th>
             <td mat-cell *matCellDef="let floatingRatePeriod"> {{ floatingRatePeriod.fromDate | dateFormat }} </td>
           </ng-container>
 
           <ng-container matColumnDef="interestRate">
-            <th mat-header-cell *matHeaderCellDef matTooltip="Annualised Interest rate" mat-sort-header> {{'labels.inputs.Interest Rate' | translate}} </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Annualised Interest rate' | translate}}" mat-sort-header> {{'labels.inputs.Interest Rate' | translate}} </th>
             <td mat-cell *matCellDef="let floatingRatePeriod"> {{ floatingRatePeriod.interestRate | formatNumber }} </td>
           </ng-container>
 
           <ng-container matColumnDef="isDifferential">
-            <th mat-header-cell *matHeaderCellDef matTooltip="If checked, Interest rate mentioned is added to base lending rate as of the from date of this period, absolute otherwise" mat-sort-header> {{'labels.inputs.Is Differential' | translate}}? </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Interest rate mentioned is added to base lending rate' | translate}}" mat-sort-header> {{'labels.inputs.Is Differential' | translate}}? </th>
             <td mat-cell *matCellDef="let floatingRate">
               <fa-icon *ngIf="floatingRate.isDifferentialToBaseLendingRate" icon="check-circle" size="lg"
                 class="is-differential" matTooltip="{{ 'tooltips.Yes' | translate }}" matTooltipPosition="right"></fa-icon>
@@ -67,11 +67,11 @@
           <ng-container matColumnDef="actions">
             <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Actions' | translate}} </th>
             <td mat-cell *matCellDef="let floatingRatePeriod" fxLayoutGap="15%">
-              <button type="button" fxFlex="8%" color="primary" mat-icon-button matTooltip="Edit Period" matTooltipPosition="left"
+              <button type="button" fxFlex="8%" color="primary" mat-icon-button matTooltip="{{ 'tooltips.Edit Period' | translate}}" matTooltipPosition="left"
                 (click)="editFloatingRatePeriod(floatingRatePeriod)">
                 <fa-icon icon="edit" size="lg"></fa-icon>
               </button>
-              <button type="button" fxFlex="8%" color="warn" mat-icon-button matTooltip="Remove Period" matTooltipPosition="right"
+              <button type="button" fxFlex="8%" color="warn" mat-icon-button matTooltip="{{ 'tooltips.Remove Period' | translate}}" matTooltipPosition="right"
                 (click)="deleteFloatingRatePeriod(floatingRatePeriod)">
                 <fa-icon icon="trash" size="lg"></fa-icon>
               </button>
diff --git a/src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.html b/src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.html
index 65e3c4186..0206ff2a4 100644
--- a/src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.html
+++ b/src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.html
@@ -10,20 +10,20 @@
 
           <mat-form-field fxFlex="25%">
             <mat-label>{{'labels.inputs.Floating Rate Name' | translate}}</mat-label>
-            <input matInput required matTooltip="Unique name for the floating rate scheme." formControlName="name">
+            <input matInput required matTooltip="{{ 'tooltips.Unique name for the floating rate scheme' | translate}}" formControlName="name">
             <mat-error *ngIf="floatingRateForm.controls.name.hasError('required')">
               {{'labels.inputs.Floating Rate Name' | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
             </mat-error>
           </mat-form-field>
 
           <div class="checkbox-wrapper" fxFlex="25%">
-            <mat-checkbox formControlName="isBaseLendingRate" matTooltip="Check if this floating rate scheme is to be considered base lending rate for the organisation" class="checkbox" labelPosition="before">
+            <mat-checkbox formControlName="isBaseLendingRate" matTooltip="{{ 'tooltips.Base lending rate for the organisation' | translate}}" class="checkbox" labelPosition="before">
               {{'labels.inputs.Is Base Lending Rate' | translate}}?
             </mat-checkbox>
           </div>
 
           <div class="checkbox-wrapper" fxFlex="15%">
-            <mat-checkbox formControlName="isActive" matTooltip="Check if this floating rate scheme to be activated" class="checkbox" labelPosition="before">
+            <mat-checkbox formControlName="isActive" matTooltip="{{ 'tooltips.Floating rate scheme to be activated' | translate}}" class="checkbox" labelPosition="before">
               {{'labels.inputs.Active' | translate}}
             </mat-checkbox>
           </div>
@@ -38,7 +38,7 @@
 
         <div fxLayout="row wrap" fxLayoutGap="70%" fxLayoutGap.lt-md="0px" class="m-b-10" fxLayout.lt-md="column">
 
-          <p fxFlex="25%" class="mat-title">{{'labels.inputs.Floating Rate Periods' | translate}} <i class="fas fa-question" matTooltip="Floating interest rate and start date for this floating rate scheme"></i></p>
+          <p fxFlex="25%" class="mat-title">{{'labels.inputs.Floating Rate Periods' | translate}} <i class="fas fa-question" matTooltip="{{ 'tooltips.Floating interest rate and start date for this floating rate scheme' | translate}}"></i></p>
 
           <button mat-mini-fab type="button" color="primary" (click)="addFloatingRatePeriod()">
             <fa-icon icon="plus"></fa-icon>
@@ -49,17 +49,17 @@
         <table mat-table [dataSource]="dataSource" matSort>
 
           <ng-container matColumnDef="fromDate">
-            <th mat-header-cell *matHeaderCellDef matTooltip="Interest effective from date" mat-sort-header> {{'labels.inputs.From Date' | translate}} </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Interest effective from date' | translate}}" mat-sort-header> {{'labels.inputs.From Date' | translate}} </th>
             <td mat-cell *matCellDef="let floatingRatePeriod"> {{ floatingRatePeriod.fromDate | dateFormat }} </td>
           </ng-container>
 
           <ng-container matColumnDef="interestRate">
-            <th mat-header-cell *matHeaderCellDef matTooltip="Annualised Interest rate" mat-sort-header> {{'labels.inputs.Interest Rate' | translate}} </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Annualised Interest rate' | translate}}" mat-sort-header> {{'labels.inputs.Interest Rate' | translate}} </th>
             <td mat-cell *matCellDef="let floatingRatePeriod"> {{ floatingRatePeriod.interestRate }} </td>
           </ng-container>
 
           <ng-container matColumnDef="isDifferential">
-            <th mat-header-cell *matHeaderCellDef matTooltip="If checked, Interest rate mentioned is added to base lending rate as of the from date of this period, absolute otherwise" mat-sort-header> {{'labels.inputs.Is Differential' | translate}}? </th>
+            <th mat-header-cell *matHeaderCellDef matTooltip="{{ 'tooltips.Interest rate mentioned is added to base lending rate' | translate}}" mat-sort-header> {{'labels.inputs.Is Differential' | translate}}? </th>
             <td mat-cell *matCellDef="let floatingRate">
               <fa-icon *ngIf="floatingRate.isDifferentialToBaseLendingRate" icon="check-circle" size="lg"
                 class="is-differential" matTooltip="{{ 'tooltips.Yes' | translate }}" matTooltipPosition="right"></fa-icon>
diff --git a/src/app/products/loan-products/loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component.html b/src/app/products/loan-products/loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component.html
index d3457133c..37b46d47b 100644
--- a/src/app/products/loan-products/loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component.html
+++ b/src/app/products/loan-products/loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component.html
@@ -4,7 +4,7 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>{{'labels.inputs.Currency' | translate}}</mat-label>
-      <mat-select formControlName="currencyCode" matTooltip="The currency in which the loan will be disbursed." required>
+      <mat-select formControlName="currencyCode" matTooltip="{{ 'tooltips.The currency in which the loan will be disbursed' | translate}}" required>
         <mat-option *ngFor="let currency of currencyData" [value]="currency.code">
           {{ currency.name }}
         </mat-option>
@@ -16,7 +16,7 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>{{'labels.inputs.Decimal Places' | translate}}</mat-label>
-      <input type="number" matTooltip="The number of decimal places to be used to track and report on loans." matInput formControlName="digitsAfterDecimal" required>
+      <input type="number" matTooltip="{{ 'tooltips.Number of decimal places to be used to track and report' | translate}}" matInput formControlName="digitsAfterDecimal" required>
       <mat-error>
         {{'labels.inputs.Decimal Places' | translate}} {{'labels.commons.is' | translate}} <strong>{{'labels.commons.required' | translate}}</strong>
       </mat-error>
@@ -24,7 +24,7 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>{{'labels.inputs.Currency in multiples of' | translate}}</mat-label>
-      <input type="number" matInput matTooltip="You can enter multiples of currency value. For example, if you put multiples of 100, the currency value will be rounded off to 200, 300, 400, etc." formControlName="inMultiplesOf">
+      <input type="number" matInput matTooltip="{{ 'tooltips.Enter multiples of currency value' | translate}}" formControlName="inMultiplesOf">
     </mat-form-field>
 
     <mat-form-field fxFlex="48%">
diff --git a/src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.html b/src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.html
index e649a96f1..544e6825d 100644
--- a/src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.html
+++ b/src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.html
@@ -4,7 +4,7 @@
 
     <mat-form-field fxFlex="72%">
       <mat-label>{{'labels.inputs.Product Name' | translate}}</mat-label>
-      <input matInput formControlName="name" matTooltip="The product name is a unique identifier for the lending product." required>
+      <input matInput formControlName="name" matTooltip="{{ 'tooltips.Product name is a unique identifier' | translate}}" required>
       <mat-error>
         {{'labels.inputs.Product Name' | translate}} {{'labels.commons.is' | translate}} <strong>{{'labels.commons.required' | translate}}</strong>
       </mat-error>
@@ -12,7 +12,7 @@
 
     <mat-form-field fxFlex="24%">
       <mat-label>{{'labels.inputs.Short Name' | translate}}</mat-label>
-      <input matInput formControlName="shortName" maxlength="4" matTooltip="The short name is a unique identifier for the lending product." required>
+      <input matInput formControlName="shortName" maxlength="4" matTooltip="{{ 'tooltips.Short name is a unique identifier' | translate}}" required>
       <mat-error>
         {{'labels.inputs.Short Name' | translate}} {{'labels.commons.is' | translate}} <strong>{{'labels.commons.required' | translate}}</strong>
       </mat-error>
@@ -20,34 +20,34 @@
 
     <mat-form-field fxFlex="48%">
       <mat-label>{{'labels.inputs.Fund' | translate}}</mat-label>
-      <mat-select matTooltip="Loan products may be assigned to a fund set up by your financial institution. If available, the fund field can be used for tracking and reporting on groups of loans." formControlName="fundId">
+      <mat-select matTooltip="{{ 'tooltips.Loan products may be assigned' | translate}}" formControlName="fundId">
         <mat-option *ngFor="let fund of fundData" [value]="fund.id">
           {{ fund.name }}
         </mat-option>
       </mat-select>
     </mat-form-field>
 
-    <mat-checkbox labelPosition="before" matTooltip="A borrower loan counter (cycle) is used for tracking how many time the client has taken this particular product." formControlName="includeInBorrowerCycle" fxFlex="48%">
+    <mat-checkbox labelPosition="before" matTooltip="{{ 'tooltips.A borrower loan counter (cycle)' | translate}}" formControlName="includeInBorrowerCycle" fxFlex="48%">
       {{'labels.inputs.Include in Customer Loan Counter' | translate}}
     </mat-checkbox>
 
     <mat-form-field fxFlex="48%" (click)="startDatePicker.open()">
       <mat-label>{{'labels.inputs.Start Date' | translate}}</mat-label>
-      <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="startDatePicker" matTooltip="The date that the loan product will be active and available to clients. If blank, the loan product will be active as soon as it is created." formControlName="startDate">
+      <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="startDatePicker" matTooltip="{{ 'tooltips.loan product will be active and available to clients' | translate}}" formControlName="startDate">
       <mat-datepicker-toggle matSuffix [for]="startDatePicker"></mat-datepicker-toggle>
       <mat-datepicker #startDatePicker></mat-datepicker>
     </mat-form-field>
 
     <mat-form-field fxFlex="48%" (click)="closeDatePicker.open()">
       <mat-label>{{'labels.inputs.Close Date' | translate}}</mat-label>
-      <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="closeDatePicker" matTooltip="The date that the loan product will become inactive and unavailable to clients. If blank, the load product will never become inactive." formControlName="closeDate">
+      <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="closeDatePicker" matTooltip="{{ 'tooltips.loan product will become inactive and unavailable to clients' | translate}}" formControlName="closeDate">
       <mat-datepicker-toggle matSuffix [for]="closeDatePicker"></mat-datepicker-toggle>
       <mat-datepicker #closeDatePicker></mat-datepicker>
     </mat-form-field>
 
     <mat-form-field fxFlex="98%">
       <mat-label>{{'labels.inputs.Description' | translate}}</mat-label>
-      <textarea matInput matTooltip="The description is used to provide additional information regarding the purpose and characteristics of the loan product." formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
+      <textarea matInput matTooltip="{{ 'tooltips.Provide additional information' | translate}}" formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
     </mat-form-field>
 
   </div>
diff --git a/src/app/products/loan-products/loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component.html b/src/app/products/loan-products/loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component.html
index dc37c5ef7..2aeed007c 100644
--- a/src/app/products/loan-products/loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component.html
+++ b/src/app/products/loan-products/loan-product-stepper/loan-product-settings-step/loan-product-settings-step.component.html
@@ -4,7 +4,7 @@
 
     <mat-form-field fxFlex="30%">
       <mat-label>{{'labels.inputs.products.loan.Amortization' | translate}}</mat-label>
-      <mat-select formControlName="amortizationType" matTooltip="The Amortization value is input to calculating the repayment amounts for repayment of the loan." required>
+      <mat-select formControlName="amortizationType" matTooltip="{{ 'tooltips.The Amortization value' | translate}}" required>
         <mat-option *ngFor="let amortizationType of amortizationTypeData" [value]="amortizationType.id">
           {{'labels.inputs.products.loan.amortizationType.' + amortizationType.value | translate}}
         </mat-option>
@@ -16,7 +16,7 @@
 
     <mat-form-field fxFlex="30%">
       <mat-label>{{'labels.inputs.Interest Method' | translate}}</mat-label>
-      <mat-select formControlName="interestType" matTooltip="The Interest method value is input to calculating the payments amount for repayment of the loan. " required>
+      <mat-select formControlName="interestType" matTooltip="{{ 'tooltips.The Interest method value' | translate}}" required>
         <mat-option *ngFor="let interestType of interestTypeData" [value]="interestType.id">
           {{ interestType.value | translateKey:'catalogs' }}
         </mat-option>
@@ -28,8 +28,7 @@
 
     <mat-form-field fxFlex="30%">
       <mat-label>{{'labels.inputs.Interest calculation period' | translate}}</mat-label>
-      <mat-select formControlName="interestCalculationPeriodType" matTooltip="Daily - Will Calculate the interest on DAILY basis ex: Month of February has 28days
-      and it will calculate interest for 28days, SAME AS REPAYMENT PERIOD- it calculates for the month,that is, 30days." required>
+      <mat-select formControlName="interestCalculationPeriodType" matTooltip="{{ 'tooltips.Daily - Will Calculate the interest' | translate}}" required>
         <mat-option *ngFor="let interestCalculationPeriodType of interestCalculationPeriodTypeData" [value]="interestCalculationPeriodType.id">
           {{ interestCalculationPeriodType.value | translateKey:'catalogs' }}
         </mat-option>
@@ -44,8 +43,7 @@
     </mat-checkbox>
 
     <mat-checkbox *ngIf="loanProductSettingsForm.value.interestCalculationPeriodType === 1" fxFlex="96%" labelPosition="before"
-      matTooltip=" To be used with SAME AS REPAYMENT PERIOD- for  calculating exact interest with partial period  ex: Interest charged from is 5th of April ,
-      Principal is 10000 and interest is 1% per month then the interest will be (10000 * 1%)* (25/30) , it calculates for the month first then calculates exact periods between start date and end date(can be a decimal)"
+      matTooltip="{{ 'tooltips.To be used with SAME AS REPAYMENT PERIOD' | translate}}"
       formControlName="allowPartialPeriodInterestCalcualtion">
       {{'labels.inputs.Calculate interest for exact days in partial period' | translate}}
     </mat-checkbox>
@@ -65,7 +63,7 @@
 
     <mat-form-field fxFlex="30%">
       <mat-label>{{'labels.inputs.Repayment strategy' | translate}}</mat-label>
-      <mat-select formControlName="transactionProcessingStrategyCode" matTooltip="The repayment strategy determines the sequence in which each of the components is paid."
+      <mat-select formControlName="transactionProcessingStrategyCode" matTooltip="{{ 'tooltips.The repayment strategy' | translate}}"
         required [disabled]="advancedTransactionProcessingStrategyDisabled">
         <mat-option *ngFor="let transactionProcessingStrategy of transactionProcessingStrategyData" [value]="transactionProcessingStrategy.code">
           {{ transactionProcessingStrategy.name | translateKey:'catalogs' }}
@@ -87,15 +85,14 @@
 
     <h3 fxFlex="96%" class="mat-h3">{{'labels.inputs.Loan Tranche Details' | translate}}</h3>
 
-    <mat-checkbox fxFlex="73%" labelPosition="before" formControlName="multiDisburseLoan" matTooltip="Leave this checkbox unchecked if the loan is a single disburse loan. Check this
-    checkbox if the loan is a multi disburse loan. See additional fields for additional information required for this type of loan." class="margin-b">
+    <mat-checkbox fxFlex="73%" labelPosition="before" formControlName="multiDisburseLoan" matTooltip="{{ 'tooltips.Leave this checkbox unchecked' | translate}}" class="margin-b">
       {{'labels.inputs.Enable Multiple Disbursals' | translate}}
     </mat-checkbox>
 
     <div *ngIf="loanProductSettingsForm.value.multiDisburseLoan" fxFlexFill fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
       <mat-form-field fxFlex="48%">
         <mat-label>{{'labels.inputs.Maximum Tranche count' | translate}}</mat-label>
-        <input type="number" matInput matTooltip="The maximum number of disbursements allowed for a loan account." formControlName="maxTrancheCount" required>
+        <input type="number" matInput matTooltip="{{ 'tooltips.Maximum number of disbursements' | translate}}" formControlName="maxTrancheCount" required>
         <mat-error *ngIf="loanProductSettingsForm.controls.maxTrancheCount.hasError('required')">
           {{'labels.inputs.Maximum Tranche count' | translate}} {{'labels.commons.is' | translate}} <strong>{{'labels.commons.required' | translate}}</strong>
         </mat-error>
@@ -103,7 +100,7 @@
 
       <mat-form-field fxFlex="48%">
         <mat-label>{{'labels.inputs.Maximum allowed outstanding balance' | translate}}</mat-label>
-        <input type="number" matInput matTooltip="The maximum outstanding loan account balance allowed at a point in time." formControlName="outstandingLoanBalance">
+        <input type="number" matInput matTooltip="{{ 'tooltips.Maximum outstanding loan account balance' | translate}}" formControlName="outstandingLoanBalance">
       </mat-form-field>
 
       <mat-checkbox fxFlex="48%" labelPosition="before" formControlName="disallowExpectedDisbursements" class="margin-v">
@@ -113,8 +110,7 @@
 
     <h3 fxFlex="96%" class="mat-h3">{{'labels.heading.Down Payment' | translate}}</h3>
 
-    <mat-checkbox fxFlex="73%" labelPosition="before" formControlName="enableDownPayment" matTooltip="Leave this checkbox checked if the loan has Down Payment, A Down Payment is
-    a sum a buyer pays upfront when purchasing a good. It represents a percentage of the total purchase price, and the balance is usually financed" class="margin-b">
+    <mat-checkbox fxFlex="73%" labelPosition="before" formControlName="enableDownPayment" matTooltip="{{ 'tooltips.Leave this checkbox unchecked' | translate}}" class="margin-b">
       {{'labels.inputs.Enable Down Payment' | translate}}
     </mat-checkbox>
 
diff --git a/src/app/products/manage-delinquency-buckets/delinquency-bucket/create-bucket/create-bucket.component.html b/src/app/products/manage-delinquency-buckets/delinquency-bucket/create-bucket/create-bucket.component.html
index 68f7c333f..0fdac3fc4 100644
--- a/src/app/products/manage-delinquency-buckets/delinquency-bucket/create-bucket/create-bucket.component.html
+++ b/src/app/products/manage-delinquency-buckets/delinquency-bucket/create-bucket/create-bucket.component.html
@@ -49,7 +49,7 @@
               <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Actions' | translate }} </th>
               <td mat-cell *matCellDef="let row; let rowIndex = index">
                 <button type="button" mat-icon-button color="warn"
-                  (click)="deleteDelinquencyRange(rowIndex)" matTooltip="Delete"
+                  (click)="deleteDelinquencyRange(rowIndex)" matTooltip="{{ 'tooltips.Delete' | translate}}"
                   matTooltipPosition="left">
                   <fa-icon icon="trash"></fa-icon>
                 </button>
diff --git a/src/app/products/manage-delinquency-buckets/delinquency-bucket/edit-bucket/edit-bucket.component.html b/src/app/products/manage-delinquency-buckets/delinquency-bucket/edit-bucket/edit-bucket.component.html
index 725b2e20d..0ab4fd7c3 100644
--- a/src/app/products/manage-delinquency-buckets/delinquency-bucket/edit-bucket/edit-bucket.component.html
+++ b/src/app/products/manage-delinquency-buckets/delinquency-bucket/edit-bucket/edit-bucket.component.html
@@ -52,7 +52,7 @@
               <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Actions' | translate }} </th>
               <td mat-cell *matCellDef="let row; let rowIndex = index">
                 <button type="button" mat-icon-button color="warn"
-                  (click)="deleteDelinquencyRange(rowIndex)" matTooltip="Delete"
+                  (click)="deleteDelinquencyRange(rowIndex)" matTooltip="{{ 'tooltips.Delete' | translate}}"
                   matTooltipPosition="left">
                   <fa-icon icon="trash"></fa-icon>
                 </button>
diff --git a/src/app/savings/savings-account-view/charges-tab/charges-tab.component.html b/src/app/savings/savings-account-view/charges-tab/charges-tab.component.html
index efccc017d..a9d9bed1b 100644
--- a/src/app/savings/savings-account-view/charges-tab/charges-tab.component.html
+++ b/src/app/savings/savings-account-view/charges-tab/charges-tab.component.html
@@ -73,26 +73,26 @@
         <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Actions' | translate}} </th>
         <td mat-cell *matCellDef="let charge">
           <span *ngIf="savingsAccountData.status.value === 'Submitted and pending approval'">
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Edit Charge"
+            <button class="account-action-button" mat-raised-button color="primary" matTooltip="{{ 'tooltips.Edit Charge' | translate }}"
               *mifosxHasPermission="'UPDATE_SAVINGSACCOUNTCHARGE'" (click)="routeEdit($event); editCharge(charge)">
               <i class="fa fa-pencil"></i>
             </button>
-            <button class="account-action-button" mat-raised-button color="warn" matTooltip="Delete Charge"
+            <button class="account-action-button" mat-raised-button color="warn" matTooltip="{{ 'tooltips.Delete Charge' | translate }}"
               *mifosxHasPermission="'DELETE_SAVINGSACCOUNTCHARGE'" (click)="routeEdit($event); deleteCharge(charge.id)">
               <i class="fa fa-trash"></i>
             </button>
           </span>
           <span *ngIf="savingsAccountData.status.value === 'Active' && charge.amountOutstanding !== 0">
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Pay Charge"
+            <button class="account-action-button" mat-raised-button color="primary" matTooltip="{{ 'tooltips.Pay Charge' | translate }}"
               *mifosxHasPermission="'PAY_SAVINGSACCOUNTCHARGE'" (click)="routeEdit($event); payCharge(charge.id)">
               <i class="fa fa-dollar"></i>
             </button>
-            <button class="account-action-button" mat-raised-button color="primary" matTooltip="Waive Charge"
+            <button class="account-action-button" mat-raised-button color="primary" matTooltip="{{ 'tooltips.Waive Charge' | translate }}"
               *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'" (click)="routeEdit($event); waiveCharge(charge.id)">
               <i class="fa fa-flag"></i>
             </button>
             <ng-container *ngIf="isRecurringCharge(charge)">
-              <button class="account-action-button" mat-raised-button color="primary" matTooltip="Inactivate Charge"
+              <button class="account-action-button" mat-raised-button color="primary" matTooltip="{{ 'tooltips.Inactivate Charge' | translate }}"
                 *mifosxHasPermission="'INACTIVATE_SAVINGSACCOUNTCHARGE'"
                 (click)="routeEdit($event); inactivateCharge(charge.id)">
                 <i class="fa fa-ban"></i>