convert analytics and toaster to platform utils

jslib

@@ -1 +1 @@
-Subproject commit 45341ec408319cbf69a4772e503a3991ae770a49
+Subproject commit 6b3dc2344f2db167cbc404d83fa4602a1ca93ef8

src/app/accounts/hint.component.ts

@@ -1,11 +1,9 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { ApiService } from 'jslib/abstractions/api.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 
 import { HintComponent as BaseHintComponent } from 'jslib/angular/components/hint.component';
 
@@ -14,9 +12,8 @@ import { HintComponent as BaseHintComponent } from 'jslib/angular/components/hin
     templateUrl: 'hint.component.html',
 })
 export class HintComponent extends BaseHintComponent {
-    constructor(router: Router, analytics: Angulartics2,
+    constructor(router: Router, i18nService: I18nService,
-        toasterService: ToasterService, i18nService: I18nService,
+        apiService: ApiService, platformUtilsService: PlatformUtilsService) {
-        apiService: ApiService) {
+        super(router, i18nService, apiService, platformUtilsService);
-        super(router, analytics, toasterService, i18nService, apiService);
     }
 }

src/app/accounts/lock.component.ts

@@ -4,9 +4,6 @@ import {
 } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { CryptoService } from 'jslib/abstractions/crypto.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
 import { MessagingService } from 'jslib/abstractions/messaging.service';
@@ -22,13 +19,11 @@ import { LockComponent as BaseLockComponent } from 'jslib/angular/components/loc
     templateUrl: 'lock.component.html',
 })
 export class LockComponent extends BaseLockComponent implements OnInit {
-    constructor(router: Router, analytics: Angulartics2,
+    constructor(router: Router, i18nService: I18nService,
-        toasterService: ToasterService, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, messagingService: MessagingService,
         userService: UserService, cryptoService: CryptoService,
         private routerService: RouterService) {
-        super(router, analytics, toasterService, i18nService, platformUtilsService,
+        super(router, i18nService, platformUtilsService, messagingService, userService, cryptoService);
-            messagingService, userService, cryptoService);
     }
 
     async ngOnInit() {

src/app/accounts/login.component.ts

@@ -4,11 +4,9 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { AuthService } from 'jslib/abstractions/auth.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 import { StateService } from 'jslib/abstractions/state.service';
 import { StorageService } from 'jslib/abstractions/storage.service';
 
@@ -20,10 +18,10 @@ import { LoginComponent as BaseLoginComponent } from 'jslib/angular/components/l
 })
 export class LoginComponent extends BaseLoginComponent {
     constructor(authService: AuthService, router: Router,
-        analytics: Angulartics2, toasterService: ToasterService,
         i18nService: I18nService, private route: ActivatedRoute,
-        storageService: StorageService, private stateService: StateService) {
+        storageService: StorageService, private stateService: StateService,
-        super(authService, router, analytics, toasterService, i18nService, storageService);
+        platformUtilsService: PlatformUtilsService) {
+        super(authService, router, platformUtilsService, i18nService, storageService);
         this.onSuccessfulLoginNavigate = this.goAfterLogIn;
     }
 

src/app/accounts/register.component.ts

@@ -4,9 +4,6 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { ApiService } from 'jslib/abstractions/api.service';
 import { AuthService } from 'jslib/abstractions/auth.service';
 import { CryptoService } from 'jslib/abstractions/crypto.service';
@@ -25,12 +22,10 @@ export class RegisterComponent extends BaseRegisterComponent {
     showTerms = true;
 
     constructor(authService: AuthService, router: Router,
-        analytics: Angulartics2, toasterService: ToasterService,
         i18nService: I18nService, cryptoService: CryptoService,
         apiService: ApiService, private route: ActivatedRoute,
         stateService: StateService, platformUtilsService: PlatformUtilsService) {
-        super(authService, router, analytics, toasterService, i18nService, cryptoService, apiService, stateService,
+        super(authService, router, i18nService, cryptoService, apiService, stateService, platformUtilsService);
-            platformUtilsService);
         this.showTerms = !platformUtilsService.isSelfHost();
     }
 

src/app/accounts/two-factor-options.component.ts

@@ -1,9 +1,6 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { AuthService } from 'jslib/abstractions/auth.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
@@ -18,8 +15,7 @@ import {
 })
 export class TwoFactorOptionsComponent extends BaseTwoFactorOptionsComponent {
     constructor(authService: AuthService, router: Router,
-        analytics: Angulartics2, toasterService: ToasterService,
         i18nService: I18nService, platformUtilsService: PlatformUtilsService) {
-        super(authService, router, analytics, toasterService, i18nService, platformUtilsService, window);
+        super(authService, router, i18nService, platformUtilsService, window);
     }
 }

src/app/accounts/two-factor.component.ts

@@ -7,9 +7,6 @@ import {
 
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { TwoFactorOptionsComponent } from './two-factor-options.component';
 
 import { ModalComponent } from '../modal.component';
@@ -33,12 +30,10 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
     @ViewChild('twoFactorOptions', { read: ViewContainerRef }) twoFactorOptionsModal: ViewContainerRef;
 
     constructor(authService: AuthService, router: Router,
-        analytics: Angulartics2, toasterService: ToasterService,
         i18nService: I18nService, apiService: ApiService,
         platformUtilsService: PlatformUtilsService, private stateService: StateService,
         environmentService: EnvironmentService, private componentFactoryResolver: ComponentFactoryResolver) {
-        super(authService, router, analytics, toasterService, i18nService, apiService,
+        super(authService, router, i18nService, apiService, platformUtilsService, window, environmentService);
-            platformUtilsService, window, environmentService);
         this.onSuccessfulLoginNavigate = this.goAfterLogIn;
     }
 

src/app/app.component.ts

@@ -3,7 +3,10 @@ import * as _swal from 'sweetalert';
 import { SweetAlert } from 'sweetalert/typings/core';
 
 import {
+    BodyOutputType,
+    Toast,
     ToasterConfig,
+    ToasterContainerComponent,
     ToasterService,
 } from 'angular2-toaster';
 import { Angulartics2 } from 'angulartics2';
@@ -14,7 +17,9 @@ import {
     NgZone,
     OnDestroy,
     OnInit,
+    SecurityContext,
 } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
 import {
     NavigationEnd,
     Router,
@@ -75,7 +80,7 @@ export class AppComponent implements OnDestroy, OnInit {
         private platformUtilsService: PlatformUtilsService, private ngZone: NgZone,
         private lockService: LockService, private storageService: StorageService,
         private cryptoService: CryptoService, private collectionService: CollectionService,
-        private routerService: RouterService, private searchService: SearchService,
+        private sanitizer: DomSanitizer, private searchService: SearchService,
         private notificationsService: NotificationsService) { }
 
     ngOnInit() {
@@ -126,6 +131,15 @@ export class AppComponent implements OnDestroy, OnInit {
                             this.router.navigate(['settings/premium']);
                         }
                         break;
+                    case 'showToast':
+                        this.showToast(message);
+                        break;
+                    case 'analyticsEventTrack':
+                        this.analytics.eventTrack.next({
+                            action: message.action,
+                            properties: { label: message.label },
+                        });
+                        break;
                     default:
                         break;
                 }
@@ -202,6 +216,33 @@ export class AppComponent implements OnDestroy, OnInit {
         }, IdleTimeout);
     }
 
+    private showToast(msg: any) {
+        const toast: Toast = {
+            type: msg.type,
+            title: msg.title,
+        };
+        if (typeof (msg.text) === 'string') {
+            toast.body = msg.text;
+        } else if (msg.text.length === 1) {
+            toast.body = msg.text[0];
+        } else {
+            let message = '';
+            msg.text.forEach((t: string) =>
+                message += ('<p>' + this.sanitizer.sanitize(SecurityContext.HTML, t) + '</p>'));
+            toast.body = message;
+            toast.bodyOutputType = BodyOutputType.TrustedHtml;
+        }
+        if (msg.options != null) {
+            if (msg.options.trustedHtml === true) {
+                toast.bodyOutputType = BodyOutputType.TrustedHtml;
+            }
+            if (msg.options.timeout != null && msg.options.timeout > 0) {
+                toast.timeout = msg.options.timeout;
+            }
+        }
+        this.toasterService.popAsync(toast);
+    }
+
     private idleStateChanged() {
         if (this.isIdle) {
             this.notificationsService.disconnectFromInactivity();

src/app/organizations/tools/export.component.ts

@@ -1,6 +1,3 @@
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
@@ -18,11 +15,10 @@ import { ExportComponent as BaseExportComponent } from '../../tools/export.compo
 export class ExportComponent extends BaseExportComponent {
     organizationId: string;
 
-    constructor(analytics: Angulartics2, toasterService: ToasterService,
+    constructor(cryptoService: CryptoService, i18nService: I18nService,
-        cryptoService: CryptoService, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, exportService: ExportService,
         private route: ActivatedRoute) {
-        super(analytics, toasterService, cryptoService, i18nService, platformUtilsService, exportService);
+        super(cryptoService, i18nService, platformUtilsService, exportService);
     }
 
     ngOnInit() {

src/app/organizations/vault/add-edit.component.ts

@@ -3,9 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { ApiService } from 'jslib/abstractions/api.service';
 import { AuditService } from 'jslib/abstractions/audit.service';
 import { CipherService } from 'jslib/abstractions/cipher.service';
@@ -35,14 +32,12 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit {
 
     constructor(cipherService: CipherService, folderService: FolderService,
         i18nService: I18nService, platformUtilsService: PlatformUtilsService,
-        analytics: Angulartics2, toasterService: ToasterService,
         auditService: AuditService, stateService: StateService,
         userService: UserService, totpService: TotpService,
         passwordGenerationService: PasswordGenerationService, private apiService: ApiService,
         messagingService: MessagingService) {
-        super(cipherService, folderService, i18nService, platformUtilsService, analytics,
+        super(cipherService, folderService, i18nService, platformUtilsService, auditService, stateService,
-            toasterService, auditService, stateService, userService, totpService, passwordGenerationService,
+            userService, totpService, passwordGenerationService, messagingService);
-            messagingService);
     }
 
     protected async loadCipher() {

src/app/organizations/vault/attachments.component.ts

@@ -1,8 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { ApiService } from 'jslib/abstractions/api.service';
 import { CipherService } from 'jslib/abstractions/cipher.service';
 import { CryptoService } from 'jslib/abstractions/crypto.service';
@@ -23,12 +20,10 @@ import { AttachmentsComponent as BaseAttachmentsComponent } from '../../vault/at
 export class AttachmentsComponent extends BaseAttachmentsComponent {
     organization: Organization;
 
-    constructor(cipherService: CipherService, analytics: Angulartics2,
+    constructor(cipherService: CipherService, i18nService: I18nService,
-        toasterService: ToasterService, i18nService: I18nService,
         cryptoService: CryptoService, userService: UserService,
         platformUtilsService: PlatformUtilsService, private apiService: ApiService) {
-        super(cipherService, analytics, toasterService, i18nService, cryptoService, userService,
+        super(cipherService, i18nService, cryptoService, userService, platformUtilsService);
-            platformUtilsService);
     }
 
     protected async loadCipher() {

src/app/services/services.module.ts

@@ -83,7 +83,7 @@ const i18nService = new I18nService(window.navigator.language, 'locales');
 const stateService = new StateService();
 const broadcasterService = new BroadcasterService();
 const messagingService = new BroadcasterMessagingService(broadcasterService);
-const platformUtilsService = new WebPlatformUtilsService(i18nService);
+const platformUtilsService = new WebPlatformUtilsService(i18nService, messagingService);
 const storageService: StorageServiceAbstraction = new HtmlStorageService(platformUtilsService);
 const secureStorageService: StorageServiceAbstraction = new MemoryStorageService();
 const cryptoFunctionService: CryptoFunctionServiceAbstraction = new WebCryptoFunctionService(window,

src/app/tools/export.component.ts

@@ -1,6 +1,3 @@
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { Component } from '@angular/core';
 
 import { CryptoService } from 'jslib/abstractions/crypto.service';
@@ -15,16 +12,14 @@ import { ExportComponent as BaseExportComponent } from 'jslib/angular/components
     templateUrl: 'export.component.html',
 })
 export class ExportComponent extends BaseExportComponent {
-    constructor(analytics: Angulartics2, toasterService: ToasterService,
+    constructor(cryptoService: CryptoService, i18nService: I18nService,
-        cryptoService: CryptoService, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, exportService: ExportService) {
-        super(analytics, toasterService, cryptoService, i18nService, platformUtilsService,
+        super(cryptoService, i18nService, platformUtilsService, exportService, window);
-            exportService, window);
     }
 
     protected saved() {
         super.saved();
         this.masterPassword = null;
-        this.toasterService.popAsync('success', null, this.i18nService.t('exportSuccess'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('exportSuccess'));
     }
 }

src/app/tools/import.component.ts

@@ -129,7 +129,7 @@ export class ImportComponent implements OnInit {
             reader.onload = (evt) => {
                 if (this.format === 'lastpasscsv' && file.type === 'text/html') {
                     const parser = new DOMParser();
-                    const doc = parser.parseFromString(evt.target.result, 'text/html');
+                    const doc = parser.parseFromString((evt.target as any).result, 'text/html');
                     const pre = doc.querySelector('pre');
                     if (pre != null) {
                         resolve(pre.textContent);
@@ -139,7 +139,7 @@ export class ImportComponent implements OnInit {
                     return;
                 }
 
-                resolve(evt.target.result);
+                resolve((evt.target as any).result);
             };
             reader.onerror = () => {
                 reject();

src/app/tools/password-generator-history.component.ts

@@ -1,6 +1,3 @@
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { Component } from '@angular/core';
 
 import { I18nService } from 'jslib/abstractions/i18n.service';
@@ -16,9 +13,8 @@ import {
     templateUrl: 'password-generator-history.component.html',
 })
 export class PasswordGeneratorHistoryComponent extends BasePasswordGeneratorHistoryComponent {
-    constructor(passwordGenerationService: PasswordGenerationService, analytics: Angulartics2,
+    constructor(passwordGenerationService: PasswordGenerationService, platformUtilsService: PlatformUtilsService,
-        platformUtilsService: PlatformUtilsService, i18nService: I18nService,
+        i18nService: I18nService) {
-        toasterService: ToasterService) {
+        super(passwordGenerationService, platformUtilsService, i18nService, window);
-        super(passwordGenerationService, analytics, platformUtilsService, i18nService, toasterService, window);
     }
 }

src/app/tools/password-generator.component.ts

@@ -1,6 +1,3 @@
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import {
     Component,
     ComponentFactoryResolver,
@@ -28,10 +25,9 @@ export class PasswordGeneratorComponent extends BasePasswordGeneratorComponent {
 
     private modal: ModalComponent = null;
 
-    constructor(passwordGenerationService: PasswordGenerationService, analytics: Angulartics2,
+    constructor(passwordGenerationService: PasswordGenerationService, platformUtilsService: PlatformUtilsService,
-        platformUtilsService: PlatformUtilsService, i18nService: I18nService,
+        i18nService: I18nService, private componentFactoryResolver: ComponentFactoryResolver) {
-        toasterService: ToasterService, private componentFactoryResolver: ComponentFactoryResolver) {
+        super(passwordGenerationService, platformUtilsService, i18nService, window);
-        super(passwordGenerationService, analytics, platformUtilsService, i18nService, toasterService, window);
     }
 
     history() {

src/app/vault/add-edit.component.ts

@@ -3,9 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { CipherType } from 'jslib/enums/cipherType';
 
 import { AuditService } from 'jslib/abstractions/audit.service';
@@ -41,12 +38,10 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit {
 
     constructor(cipherService: CipherService, folderService: FolderService,
         i18nService: I18nService, platformUtilsService: PlatformUtilsService,
-        analytics: Angulartics2, toasterService: ToasterService,
         auditService: AuditService, stateService: StateService,
         protected userService: UserService, protected totpService: TotpService,
         protected passwordGenerationService: PasswordGenerationService, protected messagingService: MessagingService) {
-        super(cipherService, folderService, i18nService, platformUtilsService, analytics,
+        super(cipherService, folderService, i18nService, platformUtilsService, auditService, stateService);
-            toasterService, auditService, stateService);
     }
 
     async ngOnInit() {
@@ -77,7 +72,7 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit {
             return;
         }
 
-        this.analytics.eventTrack.next({ action: 'Launched Login URI' });
+        this.platformUtilsService.eventTrack('Launched Login URI');
         this.platformUtilsService.launchUri(uri.uri);
     }
 
@@ -86,9 +81,9 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit {
             return;
         }
 
-        this.analytics.eventTrack.next({ action: 'Copied ' + aType });
+        this.platformUtilsService.eventTrack('Copied ' + aType);
         this.platformUtilsService.copyToClipboard(value, { window: window });
-        this.toasterService.popAsync('info', null,
+        this.platformUtilsService.showToast('info', null,
             this.i18nService.t('valueCopied', this.i18nService.t(typeI18nKey)));
     }
 
@@ -157,5 +152,4 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit {
             await this.totpUpdateCode();
         }
     }
-
 }

src/app/vault/attachments.component.ts

@@ -1,8 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { CipherService } from 'jslib/abstractions/cipher.service';
 import { CryptoService } from 'jslib/abstractions/crypto.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
@@ -16,11 +13,9 @@ import { AttachmentsComponent as BaseAttachmentsComponent } from 'jslib/angular/
     templateUrl: 'attachments.component.html',
 })
 export class AttachmentsComponent extends BaseAttachmentsComponent {
-    constructor(cipherService: CipherService, analytics: Angulartics2,
+    constructor(cipherService: CipherService, i18nService: I18nService,
-        toasterService: ToasterService, i18nService: I18nService,
         cryptoService: CryptoService, userService: UserService,
         platformUtilsService: PlatformUtilsService) {
-        super(cipherService, analytics, toasterService, i18nService, cryptoService, userService,
+        super(cipherService, i18nService, cryptoService, userService, platformUtilsService, window);
-            platformUtilsService, window);
     }
 }

src/app/vault/folder-add-edit.component.ts

@@ -1,8 +1,5 @@
 import { Component } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-import { Angulartics2 } from 'angulartics2';
-
 import { FolderService } from 'jslib/abstractions/folder.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
@@ -17,8 +14,7 @@ import {
 })
 export class FolderAddEditComponent extends BaseFolderAddEditComponent {
     constructor(folderService: FolderService, i18nService: I18nService,
-        analytics: Angulartics2, toasterService: ToasterService,
         platformUtilsService: PlatformUtilsService) {
-        super(folderService, i18nService, analytics, toasterService, platformUtilsService);
+        super(folderService, i18nService, platformUtilsService);
     }
 }

src/services/webPlatformUtils.service.ts

@@ -4,6 +4,7 @@ import { SweetAlert } from 'sweetalert/typings/core';
 import { DeviceType } from 'jslib/enums/deviceType';
 
 import { I18nService } from 'jslib/abstractions/i18n.service';
+import { MessagingService } from 'jslib/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 
 import { Utils } from 'jslib/misc/utils';
@@ -16,7 +17,7 @@ export class WebPlatformUtilsService implements PlatformUtilsService {
 
     private browserCache: DeviceType = null;
 
-    constructor(private i18nService: I18nService) { }
+    constructor(private i18nService: I18nService, private messagingService: MessagingService) { }
 
     getDevice(): DeviceType {
         if (this.browserCache != null) {
@@ -143,8 +144,14 @@ export class WebPlatformUtilsService implements PlatformUtilsService {
         return true;
     }
 
-    showToast(type: 'error' | 'success' | 'warning' | 'info', title: string, text: string, global?: any): void {
+    showToast(type: 'error' | 'success' | 'warning' | 'info', title: string, text: string | string[],
-        throw new Error('showToast not implemented');
+        options?: any): void {
+        this.messagingService.send('showToast', {
+            text: text,
+            title: title,
+            type: type,
+            options: options,
+        });
     }
 
     async showDialog(text: string, title?: string, confirmText?: string, cancelText?: string, type?: string) {
@@ -199,6 +206,14 @@ export class WebPlatformUtilsService implements PlatformUtilsService {
         return confirmed;
     }
 
+    eventTrack(action: string, label?: string, options?: any) {
+        this.messagingService.send('analyticsEventTrack', {
+            action: action,
+            label: label,
+            options: options,
+        });
+    }
+
     isDev(): boolean {
         return process.env.ENV === 'development';
     }

tsconfig.json

@@ -22,12 +22,6 @@
       "@angular/*": [
         "node_modules/@angular/*"
       ],
-      "angular2-toaster": [
-        "node_modules/angular2-toaster"
-      ],
-      "angulartics2": [
-        "node_modules/angulartics2"
-      ],
       "node": [
         "node_modules/@types/node"
       ]