Merge branch 'master' of https://github.com/openMF/web-app

package-lock.json

@@ -4009,6 +4009,21 @@
         "tslib": "^1.9.0"
       }
     },
+    "@ngx-translate/http-loader": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@ngx-translate/http-loader/-/http-loader-6.0.0.tgz",
+      "integrity": "sha512-LCekn6qCbeXWlhESCxU1rAbZz33WzDG0lI7Ig0pYC1o5YxJWrkU9y3Y4tNi+jakQ7R6YhTR2D3ox6APxDtA0wA==",
+      "requires": {
+        "tslib": "^2.0.0"
+      },
+      "dependencies": {
+        "tslib": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+          "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
+        }
+      }
+    },
     "@nodelib/fs.scandir": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz",

package.json

@@ -45,6 +45,7 @@
     "@fortawesome/fontawesome-svg-core": "1.2.18",
     "@fortawesome/free-solid-svg-icons": "5.8.2",
     "@ngx-translate/core": "11.0.1",
+    "@ngx-translate/http-loader": "^6.0.0",
     "chart.js": "3.0.0-alpha",
     "core-js": "2.5.0",
     "lodash": "4.17.21",

src/app/accounting/closing-entries/create-closure/create-closure.component.ts

@@ -5,7 +5,7 @@ import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /**
  * Create closure component.
  */
@@ -29,11 +29,13 @@ export class CreateClosureComponent implements OnInit {
    * Retrieves the offices data from `resolve`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: { offices: any }) => {
@@ -66,8 +68,8 @@ export class CreateClosureComponent implements OnInit {
   submit() {
     const accountingClosure = this.accountingClosureForm.value;
     // TODO: Update once language and date settings are setup
-    accountingClosure.locale = 'en';
-    accountingClosure.dateFormat = 'yyyy-MM-dd';
+    accountingClosure.locale = this.settingsService.language.code;
+    accountingClosure.dateFormat = this.settingsService.dateFormat;
     if (accountingClosure.closingDate instanceof Date) {
       let day = accountingClosure.closingDate.getDate();
       let month = accountingClosure.closingDate.getMonth() + 1;

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

@@ -5,7 +5,7 @@ import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /**
  * Create Journal Entry component.
  */
@@ -35,11 +35,13 @@ export class CreateJournalEntryComponent implements OnInit {
    * Retrieves the offices, currencies, payment types and gl accounts data from `resolve`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: {
@@ -134,8 +136,8 @@ export class CreateJournalEntryComponent implements OnInit {
   submit() {
     const journalEntry = this.journalEntryForm.value;
     // TODO: Update once language and date settings are setup
-    journalEntry.locale = 'en';
-    journalEntry.dateFormat = 'yyyy-MM-dd';
+    journalEntry.locale = this.settingsService.language.code;
+    journalEntry.dateFormat = this.settingsService.dateFormat;
     if (journalEntry.transactionDate instanceof Date) {
       let day = journalEntry.transactionDate.getDate();
       let month = journalEntry.transactionDate.getMonth() + 1;

src/app/accounting/frequent-postings/frequent-postings.component.ts

@@ -5,7 +5,7 @@ import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /**
  * Frequent Postings component.
  */
@@ -43,11 +43,13 @@ export class FrequentPostingsComponent implements OnInit {
    * Retrieves the offices, accounting rules, currencies and payment types data from `resolve`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: {
@@ -165,8 +167,8 @@ export class FrequentPostingsComponent implements OnInit {
     const journalEntry = this.frequentPostingsForm.value;
     journalEntry.accountingRule = journalEntry.accountingRule.id;
     // TODO: Update once language and date settings are setup
-    journalEntry.locale = 'en';
-    journalEntry.dateFormat = 'yyyy-MM-dd';
+    journalEntry.locale = this.settingsService.language.code;
+    journalEntry.dateFormat = this.settingsService.dateFormat;
     if (journalEntry.transactionDate instanceof Date) {
       let day = journalEntry.transactionDate.getDate();
       let month = journalEntry.transactionDate.getMonth() + 1;

src/app/accounting/migrate-opening-balances/migrate-opening-balances.component.ts

@@ -5,7 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /** Custom Validators */
 import { onlyOneOfTheFieldsIsRequiredValidator } from './only-one-of-the-fields-is-required.validator';
 
@@ -40,11 +40,13 @@ export class MigrateOpeningBalancesComponent implements OnInit {
    * Retrieves the offices and currencies from `resolve`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: {
@@ -134,8 +136,8 @@ export class MigrateOpeningBalancesComponent implements OnInit {
   submit() {
     const openingBalances = this.openingBalancesForm.value;
     // TODO: Update once language and date settings are setup
-    openingBalances.locale = 'en';
-    openingBalances.dateFormat = 'yyyy-MM-dd';
+    openingBalances.locale = this.settingsService.language.code;
+    openingBalances.dateFormat = this.settingsService.dateFormat;
     if (openingBalances.transactionDate instanceof Date) {
       let day = openingBalances.transactionDate.getDate();
       let month = openingBalances.transactionDate.getMonth() + 1;

src/app/accounting/periodic-accruals/periodic-accruals.component.ts

@@ -5,7 +5,7 @@ import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /**
  * Periodic accruals component.
  */
@@ -26,11 +26,13 @@ export class PeriodicAccrualsComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) { }
 
@@ -57,8 +59,8 @@ export class PeriodicAccrualsComponent implements OnInit {
   submit() {
     const periodicAccruals = this.periodicAccrualsForm.value;
     // TODO: Update once language and date settings are setup
-    periodicAccruals.locale = 'en';
-    periodicAccruals.dateFormat = 'yyyy-MM-dd';
+    periodicAccruals.locale = this.settingsService.language.code;
+    periodicAccruals.dateFormat = this.settingsService.dateFormat;
     if (periodicAccruals.tillDate instanceof Date) {
       let day = periodicAccruals.tillDate.getDate();
       let month = periodicAccruals.tillDate.getMonth() + 1;

src/app/accounting/provisioning-entries/create-provisioning-entry/create-provisioning-entry.component.ts

@@ -5,7 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { AccountingService } from '../../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /**
  * Create provisioning entry component.
  */
@@ -26,11 +26,13 @@ export class CreateProvisioningEntryComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {AccountingService} accountingService Accounting Service.
+   * @param {SettingsService} settingsService Settings Service.
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    */
   constructor(private formBuilder: FormBuilder,
               private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute,
               private router: Router) { }
 
@@ -58,8 +60,8 @@ export class CreateProvisioningEntryComponent implements OnInit {
   submit() {
     const provisioningEntry = this.provisioningEntryForm.value;
     // TODO: Update once language and date settings are setup
-    provisioningEntry.locale = 'en';
-    provisioningEntry.dateFormat = 'yyyy-MM-dd';
+    provisioningEntry.locale = this.settingsService.language.code;
+    provisioningEntry.dateFormat = this.settingsService.dateFormat;
     if (provisioningEntry.date instanceof Date) {
       let day = provisioningEntry.date.getDate();
       let month = provisioningEntry.date.getMonth() + 1;

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

@@ -11,7 +11,7 @@ import { tap, startWith, map, distinctUntilChanged, debounceTime} from 'rxjs/ope
 
 /** Custom Services */
 import { AccountingService } from '../accounting.service';
-
+import { SettingsService } from 'app/settings/settings.service';
 /** Custom Data Source */
 import { JournalEntriesDataSource } from './journal-entry.datasource';
 
@@ -96,11 +96,11 @@ export class SearchJournalEntryComponent implements OnInit, AfterViewInit {
     },
     {
       type: 'dateFormat',
-      value: 'yyyy-MM-dd'
+      value: this.settingsService.dateFormat
     },
     {
       type: 'locale',
-      value: 'en'
+      value: this.settingsService.language.code
     }
   ];
 
@@ -113,8 +113,10 @@ export class SearchJournalEntryComponent implements OnInit, AfterViewInit {
    * Retrieves the offices and gl accounts data from `resolve`.
    * @param {AccountingService} accountingService Accounting Service.
    * @param {ActivatedRoute} route Activated Route.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private accountingService: AccountingService,
+              private settingsService: SettingsService,
               private route: ActivatedRoute) {
     this.route.data.subscribe((data: {
         offices: any,

src/app/app.module.ts

@@ -5,9 +5,6 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { HttpClientModule } from '@angular/common/http';
 import { ServiceWorkerModule } from '@angular/service-worker';
 
-/** Tanslation Imports */
-import { TranslateModule } from '@ngx-translate/core';
-
 /** Environment Configuration */
 import { environment } from 'environments/environment';
 
@@ -55,7 +52,6 @@ import { AppRoutingModule } from './app-routing.module';
     HammerModule,
     HttpClientModule,
     ServiceWorkerModule.register('./ngsw-worker.js', { enabled: environment.production }),
-    TranslateModule.forRoot(),
     CoreModule,
     HomeModule,
     LoginModule,

src/app/collections/individual-collection-sheet/individual-collection-sheet.component.ts

@@ -19,6 +19,9 @@ import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
 
+/** Custom Services */
+import { SettingsService } from 'app/settings/settings.service';
+
 /**
  * Individual Collection Sheet
  */
@@ -82,13 +85,15 @@ export class IndividualCollectionSheetComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe to format date.
    * @param {Dialog} dialog Dialog component.
    * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
-    private collectionsService: CollectionsService,
-    private route: ActivatedRoute,
-    private datePipe: DatePipe,
-    public dialog: MatDialog,
-    private router: Router, ) {
+              private collectionsService: CollectionsService,
+              private route: ActivatedRoute,
+              private datePipe: DatePipe,
+              public dialog: MatDialog,
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { officesData: any }) => {
       this.officesData = data.officesData;
     });
@@ -276,8 +281,8 @@ export class IndividualCollectionSheetComponent implements OnInit {
    */
   previewCollectionSheet() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const collectionSheet = {
       ...this.collectionSheetForm.value,
       'transactionDate': this.datePipe.transform(this.collectionSheetForm.value.transactionDate, dateFormat),
@@ -304,8 +309,8 @@ export class IndividualCollectionSheetComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     this.bulkDisbursementTransactionsData['bulkRepaymentTransactions'] = this.bulkRepaymentTransactions;
     this.bulkDisbursementTransactionsData['bulkSavingsDueTransactions'] = this.bulkSavingsDueTransactions;
     const finalSubmitData = {

src/app/core/core.module.ts

@@ -4,7 +4,8 @@ import { HTTP_INTERCEPTORS, HttpClient, HttpClientModule } from '@angular/common
 import { RouteReuseStrategy, RouterModule } from '@angular/router';
 
 /** Translation Imports */
-import { TranslateModule } from '@ngx-translate/core';
+import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 
 /** Custom Services */
 import { AuthenticationService } from './authentication/authentication.service';
@@ -47,7 +48,15 @@ import { ContentComponent } from './shell/content/content.component';
   imports: [
     SharedModule,
     HttpClientModule,
-    TranslateModule,
+    TranslateModule.forRoot({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: (http: HttpClient) => {
+          return new TranslateHttpLoader(http, `${ window.location.protocol }//${ window.location.host }/assets/translations/`, '.json');
+        },
+        deps: [HttpClient]
+      }
+    }),
     RouterModule
   ],
   declarations: [

src/app/core/http/api-prefix.interceptor.ts

@@ -18,7 +18,13 @@ export class ApiPrefixInterceptor implements HttpInterceptor {
    * Intercepts a Http request and prefixes it with `environment.serverUrl`.
    */
   intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
-    request = request.clone({ url: environment.serverUrl + request.url });
+    /**
+     * Ignore URLs that are complete for i18n
+     */
+     if (!request.url.includes('http:') && !request.url.includes('https:')) {
+      request = request.clone({ url: environment.serverUrl + request.url });
+    }
+
     return next.handle(request);
   }
 

src/app/core/i18n/i18n.service.ts

@@ -34,11 +34,7 @@ export class I18nService {
   defaultLanguage: string;
   supportedLanguages: string[];
 
-  constructor(private translateService: TranslateService) {
-    // Embed languages to avoid extra HTTP requests
-    translateService.setTranslation('en-US', enUS);
-    translateService.setTranslation('fr-FR', frFR);
-  }
+  constructor(private translateService: TranslateService) { }
 
   /**
    * Initializes i18n for the application.
@@ -78,7 +74,8 @@ export class I18nService {
     }
 
     log.debug(`Language set to ${language}`);
-    this.translateService.use(language);
+    localStorage.setItem(this.languageStorageKey, language);
+    this.translateService.setDefaultLang(language);
   }
 
   /**

src/app/core/shell/toolbar/toolbar.component.html

@@ -20,19 +20,19 @@
 
       <a mat-tab-link class="tab-link" [routerLink]="['/accounting']">
         <fa-icon class="mr-05" icon="money-bill-alt" size="lg"></fa-icon>
-        Accounting
+        {{ 'Accounting' | translate }}
       </a>
       <a mat-tab-link class="tab-link" [matMenuTriggerFor]="reportsMenu" #reportsMenuTrigger="matMenuTrigger" >
         <fa-icon class="mr-05" icon="chart-bar" size="lg"></fa-icon>
-        Reports
+        {{ 'Reports' | translate }}
       </a>
       <a mat-tab-link class="tab-link" [matMenuTriggerFor]="adminMenu" #adminMenuTrigger="matMenuTrigger">
         <fa-icon class="mr-05" icon="shield-alt" size="lg"></fa-icon>
-        Admin
+        {{ 'Admin' | translate }}
       </a>
       <a mat-tab-link class="tab-link" [matMenuTriggerFor]="selfServiceMenu" #selfServiceMenuTrigger="matMenuTrigger">
         <fa-icon class="mr-05" icon="users" size="lg"></fa-icon>
-        Self Service
+        {{ 'Self Service' | translate }}
       </a>
 
     </span>

src/app/deposits/fixed-deposits/create-fixed-deposit-account/create-fixed-deposit-account.component.ts

@@ -5,6 +5,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { FixedDepositsService } from '../fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Components */
 import { FixedDepositAccountDetailsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-details-step/fixed-deposit-account-details-step.component';
@@ -45,11 +46,13 @@ export class CreateFixedDepositAccountComponent {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {FixedDepositsService} fixedDepositsService Fixed Deposits Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
               private datePipe: DatePipe,
-              private fixedDepositsService: FixedDepositsService) {
+              private fixedDepositsService: FixedDepositsService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositsAccountTemplate: any }) => {
       this.fixedDepositsAccountTemplate = data.fixedDepositsAccountTemplate;
     });
@@ -118,8 +121,8 @@ export class CreateFixedDepositAccountComponent {
    * Submits the fixed deposit form and creates a new fixed deposit account
    */
   submit() {
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const monthDayFormat = 'dd MMMM';
     const fixedDepositAccount = {
       ...this.fixedDepositAccount,

src/app/deposits/fixed-deposits/edit-fixed-deposit-account/edit-fixed-deposit-account.component.ts

@@ -5,6 +5,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { FixedDepositsService } from '../fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Components */
 import { FixedDepositAccountDetailsStepComponent } from '../fixed-deposit-account-stepper/fixed-deposit-account-details-step/fixed-deposit-account-details-step.component';
@@ -45,11 +46,13 @@ export class EditFixedDepositAccountComponent {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {FixedDepositsService} fixedDepositsService Fixed Deposits Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
               private datePipe: DatePipe,
-              private fixedDepositsService: FixedDepositsService) {
+              private fixedDepositsService: FixedDepositsService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositsAccountAndTemplate: any }) => {
       this.fixedDepositsAccountAndTemplate = data.fixedDepositsAccountAndTemplate;
     });
@@ -124,8 +127,8 @@ export class EditFixedDepositAccountComponent {
    * Submits the fixed deposit form and creates a new fixed deposit account
    */
   submit() {
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const monthDayFormat = 'dd MMMM';
     const fixedDepositAccount = {
       ...this.fixedDepositAccount,

src/app/deposits/fixed-deposits/fixed-deposit-account-stepper/fixed-deposit-account-charges-step/fixed-deposit-account-charges-step.component.ts

@@ -5,6 +5,7 @@ import { MatDialog } from '@angular/material/dialog';
 
 /** Dialog Components */
 import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Services */
 import { DatePipe } from '@angular/common';
@@ -45,9 +46,11 @@ export class FixedDepositAccountChargesStepComponent implements OnInit, OnChange
   /**
    * @param {MatDialog} dialog Mat Dialog
    * @param {DatePipe} datePipe Date Pipe
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(public dialog: MatDialog,
-              private datePipe: DatePipe) { }
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) { }
 
   ngOnInit() {
     this.currencyCode.valueChanges.subscribe(() => {
@@ -128,7 +131,7 @@ export class FixedDepositAccountChargesStepComponent implements OnInit, OnChange
     editChargeDateDialogRef.afterClosed().subscribe((response: any) => {
       if (response.data) {
         let newCharge: any;
-        const dateFormat = 'dd MMMM yyyy';
+        const dateFormat = this.settingsService.dateFormat;
         const date = this.datePipe.transform(response.data.value.date, dateFormat);
         switch (charge.chargeTimeType.value) {
           case 'Specified due date':

src/app/deposits/fixed-deposits/fixed-deposit-account-view/charges-tab/charges-tab.component.ts

@@ -7,6 +7,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { SavingsService } from 'app/savings/savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Dialogs */
 import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
@@ -63,12 +64,14 @@ export class ChargesTabComponent implements OnInit {
    * @param {Router} router Router for navigation.
    * @param {MatDialog} dialog Dialog reference.
    * @param {DatePipe} datePipe DatePipe.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private savingsService: SavingsService,
               private route: ActivatedRoute,
               private datePipe: DatePipe,
               private router: Router,
-              public dialog: MatDialog) {
+              public dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.route.parent.data.subscribe((data: { fixedDepositsAccountData: any }) => {
       this.fixedDepositsAccountData = data.fixedDepositsAccountData;
       this.chargesData = this.fixedDepositsAccountData.charges;
@@ -124,8 +127,8 @@ export class ChargesTabComponent implements OnInit {
     const payChargeDialogRef = this.dialog.open(FormDialogComponent, { data });
     payChargeDialogRef.afterClosed().subscribe((response: any) => {
       if (response.data) {
-        const locale = 'en';
-        const dateFormat = 'dd MMMM yyyy';
+        const locale = this.settingsService.language.code;
+        const dateFormat = this.settingsService.dateFormat;
         const dataObject = {
           ...response.data.value,
           dueDate: this.datePipe.transform(response.data.value.dueDate, dateFormat),
@@ -194,8 +197,8 @@ export class ChargesTabComponent implements OnInit {
     const editChargeDialogRef = this.dialog.open(FormDialogComponent, { data });
     editChargeDialogRef.afterClosed().subscribe((response: any) => {
       if (response.data) {
-        const locale = 'en';
-        const dateFormat = 'dd MMMM yyyy';
+        const locale = this.settingsService.language.code;
+        const dateFormat = this.settingsService.dateFormat;
         const dataObject = {
           ...response.data.value,
           dateFormat,

src/app/deposits/fixed-deposits/fixed-deposit-account-view/datatable-tabs/multi-row/multi-row.component.ts

@@ -18,6 +18,7 @@ import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicke
 
 /** Custom Services */
 import { SavingsService } from 'app/savings/savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Savings Account Multi Row Data Tables
@@ -52,11 +53,13 @@ export class MultiRowComponent implements OnInit, OnChanges {
    * @param {DatePipe} datePipe Date Pipe.
    * @param {SavingsService} savingsService Savingss Service.
    * @param {MatDialog} dialog Mat Dialog.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private route: ActivatedRoute,
               private datePipe: DatePipe,
               private savingsService: SavingsService,
-              private dialog: MatDialog) {
+              private dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.parent.snapshot.paramMap.get('fixedDepositAccountId');
   }
 
@@ -85,7 +88,7 @@ export class MultiRowComponent implements OnInit, OnChanges {
    * Adds a new row to the given multi row data table.
    */
   add() {
-    let dataTableEntryObject: any = { locale: 'en' };
+    let dataTableEntryObject: any = { locale: this.settingsService.language.code };
     const dateTransformColumns: string[] = [];
     const columns = this.dataObject.columnHeaders.filter((column: any) => {
       return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id'));
@@ -118,7 +121,7 @@ export class MultiRowComponent implements OnInit, OnChanges {
         });
         case 'DATE': {
           dateTransformColumns.push(column.columnName);
-          dataTableEntryObject.dateFormat = 'yyyy-MM-dd';
+          dataTableEntryObject.dateFormat = this.settingsService.dateFormat;
           return new DatepickerBase({
             controlName: column.columnName,
             label: column.columnName,

src/app/deposits/fixed-deposits/fixed-deposit-account-view/datatable-tabs/single-row/single-row.component.ts

@@ -17,6 +17,7 @@ import { CheckboxBase } from 'app/shared/form-dialog/formfield/model/checkbox-ba
 
 /** Custom Services */
 import { SavingsService } from 'app/savings/savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 
 /**
@@ -43,11 +44,13 @@ export class SingleRowComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe.
    * @param {SavingsService} savingsService Savingss Service.
    * @param {MatDialog} dialog Mat Dialog.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private route: ActivatedRoute,
               private datePipe: DatePipe,
               private dialog: MatDialog,
-              private savingsService: SavingsService) {
+              private savingsService: SavingsService,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.parent.snapshot.paramMap.get('fixedDepositAccountId');
   }
 
@@ -65,7 +68,7 @@ export class SingleRowComponent implements OnInit {
    * Creates a new instance of the given single row data table.
    */
   add() {
-    let dataTableEntryObject: any = { locale: 'en' };
+    let dataTableEntryObject: any = { locale: this.settingsService.language.code };
     const dateTransformColumns: string[] = [];
     const columns = this.dataObject.columnHeaders.filter((column: any) => {
       return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id'));
@@ -95,7 +98,7 @@ export class SingleRowComponent implements OnInit {
    * Edits the current instance of single row data table.
    */
   edit() {
-    let dataTableEntryObject: any = { locale: 'en' };
+    let dataTableEntryObject: any = { locale: this.settingsService.language.code };
     const dateTransformColumns: string[] = [];
     const columns = this.dataObject.columnHeaders.filter((column: any) => {
       return ((column.columnName !== 'id') && (column.columnName !== 'savings_account_id'));
@@ -180,7 +183,7 @@ export class SingleRowComponent implements OnInit {
         });
         case 'DATE': {
           dateTransformColumns.push(column.columnName);
-          dataTableEntryObject.dateFormat = 'yyyy-MM-dd';
+          dataTableEntryObject.dateFormat = this.settingsService.dateFormat;
           return new DatepickerBase({
             controlName: column.columnName,
             label: column.columnName,

src/app/deposits/fixed-deposits/fixed-deposit-account-view/standing-instructions-tab/standing-instructions-tab.component.ts

@@ -7,6 +7,7 @@ import { ActivatedRoute } from '@angular/router';
 /** Custom Services */
 import { FixedDepositsService } from 'app/deposits/fixed-deposits/fixed-deposits.service';
 import { AccountTransfersService } from 'app/account-transfers/account-transfers.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Dialog Components */
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
@@ -47,11 +48,13 @@ export class StandingInstructionsTabComponent implements OnInit {
    * @param {FixedDepositsService} fixedDepositsService FixedDepositsService
    * @param {MatDialog} dialog Mat Dialog
    * @param {AccountTransfersService} accountTransfersService Accounts Transfer Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private fixedDepositsService: FixedDepositsService,
               private dialog: MatDialog,
-              private accountTransfersService: AccountTransfersService) {
+              private accountTransfersService: AccountTransfersService,
+              private settingsService: SettingsService) {
     this.route.parent.data.subscribe((data: { fixedDepositsAccountData: any }) => {
       this.fixedDepositsData = data.fixedDepositsAccountData;
     });
@@ -68,8 +71,8 @@ export class StandingInstructionsTabComponent implements OnInit {
     const clientId = this.fixedDepositsData.clientId;
     const clientName = this.fixedDepositsData.clientName;
     const accountId = this.fixedDepositsData.id;
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     this.fixedDepositsService.getStandingInstructions(clientId, clientName, accountId, locale, dateFormat).subscribe((response: any) => {
       this.instructionsData = response.pageItems;
       this.dataSource.data = this.instructionsData;

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/activate-fixed-deposits-account/activate-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SavingsService } from 'app/savings/savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Activate Fixed Deposits Account Component
@@ -33,12 +34,14 @@ export class ActivateFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private savingsService: SavingsService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['fixedDepositAccountId'];
   }
 
@@ -64,8 +67,8 @@ export class ActivateFixedDepositsAccountComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevActivatedOnDate: Date = this.activateFixedDepositsAccountForm.value.activatedOnDate;
     this.activateFixedDepositsAccountForm.patchValue({
       activatedOnDate: this.datePipe.transform(prevActivatedOnDate, dateFormat),

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/add-charge-fixed-deposits-account/add-charge-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { SavingsService } from 'app/savings/savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Add Fixed Deposits Charge component.
@@ -38,13 +39,15 @@ export class AddChargeFixedDepositsAccountComponent implements OnInit {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {SavingsService} savingsService Savings Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(
     private formBuilder: FormBuilder,
     private route: ActivatedRoute,
     private router: Router,
     private datePipe: DatePipe,
-    private savingsService: SavingsService
+    private savingsService: SavingsService,
+    private settingsService: SettingsService
   ) {
     this.route.data.subscribe((data: { fixedDepositsAccountActionData: any }) => {
       this.savingsChargeOptions = data.fixedDepositsAccountActionData.chargeOptions;
@@ -112,7 +115,7 @@ export class AddChargeFixedDepositsAccountComponent implements OnInit {
    */
   submit() {
     const savingsCharge = this.fixedDepositsChargeForm.value;
-    savingsCharge.locale = 'en';
+    savingsCharge.locale = this.settingsService.language.code;
     if (!savingsCharge.feeInterval) {
       savingsCharge.feeInterval = this.chargeDetails.feeInterval;
     }
@@ -125,7 +128,7 @@ export class AddChargeFixedDepositsAccountComponent implements OnInit {
           savingsCharge.feeOnMonthDay = this.datePipe.transform(prevDate, monthDayFormat);
         }
       } else {
-        const dateFormat = 'yyyy-MM-dd';
+        const dateFormat = this.settingsService.dateFormat;
         savingsCharge.dateFormat = dateFormat;
         if (savingsCharge.dueDate) {
           const prevDate = this.fixedDepositsChargeForm.value.dueDate;

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/approve-fixed-deposits-account/approve-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { FixedDepositsService } from 'app/deposits/fixed-deposits/fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Approve Fixed Deposits Account Component
@@ -32,12 +33,14 @@ export class ApproveFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private fixedDepositsService: FixedDepositsService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['fixedDepositAccountId'];
   }
 
@@ -63,9 +66,8 @@ export class ApproveFixedDepositsAccountComponent implements OnInit {
    * if successful redirects to the fixed deposit account.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevApprovedOnDate: Date = this.approveFixedDepositsAccountForm.value.approvedOnDate;
     this.approveFixedDepositsAccountForm.patchValue({
       approvedOnDate: this.datePipe.transform(prevApprovedOnDate, dateFormat),

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/close-fixed-deposits-account/close-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { FixedDepositsService } from '../../fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Close On Maturity Fixed Deposits Account Component
@@ -39,12 +40,14 @@ export class CloseFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private fixedDepositsService: FixedDepositsService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositsAccountActionData: any }) => {
       this.savingsAccountsData = data.fixedDepositsAccountActionData.savingsAccounts;
       this.onAccountClosureOptions = data.fixedDepositsAccountActionData.onAccountClosureOptions;
@@ -93,9 +96,8 @@ export class CloseFixedDepositsAccountComponent implements OnInit {
    * if successful redirects to the fd account.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevClosedDate: Date = this.closeOnMaturityAccountForm.value.closedOnDate;
     this.closeOnMaturityAccountForm.patchValue({
       closedOnDate: this.datePipe.transform(prevClosedDate, dateFormat),

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/premature-close-fixed-deposits-account/premature-close-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { FixedDepositsService } from '../../fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Premature Close Fixed Deposits Account Component
@@ -39,12 +40,14 @@ export class PrematureCloseFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
-              private fixedDepositsService: FixedDepositsService,
-              private datePipe: DatePipe,
-              private route: ActivatedRoute,
-              private router: Router) {
+    private fixedDepositsService: FixedDepositsService,
+    private datePipe: DatePipe,
+    private route: ActivatedRoute,
+    private router: Router,
+    private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['fixedDepositAccountId'];
   }
 
@@ -81,9 +84,8 @@ export class PrematureCloseFixedDepositsAccountComponent implements OnInit {
    * @param {Date} date Premature Close Date
    */
   calculatePrematureAmount(date: Date) {
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const data = {
       closedOnDate: this.datePipe.transform(date, dateFormat),
       dateFormat,
@@ -93,7 +95,7 @@ export class PrematureCloseFixedDepositsAccountComponent implements OnInit {
       .subscribe((response: any) => {
         this.savingsAccountsData = response.savingsAccounts;
         this.onAccountClosureOptions = response.onAccountClosureOptions;
-        this.prematureCloseAccountForm.addControl('maturityAmount', new FormControl({value: '', disabled: true}));
+        this.prematureCloseAccountForm.addControl('maturityAmount', new FormControl({ value: '', disabled: true }));
         this.prematureCloseAccountForm.addControl('onAccountClosureId', new FormControl('', Validators.required));
         this.prematureCloseAccountForm.addControl('note', new FormControl(''));
         this.prematureCloseAccountForm.get('maturityAmount').patchValue(response.maturityAmount);
@@ -123,9 +125,8 @@ export class PrematureCloseFixedDepositsAccountComponent implements OnInit {
    */
   submit() {
     this.isSubmitted = true;
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevClosedDate: Date = this.prematureCloseAccountForm.value.closedOnDate;
     this.prematureCloseAccountForm.patchValue({
       closedOnDate: this.datePipe.transform(prevClosedDate, dateFormat),

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/reject-fixed-deposits-account/reject-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { FixedDepositsService } from 'app/deposits/fixed-deposits/fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Reject Fixed Deposits Account Component
@@ -32,12 +33,14 @@ export class RejectFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private fixedDepositsService: FixedDepositsService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['fixedDepositAccountId'];
   }
 
@@ -63,9 +66,8 @@ export class RejectFixedDepositsAccountComponent implements OnInit {
    * if successful redirects to the fixed deposit account.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevRejectedOnDate: Date = this.rejectFixedDepositsAccountForm.value.rejectedOnDate;
     this.rejectFixedDepositsAccountForm.patchValue({
       rejectedOnDate: this.datePipe.transform(prevRejectedOnDate, dateFormat),

src/app/deposits/fixed-deposits/fixed-deposits-account-actions/withdraw-by-client-fixed-deposits-account/withdraw-by-client-fixed-deposits-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { FixedDepositsService } from 'app/deposits/fixed-deposits/fixed-deposits.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Withdraw By Client Fixed Deposits Account Component
@@ -32,12 +33,14 @@ export class WithdrawByClientFixedDepositsAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private fixedDepositsService: FixedDepositsService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['fixedDepositAccountId'];
   }
 
@@ -63,9 +66,8 @@ export class WithdrawByClientFixedDepositsAccountComponent implements OnInit {
    * if successful redirects to the fixed deposit account.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevWithdrawnOnDate: Date = this.withdrawFixedDepositsAccountForm.value.withdrawnOnDate;
     this.withdrawFixedDepositsAccountForm.patchValue({
       withdrawnOnDate: this.datePipe.transform(prevWithdrawnOnDate, dateFormat),

src/app/products/charges/create-charge/create-charge.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Create charge component.
@@ -43,12 +44,14 @@ export class CreateChargeComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { chargesTemplate: any }) => {
       this.chargesTemplateData = data.chargesTemplate;
       this.incomeAndLiabilityAccountData = data.chargesTemplate.incomeOrLiabilityAccountOptions.incomeAccountOptions
@@ -216,7 +219,7 @@ export class CreateChargeComponent implements OnInit {
     });
     const charge = this.chargeForm.getRawValue();
     // TODO: Update once language and date settings are setup
-    charge.locale = 'en';
+    charge.locale = this.settingsService.language.code;
     charge.monthDayFormat = monthDayFormat;
     delete charge.addFeeFrequency;
     if (!charge.taxGroupId) {

src/app/products/charges/edit-charge/edit-charge.component.ts

@@ -5,6 +5,8 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
+
 
 /**
  * Edit Charge component.
@@ -43,19 +45,19 @@ export class EditChargeComponent implements OnInit {
   /** Show Fee Options. */
   showFeeOptions = false;
 
-    /**
-     * Retrieves the charge data from `resolve`.
-     * @param {ProductsService} productsService Products Service.
-     * @param {FormBuilder} formBuilder Form Builder.
-     * @param {ActivatedRoute} route Activated Route.
-     * @param {Router} router Router for navigation.
-     */
-  constructor(
-    private productsService: ProductsService,
-    private formBuilder: FormBuilder,
-    private route: ActivatedRoute,
-    private router: Router,
-  ) {
+  /**
+   * Retrieves the charge data from `resolve`.
+   * @param {ProductsService} productsService Products Service.
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service
+   */
+  constructor(private productsService: ProductsService,
+              private formBuilder: FormBuilder,
+              private route: ActivatedRoute,
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { chargesTemplate: any }) => {
       this.chargeData = data.chargesTemplate;
     });
@@ -71,7 +73,7 @@ export class EditChargeComponent implements OnInit {
   editChargeForm() {
     this.chargeForm = this.formBuilder.group({
       'name': [this.chargeData.name, Validators.required],
-      'chargeAppliesTo': [{value: this.chargeData.chargeAppliesTo.id, disabled: true}, Validators.required],
+      'chargeAppliesTo': [{ value: this.chargeData.chargeAppliesTo.id, disabled: true }, Validators.required],
       'currencyCode': [this.chargeData.currency.code, Validators.required],
       'amount': [this.chargeData.amount, Validators.required],
       'active': [this.chargeData.active],
@@ -112,9 +114,9 @@ export class EditChargeComponent implements OnInit {
       }
     }
     if (this.chargeData.taxGroup) {
-      this.chargeForm.addControl('taxGroupId', this.formBuilder.control({value: this.chargeData.taxGroup.id, disabled: true}, Validators.required));
+      this.chargeForm.addControl('taxGroupId', this.formBuilder.control({ value: this.chargeData.taxGroup.id, disabled: true }, Validators.required));
     } else {
-      this.chargeForm.addControl('taxGroupId', this.formBuilder.control({value: '?', disabled: true}));
+      this.chargeForm.addControl('taxGroupId', this.formBuilder.control({ value: '?', disabled: true }));
     }
   }
 
@@ -137,12 +139,12 @@ export class EditChargeComponent implements OnInit {
    */
   submit() {
     const charges = this.chargeForm.value;
-    charges.locale = 'en';
+    charges.locale = this.settingsService.language.code;
     charges.chargePaymentMode = this.chargeData.chargePaymentMode.id;
     this.productsService.updateCharge(this.chargeData.id.toString(), charges)
       .subscribe((response: any) => {
         this.router.navigate(['../'], { relativeTo: this.route });
-   });
+      });
   }
 
 }

src/app/products/fixed-deposit-products/create-fixed-deposit-product/create-fixed-deposit-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { FixedDepositProductDetailsStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-details-step/fixed-deposit-product-details-step.component';
 import { FixedDepositProductCurrencyStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-currency-step/fixed-deposit-product-currency-step.component';
 import { FixedDepositProductTermsStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-terms-step/fixed-deposit-product-terms-step.component';
@@ -9,7 +11,9 @@ import { FixedDepositProductInterestRateChartStepComponent } from '../fixed-depo
 import { FixedDepositProductChargesStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-charges-step/fixed-deposit-product-charges-step.component';
 import { FixedDepositProductAccountingStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-accounting-step/fixed-deposit-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-create-fixed-deposit-product',
@@ -29,9 +33,17 @@ export class CreateFixedDepositProductComponent implements OnInit {
   fixedDepositProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositProductsTemplate: any }) => {
       this.fixedDepositProductsTemplate = data.fixedDepositProductsTemplate;
     });
@@ -92,13 +104,13 @@ export class CreateFixedDepositProductComponent implements OnInit {
     const fixedDepositProduct = {
       ...this.fixedDepositProduct,
       charges: this.fixedDepositProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for depositAmount
+      locale: this.settingsService.language.code // locale required for depositAmount
     };
     delete fixedDepositProduct.advancedAccountingRules;
     this.productsService.createFixedDepositProduct(fixedDepositProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/fixed-deposit-products/edit-fixed-deposit-product/edit-fixed-deposit-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { FixedDepositProductDetailsStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-details-step/fixed-deposit-product-details-step.component';
 import { FixedDepositProductCurrencyStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-currency-step/fixed-deposit-product-currency-step.component';
 import { FixedDepositProductTermsStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-terms-step/fixed-deposit-product-terms-step.component';
@@ -9,7 +11,9 @@ import { FixedDepositProductInterestRateChartStepComponent } from '../fixed-depo
 import { FixedDepositProductChargesStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-charges-step/fixed-deposit-product-charges-step.component';
 import { FixedDepositProductAccountingStepComponent } from '../fixed-deposit-product-stepper/fixed-deposit-product-accounting-step/fixed-deposit-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-edit-fixed-deposit-product',
@@ -29,9 +33,17 @@ export class EditFixedDepositProductComponent implements OnInit {
   fixedDepositProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service
+   */
+
   constructor(private route: ActivatedRoute,
-    private productsService: ProductsService,
-    private router: Router) {
+              private productsService: ProductsService,
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { fixedDepositProductAndTemplate: any }) => {
       this.fixedDepositProductsTemplate = data.fixedDepositProductAndTemplate;
     });
@@ -100,7 +112,7 @@ export class EditFixedDepositProductComponent implements OnInit {
     const fixedDepositProduct = {
       ...this.fixedDepositProduct,
       charges: this.fixedDepositProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for depositAmount
+      locale: this.settingsService.language.code // locale required for depositAmount
     };
     if (!fixedDepositProduct.description) {
       fixedDepositProduct.description = '';

src/app/products/fixed-deposit-products/fixed-deposit-product-stepper/fixed-deposit-product-interest-rate-chart-step/fixed-deposit-product-interest-rate-chart-step.component.ts

@@ -1,17 +1,23 @@
+/** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormArray } from '@angular/forms';
 import { DatePipe } from '@angular/common';
 import { MatDialog } from '@angular/material/dialog';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 
+/** Custom Components */
 import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
 import { DepositProductIncentiveFormDialogComponent } from 'app/products/deposit-product-incentive-form-dialog/deposit-product-incentive-form-dialog.component';
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
 
+/** Dialog Components */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 
+/** Custom Services */
+import { SettingsService } from 'app/settings/settings.service';
+
 @Component({
   selector: 'mifosx-fixed-deposit-product-interest-rate-chart-step',
   templateUrl: './fixed-deposit-product-interest-rate-chart-step.component.html',
@@ -50,9 +56,17 @@ export class FixedDepositProductInterestRateChartStepComponent implements OnInit
   chartDetailData: any = [];
   chartsDetail: any[] = [];
 
+  /**
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {MatDialog} dialog Dialog reference.
+   * @param {DatePipe} datePipe Date Pipe.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private formBuilder: FormBuilder,
               public dialog: MatDialog,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.createFixedDepositProductInterestRateChartForm();
   }
 
@@ -284,7 +298,7 @@ export class FixedDepositProductInterestRateChartStepComponent implements OnInit
 
   getData(formType: string, values?: any) {
     switch (formType) {
-      case 'Slab': return  { title: 'Slab', formfields: this.getSlabFormfields(values) };
+      case 'Slab': return { title: 'Slab', formfields: this.getSlabFormfields(values) };
       case 'Incentive': return { values, chartTemplate: this.fixedDepositProductsTemplate.chartTemplate };
     }
   }
@@ -349,8 +363,8 @@ export class FixedDepositProductInterestRateChartStepComponent implements OnInit
 
   get fixedDepositProductInterestRateChart() {
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
-    const locale = 'en';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const fixedDepositProductInterestRateChart = this.fixedDepositProductInterestRateChartForm.value;
     for (const chart of fixedDepositProductInterestRateChart.charts) {
       chart.dateFormat = dateFormat;

src/app/products/floating-rates/create-floating-rate/create-floating-rate.component.ts

@@ -10,6 +10,7 @@ import { MatTableDataSource } from '@angular/material/table';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Components */
 import { FloatingRatePeriodDialogComponent } from '../floating-rate-period-dialog/floating-rate-period-dialog.component';
@@ -36,7 +37,7 @@ export class CreateFloatingRateComponent implements OnInit {
   /** Data source for floating rate periods table. */
   dataSource: MatTableDataSource<any>;
   /** Date Format. */
-  dateFormat = 'dd MMMM yyyy';
+  dateFormat = this.settingsService.dateFormat;
 
   /** Paginator for floating rate periods table. */
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@@ -50,13 +51,15 @@ export class CreateFloatingRateComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {DatePipe} datePipe Date Pipe.
    * @param {MatDialog} dialog Dialog reference.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private router: Router,
               private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private datePipe: DatePipe,
-              private dialog: MatDialog) { }
+              private dialog: MatDialog,
+              private settingsService: SettingsService) { }
 
   /**
    * Sets the floating rate periods table.
@@ -111,7 +114,7 @@ export class CreateFloatingRateComponent implements OnInit {
           fromDate: this.datePipe.transform(response.fromDate, this.dateFormat),
           interestRate: response.interestRate,
           isDifferentialToBaseLendingRate: response.isDifferentialToBaseLendingRate,
-          locale: 'en',
+          locale: this.settingsService.language.code,
           dateFormat: this.dateFormat
         });
         this.dataSource.connect().next(this.floatingRatePeriodsData);
@@ -137,7 +140,7 @@ export class CreateFloatingRateComponent implements OnInit {
           fromDate: this.datePipe.transform(response.fromDate, this.dateFormat),
           interestRate: response.interestRate,
           isDifferentialToBaseLendingRate: response.isDifferentialToBaseLendingRate,
-          locale: 'en',
+          locale: this.settingsService.language.code,
           dateFormat: this.dateFormat
         };
         this.dataSource.connect().next(this.floatingRatePeriodsData);

src/app/products/floating-rates/edit-floating-rate/edit-floating-rate.component.ts

@@ -10,6 +10,7 @@ import { MatTableDataSource } from '@angular/material/table';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Components */
 import { FloatingRatePeriodDialogComponent } from '../floating-rate-period-dialog/floating-rate-period-dialog.component';
@@ -38,7 +39,7 @@ export class EditFloatingRateComponent implements OnInit {
   /** Data source for floating rate periods table. */
   dataSource: MatTableDataSource<any>;
   /** Date Format. */
-  dateFormat = 'dd MMMM yyyy';
+  dateFormat = this.settingsService.dateFormat;
   /** Floating Rate Period Data. */
   floatingRatePeriodsData: any[] = [];
 
@@ -55,13 +56,15 @@ export class EditFloatingRateComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {DatePipe} datePipe Date Pipe.
    * @param {MatDialog} dialog Dialog reference.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private router: Router,
               private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private datePipe: DatePipe,
-              private dialog: MatDialog) {
+              private dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { floatingRate: any }) => {
       this.floatingRateData = data.floatingRate;
       this.floatingRatePeriodsData = data.floatingRate.ratePeriods ? data.floatingRate.ratePeriods : [];
@@ -109,7 +112,7 @@ export class EditFloatingRateComponent implements OnInit {
           fromDate: this.datePipe.transform(response.fromDate, this.dateFormat),
           interestRate: response.interestRate,
           isDifferentialToBaseLendingRate: response.isDifferentialToBaseLendingRate,
-          locale: 'en',
+          locale: this.settingsService.language.code,
           dateFormat: this.dateFormat
         });
         this.dataSource.connect().next(this.floatingRatePeriodsData);
@@ -136,7 +139,7 @@ export class EditFloatingRateComponent implements OnInit {
           fromDate: this.datePipe.transform(response.fromDate, this.dateFormat),
           interestRate: response.interestRate,
           isDifferentialToBaseLendingRate: response.isDifferentialToBaseLendingRate,
-          locale: 'en',
+          locale: this.settingsService.language.code,
           dateFormat: this.dateFormat
         };
         this.dataSource.connect().next(this.floatingRatePeriodsData);
@@ -174,7 +177,7 @@ export class EditFloatingRateComponent implements OnInit {
       floatingRatePeriod.modifiedBy = undefined;
       floatingRatePeriod.createdBy = undefined;
       floatingRatePeriod.isActive = undefined;
-      floatingRatePeriod.locale = 'en';
+      floatingRatePeriod.locale = this.settingsService.language.code;
       floatingRatePeriod.dateFormat = this.dateFormat;
       floatingRatePeriod.fromDate = this.datePipe.transform(floatingRatePeriod.fromDate, this.dateFormat);
     });

src/app/products/loan-products/create-loan-product/create-loan-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { LoanProductDetailsStepComponent } from '../loan-product-stepper/loan-product-details-step/loan-product-details-step.component';
 import { LoanProductCurrencyStepComponent } from '../loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component';
 import { LoanProductTermsStepComponent } from '../loan-product-stepper/loan-product-terms-step/loan-product-terms-step.component';
@@ -8,7 +10,9 @@ import { LoanProductSettingsStepComponent } from '../loan-product-stepper/loan-p
 import { LoanProductChargesStepComponent } from '../loan-product-stepper/loan-product-charges-step/loan-product-charges-step.component';
 import { LoanProductAccountingStepComponent } from '../loan-product-stepper/loan-product-accounting-step/loan-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-create-loan-product',
@@ -27,8 +31,16 @@ export class CreateLoanProductComponent implements OnInit {
   loanProductsTemplate: any;
   accountingRuleData = ['None', 'Cash', 'Accrual (periodic)', 'Accrual (upfront)'];
 
+   /**
+    * @param {ActivatedRoute} route Activated Route.
+    * @param {ProductsService} productsService Product Service.
+    * @param {SettingsService} settingsService Settings Service
+    * @param {Router} router Router for navigation.
+    */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
+              private settingsService: SettingsService,
               private router: Router) {
     this.route.data.subscribe((data: { loanProductsTemplate: any }) => {
       this.loanProductsTemplate = data.loanProductsTemplate;
@@ -81,19 +93,19 @@ export class CreateLoanProductComponent implements OnInit {
 
   submit() {
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     const loanProduct = {
       ...this.loanProduct,
       charges: this.loanProduct.charges.map((charge: any) => ({ id: charge.id })),
       dateFormat,
-      locale: 'en'
+      locale: this.settingsService.language.code
     };
     delete loanProduct.allowAttributeConfiguration;
     delete loanProduct.advancedAccountingRules;
     this.productsService.createLoanProduct(loanProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/loan-products/edit-loan-product/edit-loan-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { LoanProductDetailsStepComponent } from '../loan-product-stepper/loan-product-details-step/loan-product-details-step.component';
 import { LoanProductCurrencyStepComponent } from '../loan-product-stepper/loan-product-currency-step/loan-product-currency-step.component';
 import { LoanProductTermsStepComponent } from '../loan-product-stepper/loan-product-terms-step/loan-product-terms-step.component';
@@ -8,7 +10,9 @@ import { LoanProductSettingsStepComponent } from '../loan-product-stepper/loan-p
 import { LoanProductChargesStepComponent } from '../loan-product-stepper/loan-product-charges-step/loan-product-charges-step.component';
 import { LoanProductAccountingStepComponent } from '../loan-product-stepper/loan-product-accounting-step/loan-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-edit-loan-product',
@@ -27,8 +31,16 @@ export class EditLoanProductComponent implements OnInit {
   loanProductAndTemplate: any;
   accountingRuleData = ['None', 'Cash', 'Accrual (periodic)', 'Accrual (upfront)'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Product Service.
+   * @param {SettingsService} settingsService Settings Service
+   * @param {Router} router Router for navigation.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
+              private settingsService: SettingsService,
               private router: Router) {
     this.route.data.subscribe((data: { loanProductAndTemplate: any }) => {
       this.loanProductAndTemplate = data.loanProductAndTemplate;
@@ -89,19 +101,19 @@ export class EditLoanProductComponent implements OnInit {
 
   submit() {
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     const loanProduct = {
       ...this.loanProduct,
       charges: this.loanProduct.charges.map((charge: any) => ({ id: charge.id })),
       dateFormat,
-      locale: 'en'
+      locale: this.settingsService.language.code
     };
     delete loanProduct.allowAttributeConfiguration;
     delete loanProduct.advancedAccountingRules;
     this.productsService.updateLoanProduct(this.loanProductAndTemplate.id, loanProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 

src/app/products/loan-products/loan-product-stepper/loan-product-details-step/loan-product-details-step.component.ts

@@ -1,7 +1,11 @@
+/** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { DatePipe } from '@angular/common';
 
+/** Custom Services */
+import { SettingsService } from 'app/settings/settings.service';
+
 @Component({
   selector: 'mifosx-loan-product-details-step',
   templateUrl: './loan-product-details-step.component.html',
@@ -18,8 +22,15 @@ export class LoanProductDetailsStepComponent implements OnInit {
   minDate = new Date(2000, 0, 1);
   maxDate = new Date(new Date().setFullYear(new Date().getFullYear() + 10));
 
+  /**
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {DatePipe} datePipe Date Pipe.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private formBuilder: FormBuilder,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.createLoanProductDetailsForm();
   }
 
@@ -53,7 +64,7 @@ export class LoanProductDetailsStepComponent implements OnInit {
     const prevStartDate: Date = this.loanProductDetailsForm.value.startDate;
     const prevCloseDate: Date = this.loanProductDetailsForm.value.closeDate;
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     this.loanProductDetailsForm.patchValue({
       startDate: this.datePipe.transform(prevStartDate, dateFormat) || '',
       closeDate: this.datePipe.transform(prevCloseDate, dateFormat) || ''

src/app/products/manage-tax-components/create-tax-component/create-tax-component.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Create Tax Component component.
@@ -41,13 +42,15 @@ export class CreateTaxComponentComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe) {
-    this.route.data.subscribe(( data: { taxComponentTemplate: any }) => {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
+    this.route.data.subscribe((data: { taxComponentTemplate: any }) => {
       this.taxComponentTemplateData = data.taxComponentTemplate;
     });
   }
@@ -114,12 +117,12 @@ export class CreateTaxComponentComponent implements OnInit {
   submit() {
     const prevStartDate: Date = this.taxComponentForm.value.startDate;
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     this.taxComponentForm.patchValue({
       startDate: this.datePipe.transform(prevStartDate, dateFormat)
     });
     const taxComponent = this.taxComponentForm.value;
-    taxComponent.locale = 'en';
+    taxComponent.locale = this.settingsService.language.code;
     taxComponent.dateFormat = dateFormat;
     this.productsService.createTaxComponent(taxComponent).subscribe((response: any) => {
       this.router.navigate(['../', response.resourceId], { relativeTo: this.route });

src/app/products/manage-tax-components/edit-tax-component/edit-tax-component.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Edit tax component.
@@ -31,12 +32,14 @@ export class EditTaxComponentComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private productsService: ProductsService,
               private route: ActivatedRoute,
               private router: Router,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { taxComponent: any }) => {
       this.taxComponentData = data.taxComponent;
     });
@@ -57,8 +60,8 @@ export class EditTaxComponentComponent implements OnInit {
       'name': [this.taxComponentData.name, [Validators.required]],
       'percentage': [this.taxComponentData.percentage, [Validators.required, Validators.pattern('^(0*[1-9][0-9]*(\\.[0-9]+)?|0+\\.[0-9]*[1-9][0-9]*)$'), Validators.max(100)]],
       'startDate': [this.taxComponentData.startDate && new Date(this.taxComponentData.startDate)],
-      'creditAccountType': [{value: this.taxComponentData.creditAccountType.value, disabled: true}],
-      'creditAccount': [{value: this.taxComponentData.creditAccount.name, disabled: true}]
+      'creditAccountType': [{ value: this.taxComponentData.creditAccountType.value, disabled: true }],
+      'creditAccount': [{ value: this.taxComponentData.creditAccount.name, disabled: true }]
     });
   }
 
@@ -69,12 +72,12 @@ export class EditTaxComponentComponent implements OnInit {
   submit() {
     const prevStartDate: Date = this.taxComponentForm.value.startDate;
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     this.taxComponentForm.patchValue({
       startDate: this.datePipe.transform(prevStartDate, dateFormat)
     });
     const taxComponent = this.taxComponentForm.value;
-    taxComponent.locale = 'en';
+    taxComponent.locale = this.settingsService.language.code;
     taxComponent.dateFormat = dateFormat;
     this.productsService.updateTaxComponent(this.taxComponentData.id, taxComponent).subscribe((response: any) => {
       this.router.navigate(['../../', response.resourceId], { relativeTo: this.route });

src/app/products/manage-tax-groups/create-tax-group/create-tax-group.component.ts

@@ -7,6 +7,7 @@ import { MatDialog } from '@angular/material/dialog';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Dialog Components */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
@@ -48,13 +49,16 @@ export class CreateTaxGroupComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {MatDialog} dialog Dialog reference.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
-    private productsService: ProductsService,
-    private route: ActivatedRoute,
-    private router: Router,
-    private datePipe: DatePipe,
-    public dialog: MatDialog) {
+              private productsService: ProductsService,
+              private route: ActivatedRoute,
+              private router: Router,
+              private datePipe: DatePipe,
+              public dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { taxGroupTemplate: any }) => {
       this.taxGroupTemplateData = data.taxGroupTemplate;
       this.taxComponentOptions = this.taxGroupTemplateData.taxComponents;
@@ -163,8 +167,8 @@ export class CreateTaxGroupComponent implements OnInit {
    * if successful redirects to Tax Groups.
    */
   submit() {
-    const dateFormat = 'yyyy-MM-dd';
-    const locale = 'en';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const taxGroup = {
       ...this.taxGroupForm.value,
       taxComponents: this.taxComponentsDataSource,

src/app/products/manage-tax-groups/edit-tax-group/edit-tax-group.component.ts

@@ -7,6 +7,7 @@ import { MatDialog } from '@angular/material/dialog';
 
 /** Custom Services */
 import { ProductsService } from '../../products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Dialog Components */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
@@ -48,13 +49,16 @@ export class EditTaxGroupComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {Router} router Router for navigation.
    * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {MatDialog} dialog Dialog reference.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
-    private productsService: ProductsService,
-    private route: ActivatedRoute,
-    private router: Router,
-    private datePipe: DatePipe,
-    public dialog: MatDialog) {
+              private productsService: ProductsService,
+              private route: ActivatedRoute,
+              private router: Router,
+              private datePipe: DatePipe,
+              public dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { taxGroup: any }) => {
       this.taxGroupData = data.taxGroup;
       this.taxComponentOptions = this.taxGroupData.taxComponents;
@@ -193,8 +197,8 @@ export class EditTaxGroupComponent implements OnInit {
    * if successful redirects to Tax Groups.
    */
   submit() {
-    const dateFormat = 'yyyy-MM-dd';
-    const locale = 'en';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const taxGroup = {
       ...this.taxGroupForm.value,
       taxComponents: this.taxComponentsDataSource,

src/app/products/products.service.ts

@@ -5,6 +5,9 @@ import { HttpClient, HttpParams } from '@angular/common/http';
 /** rxjs Imports */
 import { Observable } from 'rxjs';
 
+/** Custom Services */
+import { SettingsService } from 'app/settings/settings.service';
+
 /**
  * Products service.
  */
@@ -15,8 +18,10 @@ export class ProductsService {
 
   /**
    * @param {HttpClient} http Http Client to send requests.
+   * @param {SettingsService} settingsService Settings Service.
    */
-  constructor(private http: HttpClient) { }
+  constructor(private http: HttpClient,
+              private settingsService: SettingsService) { }
 
   /**
    * @returns {Observable<any>} Loan products data
@@ -105,10 +110,10 @@ export class ProductsService {
   }
 
   getDividendData(shareProductId: any, dividendId: any): Observable<any> {
-    const httpParams = new HttpParams().set('dateFormat', 'dd MMMM yyyy')
-                                        .set('limit', '10')
-                                        .set('locale', 'en')
-                                        .set('offset', '0');
+    const httpParams = new HttpParams().set('dateFormat', this.settingsService.dateFormat)
+                                       .set('limit', '10')
+                                       .set('locale', this.settingsService.language.code)
+                                       .set('offset', '0');
     return this.http.get(`/shareproduct/${shareProductId}/dividend/${dividendId}`, { params: httpParams });
   }
 
@@ -394,7 +399,7 @@ export class ProductsService {
    */
   getAllInterestRateCharts(productId: string): Observable<any> {
     const httpParams = new HttpParams().set('productId', productId);
-    return this.http.get(`/interestratecharts`, {params: httpParams});
+    return this.http.get(`/interestratecharts`, { params: httpParams });
   }
 
   createRecurringDepositProduct(recurringDepositProduct: any): Observable<any> {

src/app/products/recurring-deposit-products/create-recurring-deposit-product/create-recurring-deposit-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { RecurringDepositProductDetailsStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-details-step/recurring-deposit-product-details-step.component';
 import { RecurringDepositProductCurrencyStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-currency-step/recurring-deposit-product-currency-step.component';
 import { RecurringDepositProductTermsStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-terms-step/recurring-deposit-product-terms-step.component';
@@ -9,7 +11,9 @@ import { RecurringDepositProductInterestRateChartStepComponent } from '../recurr
 import { RecurringDepositProductChargesStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-charges-step/recurring-deposit-product-charges-step.component';
 import { RecurringDepositProductAccountingStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-accounting-step/recurring-deposit-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-create-recurring-deposit-product',
@@ -29,9 +33,17 @@ export class CreateRecurringDepositProductComponent implements OnInit {
   recurringDepositProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
-    private productsService: ProductsService,
-    private router: Router) {
+              private productsService: ProductsService,
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { recurringDepositProductsTemplate: any }) => {
       this.recurringDepositProductsTemplate = data.recurringDepositProductsTemplate;
     });
@@ -92,7 +104,7 @@ export class CreateRecurringDepositProductComponent implements OnInit {
     const recurringDepositProduct = {
       ...this.recurringDepositProduct,
       charges: this.recurringDepositProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for depositAmount
+      locale: this.settingsService.language.code // locale required for depositAmount
     };
     if (!recurringDepositProduct.description) {
       recurringDepositProduct.description = '';

src/app/products/recurring-deposit-products/edit-recurring-deposit-product/edit-recurring-deposit-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { RecurringDepositProductDetailsStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-details-step/recurring-deposit-product-details-step.component';
 import { RecurringDepositProductCurrencyStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-currency-step/recurring-deposit-product-currency-step.component';
 import { RecurringDepositProductTermsStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-terms-step/recurring-deposit-product-terms-step.component';
@@ -9,7 +11,9 @@ import { RecurringDepositProductInterestRateChartStepComponent } from '../recurr
 import { RecurringDepositProductChargesStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-charges-step/recurring-deposit-product-charges-step.component';
 import { RecurringDepositProductAccountingStepComponent } from '../recurring-deposit-product-stepper/recurring-deposit-product-accounting-step/recurring-deposit-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-edit-recurring-deposit-product',
@@ -29,9 +33,17 @@ export class EditRecurringDepositProductComponent implements OnInit {
   recurringDepositProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
-    private productsService: ProductsService,
-    private router: Router) {
+              private productsService: ProductsService,
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { recurringDepositProductAndTemplate: any }) => {
       this.recurringDepositProductsTemplate = data.recurringDepositProductAndTemplate;
     });
@@ -100,7 +112,7 @@ export class EditRecurringDepositProductComponent implements OnInit {
     const recurringDepositProduct = {
       ...this.recurringDepositProduct,
       charges: this.recurringDepositProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for depositAmount
+      locale: this.settingsService.language.code // locale required for depositAmount
     };
     if (!recurringDepositProduct.description) {
       recurringDepositProduct.description = '';

src/app/products/recurring-deposit-products/recurring-deposit-product-stepper/recurring-deposit-product-interest-rate-chart-step/recurring-deposit-product-interest-rate-chart-step.component.ts

@@ -1,17 +1,23 @@
+/** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormArray } from '@angular/forms';
 import { DatePipe } from '@angular/common';
 import { MatDialog } from '@angular/material/dialog';
 import { animate, state, style, transition, trigger } from '@angular/animations';
 
+/** Custom Components */
 import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
 import { DepositProductIncentiveFormDialogComponent } from 'app/products/deposit-product-incentive-form-dialog/deposit-product-incentive-form-dialog.component';
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
 
+/** Dialog Components */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 
+
+import { SettingsService } from 'app/settings/settings.service';
+
 @Component({
   selector: 'mifosx-recurring-deposit-product-interest-rate-chart-step',
   templateUrl: './recurring-deposit-product-interest-rate-chart-step.component.html',
@@ -50,9 +56,17 @@ export class RecurringDepositProductInterestRateChartStepComponent implements On
   chartDetailData: any = [];
   chartsDetail: any[] = [];
 
+  /**
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {MatDialog} dialog Dialog reference.
+   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private formBuilder: FormBuilder,
-    public dialog: MatDialog,
-    private datePipe: DatePipe) {
+              public dialog: MatDialog,
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.createrecurringDepositProductInterestRateChartForm();
   }
 
@@ -350,8 +364,8 @@ export class RecurringDepositProductInterestRateChartStepComponent implements On
 
   get recurringDepositProductInterestRateChart() {
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
-    const locale = 'en';
+    const dateFormat = this.settingsService.dateFormat;
+    const locale = this.settingsService.language.code;
     const recurringDepositProductInterestRateChart = this.recurringDepositProductInterestRateChartForm.value;
     for (const chart of recurringDepositProductInterestRateChart.charts) {
       chart.dateFormat = dateFormat;

src/app/products/saving-products/create-saving-product/create-saving-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { SavingProductDetailsStepComponent } from '../saving-product-stepper/saving-product-details-step/saving-product-details-step.component';
 import { SavingProductCurrencyStepComponent } from '../saving-product-stepper/saving-product-currency-step/saving-product-currency-step.component';
 import { SavingProductTermsStepComponent } from '../saving-product-stepper/saving-product-terms-step/saving-product-terms-step.component';
@@ -8,7 +10,9 @@ import { SavingProductSettingsStepComponent } from '../saving-product-stepper/sa
 import { SavingProductChargesStepComponent } from '../saving-product-stepper/saving-product-charges-step/saving-product-charges-step.component';
 import { SavingProductAccountingStepComponent } from '../saving-product-stepper/saving-product-accounting-step/saving-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-create-saving-product',
@@ -27,9 +31,17 @@ export class CreateSavingProductComponent implements OnInit {
   savingProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { savingProductsTemplate: any }) => {
       this.savingProductsTemplate = data.savingProductsTemplate;
     });
@@ -84,13 +96,13 @@ export class CreateSavingProductComponent implements OnInit {
     const savingProduct = {
       ...this.savingProduct,
       charges: this.savingProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for nominalAnnualInterestRate
+      locale: this.settingsService.language.code // locale required for nominalAnnualInterestRate
     };
     delete savingProduct.advancedAccountingRules;
     this.productsService.createSavingProduct(savingProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/saving-products/edit-saving-product/edit-saving-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { SavingProductDetailsStepComponent } from '../saving-product-stepper/saving-product-details-step/saving-product-details-step.component';
 import { SavingProductCurrencyStepComponent } from '../saving-product-stepper/saving-product-currency-step/saving-product-currency-step.component';
 import { SavingProductTermsStepComponent } from '../saving-product-stepper/saving-product-terms-step/saving-product-terms-step.component';
@@ -8,7 +10,10 @@ import { SavingProductSettingsStepComponent } from '../saving-product-stepper/sa
 import { SavingProductChargesStepComponent } from '../saving-product-stepper/saving-product-charges-step/saving-product-charges-step.component';
 import { SavingProductAccountingStepComponent } from '../saving-product-stepper/saving-product-accounting-step/saving-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
+
 
 @Component({
   selector: 'mifosx-edit-saving-product',
@@ -27,9 +32,17 @@ export class EditSavingProductComponent implements OnInit {
   savingProductAndTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { savingProductAndTemplate: any }) => {
       this.savingProductAndTemplate = data.savingProductAndTemplate;
     });
@@ -92,13 +105,13 @@ export class EditSavingProductComponent implements OnInit {
     const savingProduct = {
       ...this.savingProduct,
       charges: this.savingProduct.charges.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for nominalAnnualInterestRate
+      locale: this.settingsService.language.code // locale required for nominalAnnualInterestRate
     };
     delete savingProduct.advancedAccountingRules;
     this.productsService.updateSavingProduct(this.savingProductAndTemplate.id, savingProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/share-products/create-dividend/create-dividend.component.ts

@@ -6,6 +6,8 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services. */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
+
 
 /**
  * Create Dividend component.
@@ -30,13 +32,17 @@ export class CreateDividendComponent implements OnInit {
    * Get Share Product data from `Resolver`.
    * @param {FormBuilder} formBuilder Form Builder.
    * @param {ActivatedRoute} route Activated Route.
+   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {ProductsService} productsService Products Service.
    * @param {Router} router Router.
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private route: ActivatedRoute,
               private datePipe: DatePipe,
               private productService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { shareProduct: any }) => {
       this.shareProductData = data.shareProduct;
     });
@@ -61,7 +67,7 @@ export class CreateDividendComponent implements OnInit {
    * Submits Create Dividend form.
    */
   submit() {
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     const startDate = this.createDividendForm.value.dividendPeriodStartDate;
     const endDate = this.createDividendForm.value.dividendPeriodEndDate;
     this.createDividendForm.patchValue({
@@ -69,7 +75,7 @@ export class CreateDividendComponent implements OnInit {
       'dividendPeriodEndDate': this.datePipe.transform(endDate, dateFormat)
     });
     const dividendForm = this.createDividendForm.value;
-    dividendForm.locale = 'en';
+    dividendForm.locale = this.settingsService.language.code;
     dividendForm.dateFormat = dateFormat;
     this.productService.createDividend(this.shareProductData.id, dividendForm).subscribe((response: any) => {
       this.router.navigate(['../'], { relativeTo: this.route });

src/app/products/share-products/create-share-product/create-share-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { ShareProductDetailsStepComponent } from '../share-product-stepper/share-product-details-step/share-product-details-step.component';
 import { ShareProductCurrencyStepComponent } from '../share-product-stepper/share-product-currency-step/share-product-currency-step.component';
 import { ShareProductTermsStepComponent } from '../share-product-stepper/share-product-terms-step/share-product-terms-step.component';
@@ -9,7 +11,9 @@ import { ShareProductMarketPriceStepComponent } from '../share-product-stepper/s
 import { ShareProductChargesStepComponent } from '../share-product-stepper/share-product-charges-step/share-product-charges-step.component';
 import { ShareProductAccountingStepComponent } from '../share-product-stepper/share-product-accounting-step/share-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-create-share-product',
@@ -29,9 +33,17 @@ export class CreateShareProductComponent implements OnInit {
   shareProductsTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { shareProductsTemplate: any }) => {
       this.shareProductsTemplate = data.shareProductsTemplate;
     });
@@ -92,12 +104,12 @@ export class CreateShareProductComponent implements OnInit {
     const shareProduct = {
       ...this.shareProduct,
       chargesSelected: this.shareProduct.chargesSelected.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for digitsAfterDecimal
+      locale: this.settingsService.language.code // locale required for digitsAfterDecimal
     };
     this.productsService.createShareProduct(shareProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/share-products/edit-share-product/edit-share-product.component.ts

@@ -1,6 +1,8 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+/** Custom Components */
 import { ShareProductDetailsStepComponent } from '../share-product-stepper/share-product-details-step/share-product-details-step.component';
 import { ShareProductCurrencyStepComponent } from '../share-product-stepper/share-product-currency-step/share-product-currency-step.component';
 import { ShareProductTermsStepComponent } from '../share-product-stepper/share-product-terms-step/share-product-terms-step.component';
@@ -9,7 +11,9 @@ import { ShareProductMarketPriceStepComponent } from '../share-product-stepper/s
 import { ShareProductChargesStepComponent } from '../share-product-stepper/share-product-charges-step/share-product-charges-step.component';
 import { ShareProductAccountingStepComponent } from '../share-product-stepper/share-product-accounting-step/share-product-accounting-step.component';
 
+/** Custom Services */
 import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 @Component({
   selector: 'mifosx-edit-share-product',
@@ -29,9 +33,17 @@ export class EditShareProductComponent implements OnInit {
   shareProductAndTemplate: any;
   accountingRuleData = ['None', 'Cash'];
 
+  /**
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {ProductsService} productsService Products Service.
+   * @param {Router} router Router.
+   * @param {SettingsService} settingsService Settings Service.
+   */
+
   constructor(private route: ActivatedRoute,
               private productsService: ProductsService,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { shareProductAndTemplate: any }) => {
       this.shareProductAndTemplate = data.shareProductAndTemplate;
     });
@@ -101,12 +113,12 @@ export class EditShareProductComponent implements OnInit {
     const shareProduct = {
       ...this.shareProduct,
       chargesSelected: this.shareProduct.chargesSelected.map((charge: any) => ({ id: charge.id })),
-      locale: 'en' // locale required for digitsAfterDecimal
+      locale: this.settingsService.language.code // locale required for digitsAfterDecimal
     };
     this.productsService.updateShareProduct(this.shareProductAndTemplate.id, shareProduct)
       .subscribe((response: any) => {
         this.router.navigate(['../../', response.resourceId], { relativeTo: this.route });
-    });
+      });
   }
 
 }

src/app/products/share-products/share-product-stepper/share-product-market-price-step/share-product-market-price-step.component.ts

@@ -1,15 +1,19 @@
+/** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { DatePipe } from '@angular/common';
 import { FormGroup, FormBuilder, FormArray } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 
+/** Dialog Components */
 import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
 import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
-
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 
+/** Custom Services */
+import { SettingsService } from 'app/settings/settings.service';
+
 @Component({
   selector: 'mifosx-share-product-market-price-step',
   templateUrl: './share-product-market-price-step.component.html',
@@ -21,11 +25,20 @@ export class ShareProductMarketPriceStepComponent implements OnInit {
 
   shareProductMarketPriceForm: FormGroup;
 
+  /** For displaying required columns */
   displayedColumns: string[] = ['fromDate', 'shareValue', 'actions'];
 
+  /**
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {DatePipe} datePipe Date Pipe to format date.
+   * @param {SettingsService} settingsService Settings Service
+   */
+
   constructor(private formBuilder: FormBuilder,
               public dialog: MatDialog,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.createShareProductMarketPriceForm();
   }
 
@@ -37,7 +50,7 @@ export class ShareProductMarketPriceStepComponent implements OnInit {
 
   createShareProductMarketPriceForm() {
     this.shareProductMarketPriceForm = this.formBuilder.group({
-      'marketPricePeriods':  this.formBuilder.array([])
+      'marketPricePeriods': this.formBuilder.array([])
     });
   }
 
@@ -113,14 +126,15 @@ export class ShareProductMarketPriceStepComponent implements OnInit {
 
   get shareProductMarketPrice() {
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
+    const locale = this.settingsService.language.code;
     const marketPricePeriods = [];
     for (const marketPricePeriod of this.marketPricePeriods.value) {
       marketPricePeriods.push({
         ...marketPricePeriod,
         fromDate: this.datePipe.transform(marketPricePeriod.fromDate, dateFormat),
         dateFormat,
-        locale: 'en'
+        locale
       });
     }
     return { marketPricePeriods };

src/app/savings/common-resolvers/savings-transaction-reciept.resolver.ts

@@ -7,6 +7,7 @@ import { Observable } from 'rxjs';
 
 /** Custom Services */
 import { ReportsService } from 'app/reports/reports.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Savings Transaction Reciept resolver.
@@ -16,8 +17,10 @@ export class SavingsTransactionRecieptResolver implements Resolve<Object> {
 
   /**
    * @param {ReportsService} reportsService Reports service.
+   * @param {SettingsService} settingsService Settings Service.
    */
-  constructor(private reportsService: ReportsService) { }
+  constructor(private reportsService: ReportsService,
+              private settingsService: SettingsService) { }
 
   /**
    * Returns the Savings Transaction Reciept
@@ -30,7 +33,7 @@ export class SavingsTransactionRecieptResolver implements Resolve<Object> {
       'output-type':	'PDF',
       R_transactionId:	transactionId
     };
-    return this.reportsService.getPentahoRunReportData('Savings Transaction Receipt', data, 'default', 'en', 'dd MMMM yyyy');
+    return this.reportsService.getPentahoRunReportData('Savings Transaction Receipt', data, 'default', this.settingsService.language.code, this.settingsService.dateFormat);
   }
 
 }

src/app/savings/saving-account-actions/add-charge-savings-account/add-charge-savings-account.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { SavingsService } from '../../savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Add Savings Charge component.
@@ -37,14 +38,14 @@ export class AddChargeSavingsAccountComponent implements OnInit {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {SavingsService} savingsService Savings Service
+   * @param {SettingsService} settingsService Settings Service
    */
-  constructor(
-    private formBuilder: FormBuilder,
-    private route: ActivatedRoute,
-    private router: Router,
-    private datePipe: DatePipe,
-    private savingsService: SavingsService
-  ) {
+  constructor(private formBuilder: FormBuilder,
+              private route: ActivatedRoute,
+              private router: Router,
+              private datePipe: DatePipe,
+              private savingsService: SavingsService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
       this.savingsChargeOptions = data.savingsAccountActionData.chargeOptions;
     });
@@ -111,7 +112,7 @@ export class AddChargeSavingsAccountComponent implements OnInit {
    */
   submit() {
     const savingsCharge = this.savingsChargeForm.value;
-    savingsCharge.locale = 'en';
+    savingsCharge.locale = this.settingsService.language.code;
     if (!savingsCharge.feeInterval) {
       savingsCharge.feeInterval = this.chargeDetails.feeInterval;
     }
@@ -124,7 +125,7 @@ export class AddChargeSavingsAccountComponent implements OnInit {
           savingsCharge.feeOnMonthDay = this.datePipe.transform(prevDate, monthDayFormat);
         }
       } else {
-        const dateFormat = 'yyyy-MM-dd';
+        const dateFormat = this.settingsService.dateFormat;
         savingsCharge.dateFormat = dateFormat;
         if (savingsCharge.dueDate) {
           const prevDate = this.savingsChargeForm.value.dueDate;

src/app/savings/saving-account-actions/savings-account-transactions/savings-account-transactions.component.ts

@@ -6,6 +6,7 @@ import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { SavingsService } from '../../savings.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Create savings account transactions component.
@@ -47,12 +48,14 @@ export class SavingsAccountTransactionsComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route.
    * @param {DatePipe} datePipe DatePipe.
    * @param {Router} router Router for navigation.
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private route: ActivatedRoute,
               private router: Router,
               private datePipe: DatePipe,
-              private savingsService: SavingsService) {
+              private savingsService: SavingsService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
       this.paymentTypeOptions = data.savingsAccountActionData.paymentTypeOptions;
     });
@@ -106,12 +109,12 @@ export class SavingsAccountTransactionsComponent implements OnInit {
   submit() {
     const prevTransactionDate: Date = this.savingAccountTransactionForm.value.transactionDate;
     // TODO: Update once language and date settings are setup
-    const dateFormat = 'dd-MM-yyyy';
+    const dateFormat = this.settingsService.dateFormat;
     this.savingAccountTransactionForm.patchValue({
       transactionDate: this.datePipe.transform(prevTransactionDate, dateFormat)
     });
     const transactionData = this.savingAccountTransactionForm.value;
-    transactionData.locale = 'en';
+    transactionData.locale = this.settingsService.language.code;
     transactionData.dateFormat = dateFormat;
     this.savingsService.executeSavingsAccountTransactionsCommand(this.savingAccountId, this.transactionCommand, transactionData).subscribe(res => {
       this.router.navigate(['../../'], { relativeTo: this.route });

src/app/savings/savings-account-view/transactions-tab/export-transactions/export-transactions.component.ts

@@ -7,6 +7,7 @@ import { ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
 import { ReportsService } from 'app/reports/reports.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Export Client Savings Transactions Component
@@ -38,12 +39,14 @@ export class ExportTransactionsComponent implements OnInit {
    * @param {FormBuilder} formBuilder Form Builder
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private sanitizer: DomSanitizer,
               private reportsService: ReportsService,
               private formBuilder: FormBuilder,
               private datePipe: DatePipe,
-              private route: ActivatedRoute) {
+              private route: ActivatedRoute,
+              private settingsService: SettingsService) {
     this.route.parent.parent.data.subscribe((data: { savingsAccountData: any }) => {
       this.savingsAccountId = data.savingsAccountData.accountNo;
     });
@@ -70,11 +73,11 @@ export class ExportTransactionsComponent implements OnInit {
   generate() {
     const data = {
       'output-type':	'PDF',
-      R_startDate:	this.datePipe.transform(this.transactionsReportForm.value.fromDate, 'yyyy-MM-dd'),
-      R_endDate:	this.datePipe.transform(this.transactionsReportForm.value.toDate, 'yyyy-MM-dd'),
+      R_startDate:	this.datePipe.transform(this.transactionsReportForm.value.fromDate, this.settingsService.dateFormat),
+      R_endDate:	this.datePipe.transform(this.transactionsReportForm.value.toDate, this.settingsService.dateFormat),
       R_savingsAccountId:	this.savingsAccountId
     };
-    this.reportsService.getPentahoRunReportData('Client Saving Transactions', data, 'default', 'en', 'dd MMMM yyyy')
+    this.reportsService.getPentahoRunReportData('Client Saving Transactions', data, 'default', this.settingsService.language.code, this.settingsService.dateFormat)
       .subscribe( (res: any) => {
         const contentType = res.headers.get('Content-Type');
         const file = new Blob([res.body], {type: contentType});

src/app/shared/language-selector/language-selector.component.ts

@@ -27,6 +27,7 @@ export class LanguageSelectorComponent implements OnInit {
    */
   constructor(private i18nService: I18nService) {
     this.languageSelector.setValue(this.currentLanguage);
+    this.languageSelector.valueChanges.subscribe( language => this.setLanguage(language) );
   }
 
   ngOnInit() {

src/app/shares/create-shares-account/create-shares-account.component.ts

@@ -10,6 +10,7 @@ import { SharesAccountChargesStepComponent } from '../shares-account-stepper/sha
 
 /** Custom Services */
 import { SharesService } from '../shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Create Shares Account Component
@@ -39,11 +40,13 @@ export class CreateSharesAccountComponent {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {SharesService} sharesService Shares Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
               private datePipe: DatePipe,
-              private sharesService: SharesService) {
+              private sharesService: SharesService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { sharesAccountTemplate: any }) => {
       this.sharesAccountTemplate = data.sharesAccountTemplate;
     });
@@ -97,8 +100,8 @@ export class CreateSharesAccountComponent {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const sharesAccount = {
       ...this.sharesAccount,
       clientId: this.sharesAccountTemplate.clientId,

src/app/shares/edit-shares-account/edit-shares-account.component.ts

@@ -10,6 +10,7 @@ import { SharesAccountChargesStepComponent } from '../shares-account-stepper/sha
 
 /** Custom Services */
 import { SharesService } from '../shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Edit Shares Account Component
@@ -39,11 +40,13 @@ export class EditSharesAccountComponent {
    * @param {Router} router Router
    * @param {DatePipe} datePipe Date Pipe
    * @param {SharesService} sharesService Shares Service
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private route: ActivatedRoute,
               private router: Router,
               private datePipe: DatePipe,
-              private sharesService: SharesService) {
+              private sharesService: SharesService,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { sharesAccountAndTemplate: any }) => {
       this.sharesAccountAndTemplate = data.sharesAccountAndTemplate;
     });
@@ -102,8 +105,8 @@ export class EditSharesAccountComponent {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const sharesAccount = {
       ...this.sharesAccount,
       clientId: this.sharesAccountAndTemplate.clientId,

src/app/shares/shares-account-actions/activate-shares-account/activate-shares-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Activate Shares Account Component
@@ -32,12 +33,14 @@ export class ActivateSharesAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
   }
 
@@ -63,8 +66,8 @@ export class ActivateSharesAccountComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevActivatedDate: Date = this.activateSharesAccountForm.value.activatedDate;
     this.activateSharesAccountForm.patchValue({
       activatedDate: this.datePipe.transform(prevActivatedDate, dateFormat),

src/app/shares/shares-account-actions/apply-shares/apply-shares.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Apply Shares Component
@@ -35,12 +36,14 @@ export class ApplySharesComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
     this.route.data.subscribe((data: { shareAccountActionData: any }) => {
       this.sharesAccountData = data.shareAccountActionData;
@@ -74,8 +77,8 @@ export class ApplySharesComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevRequestedDate: Date = this.applySharesForm.value.requestedDate;
     this.applySharesForm.patchValue({
       requestedDate: this.datePipe.transform(prevRequestedDate, dateFormat),

src/app/shares/shares-account-actions/approve-shares-account/approve-shares-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Approve Shares Account Component
@@ -32,12 +33,14 @@ export class ApproveSharesAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
   }
 
@@ -64,8 +67,8 @@ export class ApproveSharesAccountComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevApprovedDate: Date = this.approveSharesAccountForm.value.approvedDate;
     this.approveSharesAccountForm.patchValue({
       approvedDate: this.datePipe.transform(prevApprovedDate, dateFormat),

src/app/shares/shares-account-actions/approve-shares/approve-shares.component.ts

@@ -12,6 +12,7 @@ import { ApproveShareDialogComponent } from './approve-share-dialog/approve-shar
 
 /** Custom Serices */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Approve shares component.
@@ -44,10 +45,14 @@ export class ApproveSharesComponent implements OnInit {
 
   /**
    * @param {SharesService} sharesService Shares Service
+   * @param {ActivatedRoute} route Activated Route
+   * @param {MatDialog} dialog Dialog reference.
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private sharesService: SharesService,
               private route: ActivatedRoute,
-              public dialog: MatDialog) {
+              public dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
     this.route.data.subscribe((data: { shareAccountActionData: any }) => {
       this.sharesAccountData = data.shareAccountActionData;
@@ -82,8 +87,8 @@ export class ApproveSharesComponent implements OnInit {
     });
     approveSharesDialogRef.afterClosed().subscribe((response: any) => {
       if (response.approve) {
-        const locale = 'en';
-        const dateFormat = 'dd MMMM yyyy';
+        const locale = this.settingsService.language.code;
+        const dateFormat = this.settingsService.dateFormat;
         const data = {
           requestedShares: [{id}],
           dateFormat,

src/app/shares/shares-account-actions/close-shares-account/close-shares-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Close Shares Account Component
@@ -32,12 +33,14 @@ export class CloseSharesAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
   }
 
@@ -64,8 +67,8 @@ export class CloseSharesAccountComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevClosedDate: Date = this.closeSharesAccountForm.value.closedDate;
     this.closeSharesAccountForm.patchValue({
       closedDate: this.datePipe.transform(prevClosedDate, dateFormat),

src/app/shares/shares-account-actions/redeem-shares/redeem-shares.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Redeem Shares Component
@@ -35,12 +36,14 @@ export class RedeemSharesComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
     this.route.data.subscribe((data: { shareAccountActionData: any }) => {
       this.sharesAccountData = data.shareAccountActionData;
@@ -74,8 +77,8 @@ export class RedeemSharesComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevRequestedDate: Date = this.redeemSharesForm.value.requestedDate;
     this.redeemSharesForm.patchValue({
       requestedDate: this.datePipe.transform(prevRequestedDate, dateFormat),

src/app/shares/shares-account-actions/reject-shares-account/reject-shares-account.component.ts

@@ -6,6 +6,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Reject Shares Account Component
@@ -32,12 +33,14 @@ export class RejectSharesAccountComponent implements OnInit {
    * @param {DatePipe} datePipe Date Pipe
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
+   * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private sharesService: SharesService,
               private datePipe: DatePipe,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
   }
 
@@ -64,8 +67,8 @@ export class RejectSharesAccountComponent implements OnInit {
    */
   submit() {
     // TODO: Update once language and date settings are setup
-    const locale = 'en';
-    const dateFormat = 'dd MMMM yyyy';
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
     const prevRejectedDate: Date = this.rejectSharesAccountForm.value.rejectedDate;
     this.rejectSharesAccountForm.patchValue({
       rejectedDate: this.datePipe.transform(prevRejectedDate, dateFormat),

src/app/shares/shares-account-actions/reject-shares/reject-shares.component.ts

@@ -12,6 +12,7 @@ import { RejectShareDialogComponent } from './reject-share-dialog/reject-share-d
 
 /** Custom Serices */
 import { SharesService } from 'app/shares/shares.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Reject shares component.
@@ -46,10 +47,12 @@ export class RejectSharesComponent implements OnInit {
    * @param {SharesService} sharesService Shares Service
    * @param {ActivatedRoute} route Activated Route
    * @param {MatDialog} dialog Mat Dialog
+   * @param {SettingsService} settingsService Settings Service.
    */
   constructor(private sharesService: SharesService,
               private route: ActivatedRoute,
-              public dialog: MatDialog) {
+              public dialog: MatDialog,
+              private settingsService: SettingsService) {
     this.accountId = this.route.parent.snapshot.params['shareAccountId'];
     this.route.data.subscribe((data: { shareAccountActionData: any }) => {
       this.sharesAccountData = data.shareAccountActionData;
@@ -84,8 +87,8 @@ export class RejectSharesComponent implements OnInit {
     });
     rejectSharesDialogRef.afterClosed().subscribe((response: any) => {
       if (response.reject) {
-        const locale = 'en';
-        const dateFormat = 'dd MMMM yyyy';
+        const locale = this.settingsService.language.code;
+        const dateFormat = this.settingsService.dateFormat;
         const data = {
           requestedShares: [{id}],
           dateFormat,

src/app/system/audit-trails/audit-trails.component.ts

@@ -11,6 +11,7 @@ import { AuditTrailsDataSource } from './audit-trail.datasource';
 
 /** Custom Services */
 import { SystemService } from '../system.service';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** rxjs Imports */
 import { merge } from 'rxjs';
@@ -90,11 +91,11 @@ export class AuditTrailsComponent implements OnInit, AfterViewInit {
     },
     {
       type: 'dateFormat',
-      value: 'yyyy-MM-dd'
+      value: this.settingsService.dateFormat
     },
     {
       type: 'locale',
-      value: 'en'
+      value: this.settingsService.language.code
     }
   ];
   /** User form control. */
@@ -130,7 +131,8 @@ export class AuditTrailsComponent implements OnInit, AfterViewInit {
    */
   constructor(private route: ActivatedRoute,
               private systemService: SystemService,
-              private datePipe: DatePipe) {
+              private datePipe: DatePipe,
+              private settingsService: SettingsService) {
     this.route.data.subscribe((data: { auditTrailSearchTemplate: any }) => {
       this.auditTrailSearchTemplateData = data.auditTrailSearchTemplate;
     });
@@ -382,7 +384,7 @@ export class AuditTrailsComponent implements OnInit, AfterViewInit {
    * Generates the CSV file of Audit Trails Data.
    */
   downloadCSV() {
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     const replacer = (key: any, value: any) => value === undefined ? '' : value;
     const header = ['ID', 'Resource ID', 'Status', 'Office', 'Made On', 'Maker', 'Checked On', 'Checker', 'Entity', 'Action', 'Client'];
     const headerCode = ['id', 'resourceId', 'processingResult', 'officeName', 'madeOnDate', 'maker', 'checkedOnDate', 'checker', 'entityName', 'actionName', 'clientName'];
@@ -411,7 +413,7 @@ export class AuditTrailsComponent implements OnInit, AfterViewInit {
    * @param {any} timestamp Timestamp from which date is to be extracted.
    */
   private getDate(timestamp: any) {
-    const dateFormat = 'yyyy-MM-dd';
+    const dateFormat = this.settingsService.dateFormat;
     return this.datePipe.transform(timestamp, dateFormat);
   }
 

src/app/system/entity-to-entity-mapping/entity-to-entity-mapping.component.ts

@@ -10,6 +10,7 @@ import { DatePipe } from '@angular/common';
 /** Custom Services */
 import { SystemService } from 'app/system/system.service';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { SettingsService } from 'app/settings/settings.service';
 
 /** Custom Components */
 import { DeleteDialogComponent } from '../../shared/delete-dialog/delete-dialog.component';
@@ -82,7 +83,8 @@ export class EntityToEntityMappingComponent implements OnInit {
     private formBuilder: FormBuilder,
     private systemService: SystemService,
     private datePipe: DatePipe,
-    private dialog: MatDialog) {
+    private dialog: MatDialog,
+    private settingsService: SettingsService) {
     this.route.data.subscribe((data: { entityMappings: any }) => {
       this.entityMappings = data.entityMappings;
     });
@@ -313,7 +315,7 @@ export class EntityToEntityMappingComponent implements OnInit {
     if (addMappingForm.value.toId === '') {
       addMappingForm.value.toId = undefined;
     }
-    const dateFormat = 'dd MMMM yyyy';
+    const dateFormat = this.settingsService.dateFormat;
 
     const startDate: Date = addMappingForm.value.startDate;
     const endDate: Date = addMappingForm.value.endDate;
@@ -324,7 +326,7 @@ export class EntityToEntityMappingComponent implements OnInit {
     });
     const newMappingData = addMappingForm.value;
     newMappingData.dateFormat = dateFormat;
-    newMappingData.locale = 'en';
+    newMappingData.locale = this.settingsService.language.code;
     this.systemService.createMapping(this.relId, newMappingData).subscribe((response: any) => {
       this.showFilteredData();
     });
@@ -335,7 +337,7 @@ export class EntityToEntityMappingComponent implements OnInit {
    * @param editMappingForm Edit Mapping Form Id
    */
   submitEdit(editMappingForm: any) {
-    const dateFormat = 'dd MMMM yyyy';
+    const dateFormat = this.settingsService.dateFormat;
 
     const startDate: Date = editMappingForm.value.startDate;
     const endDate: Date = editMappingForm.value.endDate;
@@ -346,7 +348,7 @@ export class EntityToEntityMappingComponent implements OnInit {
     });
     const newMappingData = editMappingForm.value;
     newMappingData.dateFormat = dateFormat;
-    newMappingData.locale = 'en';
+    newMappingData.locale = this.settingsService.language.code;
     this.systemService.editMapping(this.mapIdToEdit, newMappingData).subscribe((response: any) => {
       this.showFilteredData();
     });

src/app/web-app.component.ts

@@ -150,6 +150,7 @@ export class WebAppComponent implements OnInit {
       this.settingsService.setServers([
         'https://dev.mifos.io',
         'https://demo.mifos.io',
+        'https://qa.mifos.io',
         'https://staging.mifos.io',
         'https://mobile.mifos.io',
         'https://demo.fineract.dev',

src/assets/translations/en-US.json

@@ -11,5 +11,10 @@
   "Username is required": "Username is required",
   "Username or password incorrect.": "Username or password incorrect",
   "Remember me": "Remember me",
-  "Version": "Version"
+  "Version": "Version",
+  "Accounting": "Accounting",
+  "Reports": "Reports",
+  "Admin": "Admin",
+  "Self Service": "Self Service",
+  "Institution": "Institution"
 }

src/assets/translations/fr-FR.json

@@ -11,5 +11,10 @@
   "Username is required": "Identifiant requis",
   "Username or password incorrect.": "Identifiant ou mot de passe incorrect",
   "Remember me": "Rester connecté",
-  "Version": "Version"
+  "Version": "Version",
+  "Accounting": "Comptabilité",
+  "Reports": "Rapports",
+  "Admin": "Admin",
+  "Self Service": "En libre service",
+  "Institution": "Institution"
 }

src/theme/pink-bluegrey.scss

@@ -1 +1,10 @@
 @import "~@angular/material/prebuilt-themes/pink-bluegrey.css";
+
+div.alert {
+    background-color: dimgray !important;
+}
+
+table.mat-table tbody tr:nth-child(even) {
+    background-color: dimgray !important;
+}
+

src/theme/purple-green.scss

@@ -1 +1,10 @@
 @import "~@angular/material/prebuilt-themes/purple-green.css";
+
+div.alert {
+    background-color: dimgray !important;
+}
+
+table.mat-table tbody tr:nth-child(even) {
+    background-color: dimgray !important;
+}
+