i18n service and helpers

src/app/accounts/login.component.ts

@@ -18,7 +18,6 @@ export class LoginComponent implements OnInit {
     masterPassword: string = '';
 
     constructor(private authService: AuthService, private router: Router) {
-
     }
 
     ngOnInit() {

src/app/app.module.ts

@@ -11,6 +11,7 @@ import { AppComponent } from './app.component';
 import { CiphersComponent } from './vault/ciphers.component';
 import { FallbackSrcDirective } from './directives/fallback-src.directive';
 import { GroupingsComponent } from './vault/groupings.component';
+import { I18nPipe } from './pipes/i18n.pipe';
 import { IconComponent } from './vault/icon.component';
 import { LoginComponent } from './accounts/login.component';
 import { StopClickDirective } from './directives/stop-click.directive';
@@ -30,6 +31,7 @@ import { ViewComponent } from './vault/view.component';
         CiphersComponent,
         FallbackSrcDirective,
         GroupingsComponent,
+        I18nPipe,
         IconComponent,
         LoginComponent,
         StopClickDirective,

src/app/pipes/i18n.pipe.ts

@@ -0,0 +1,18 @@
+import {
+    Pipe,
+    PipeTransform,
+} from '@angular/core';
+
+import { I18nService } from '../../services/i18n.service';
+
+@Pipe({
+    name: 'i18n',
+})
+export class I18nPipe implements PipeTransform {
+    constructor(private i18nService: I18nService) {
+    }
+
+    transform(id: string): string {
+        return this.i18nService.t(id);
+    }
+}

src/app/services/services.module.ts

@@ -1,11 +1,15 @@
 import { webFrame } from 'electron';
 
-import { NgModule } from '@angular/core';
+import {
+    APP_INITIALIZER,
+    NgModule
+} from '@angular/core';
 
 import { DesktopMessagingService } from '../../services/desktopMessaging.service';
 import { DesktopPlatformUtilsService } from '../../services/desktopPlatformUtils.service';
 import { DesktopStorageService } from '../../services/desktopStorage.service';
 import { DesktopSecureStorageService } from '../../services/desktopSecureStorage.service';
+import { I18nService } from '../../services/i18n.service';
 
 import {
     ApiService,
@@ -52,6 +56,7 @@ import {
 
 webFrame.registerURLSchemeAsPrivileged('file');
 
+const i18nService = new I18nService(window, './_locales');
 const utilsService = new UtilsService();
 const platformUtilsService = new DesktopPlatformUtilsService();
 const messagingService = new DesktopMessagingService();
@@ -69,7 +74,7 @@ const settingsService = new SettingsService(userService, storageService);
 const cipherService = new CipherService(cryptoService, userService, settingsService,
     apiService, storageService);
 const folderService = new FolderService(cryptoService, userService,
-    () => 'No Folder', apiService, storageService);
+    () => i18nService.t('noneFolder'), apiService, storageService);
 const collectionService = new CollectionService(cryptoService, userService, storageService);
 const lockService = new LockService(cipherService, folderService, collectionService,
     cryptoService, platformUtilsService, storageService,
@@ -89,6 +94,10 @@ environmentService.setUrlsFromStorage().then(() => {
     return syncService.fullSync(true);
 });
 
+function initFactory(i18n: I18nService): Function {
+    return () => i18n.init();
+}
+
 @NgModule({
     imports: [],
     declarations: [],
@@ -98,6 +107,13 @@ environmentService.setUrlsFromStorage().then(() => {
         { provide: FolderServiceAbstraction, useValue: folderService },
         { provide: CollectionServiceAbstraction, useValue: collectionService },
         { provide: EnvironmentServiceAbstraction, useValue: environmentService },
+        { provide: I18nService, useValue: i18nService },
+        {
+            provide: APP_INITIALIZER,
+            useFactory: initFactory,
+            deps: [I18nService],
+            multi: true
+        }
     ],
 })
 export class ServicesModule {

src/app/vault/view.component.html

@@ -9,17 +9,19 @@
                     <span class="row-label">Name</span>
                     {{cipher.name}}
                 </div>
-                <div class="box-content-row">
-                    <span class="row-label">URI</span>
-                    {{cipher.login.uri}}
-                </div>
-                <div class="box-content-row">
-                    <span class="row-label">Username</span>
-                    {{cipher.login.username}}
-                </div>
-                <div class="box-content-row">
-                    <span class="row-label">Password</span>
-                    {{cipher.login.password}}
+                <div *ngIf="cipher.login">
+                    <div class="box-content-row">
+                        <span class="row-label">URI</span>
+                        {{cipher.login.uri}}
+                    </div>
+                    <div class="box-content-row">
+                        <span class="row-label">Username</span>
+                        {{cipher.login.username}}
+                    </div>
+                    <div class="box-content-row">
+                        <span class="row-label">Password</span>
+                        {{cipher.login.password}}
+                    </div>
                 </div>
             </div>
             <div class="box-footer">