Merge commit '2b0a9d995e0147601ca8ae4778434a19354a60c2' into feature/cme-connector

.editorconfig

@@ -12,7 +12,7 @@ insert_final_newline = true
 [*.{js,ts,scss,html}]
 charset = utf-8
 indent_style = space
-indent_size = 4
+indent_size = 2
 
 [*.{ts}]
 quote_type = single

.github/workflows/build.yml

@@ -40,8 +40,7 @@ jobs:
 
       - name: Get GitHub sha as version
         id: version
-        run: |
+        run: echo "::set-output name=value::${GITHUB_SHA:0:7}"
-          echo "::set-output name=value::${GITHUB_SHA:0:7}"
 
 
   build-oss-selfhost:
@@ -54,11 +53,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea
         with:
-          node-version: '14'
+          node-version: '16'
-
-      - name: Update NPM
-        run: |
-          npm install -g npm@7
 
       - name: Cache npm
         id: npm-cache
@@ -106,11 +101,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea
         with:
-          node-version: '14'
+          node-version: '16'
-
-      - name: Update NPM
-        run: |
-          npm install -g npm@7
 
       - name: Cache npm
         id: npm-cache
@@ -158,11 +149,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea
         with:
-          node-version: '14'
+          node-version: '16'
-
-      - name: Update NPM
-        run: |
-          npm install -g npm@7
 
       - name: Cache npm
         id: npm-cache
@@ -182,7 +169,7 @@ jobs:
           echo "GitHub event: $GITHUB_EVENT"
 
       - name: Setup DCT
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/hotfix'
         id: setup-dct
         uses: bitwarden/gh-actions/setup-docker-trust@a8c384a05a974c05c48374c818b004be221d43ff
         with:
@@ -228,12 +215,12 @@ jobs:
         if: github.ref == 'refs/heads/master'
         run: docker tag bitwarden/web bitwarden/web:dev
 
-      - name: Tag release branch
+      - name: Tag hotfix branch
-        if: github.ref == 'refs/heads/release'
+        if: github.ref == 'refs/heads/hotfix'
-        run: docker tag bitwarden/web bitwarden/web:latest
+        run: docker tag bitwarden/web bitwarden/web:hotfix
 
       - name: List Docker images
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/hotfix'
         run: docker images
 
       - name: Push rc image
@@ -250,15 +237,15 @@ jobs:
           DOCKER_CONTENT_TRUST: 1
           DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}
 
-      - name: Push latest image
+      - name: Push hotfix image
-        if: github.ref == 'refs/heads/release'
+        if: github.ref == 'refs/heads/hotfix'
-        run: docker push bitwarden/web:latest
+        run: docker push bitwarden/web:hotfix
         env:
           DOCKER_CONTENT_TRUST: 1
           DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}
 
       - name: Log out of Docker
-        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/release'
+        if: github.ref == 'refs/heads/master' || github.ref == 'refs/heads/rc' || github.ref == 'refs/heads/hotfix'
         run: docker logout
 
 
@@ -269,11 +256,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea
         with:
-          node-version: '14'
+          node-version: '16'
-
-      - name: Update NPM
-        run: |
-          npm install -g npm@7
 
       - name: Cache npm
         id: npm-cache
@@ -326,21 +309,21 @@ jobs:
           docker --version
           docker build -t bitwardenqa.azurecr.io/web .
 
-      - name: Get image tag
+      # - name: Get image tag
-        id: image-tag
+      #   id: image-tag
-        run: |
+      #   run: |
-          IMAGE_TAG=$(echo "$GITHUB_REF" | awk '{split($0, a, "/"); print a[3];}')
+      #     IMAGE_TAG=$(echo "$GITHUB_REF" | awk '{split($0, a, "/"); print a[3];}')
-          TAG_EXTENSION=${{ github.event.inputs.custom_tag_extension }}
+      #     TAG_EXTENSION=${{ github.event.inputs.custom_tag_extension }}
 
-          if [[ $TAG_EXTENSION ]]; then
+      #     if [[ $TAG_EXTENSION ]]; then
-            IMAGE_TAG=$IMAGE_TAG-$TAG_EXTENSION
+      #       IMAGE_TAG=$IMAGE_TAG-$TAG_EXTENSION
-          fi
+      #     fi
-          echo "::set-output name=value::$IMAGE_TAG"
+      #     echo "::set-output name=value::$IMAGE_TAG"
 
-      - name: Tag image
+      # - name: Tag image
-        env:
+      #   env:
-          IMAGE_TAG: ${{ steps.image-tag.outputs.value }}
+      #     IMAGE_TAG: ${{ steps.image-tag.outputs.value }}
-        run: docker tag bitwardenqa.azurecr.io/web "bitwardenqa.azurecr.io/web:$IMAGE_TAG"
+      #   run: docker tag bitwardenqa.azurecr.io/web "bitwardenqa.azurecr.io/web:$IMAGE_TAG"
 
       - name: Tag dev
         if: github.ref == 'refs/heads/master'
@@ -349,10 +332,10 @@ jobs:
       - name: List Docker images
         run: docker images
 
-      - name: Push image
+      # - name: Push image
-        env:
+      #   env:
-          IMAGE_TAG: ${{ steps.image-tag.outputs.value }}
+      #     IMAGE_TAG: ${{ steps.image-tag.outputs.value }}
-        run: docker push "bitwardenqa.azurecr.io/web:$IMAGE_TAG"
+      #   run: docker push "bitwardenqa.azurecr.io/web:$IMAGE_TAG"
 
       - name: Push dev images
         if: github.ref == 'refs/heads/master'
@@ -384,11 +367,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@46071b5c7a2e0c34e49c3cb8a0e792e86e18d5ea
         with:
-          node-version: '14'
+          node-version: '16'
-
-      - name: Update NPM
-        run: |
-          npm install -g npm@7
 
       - name: Print environment
         run: |
@@ -409,8 +388,8 @@ jobs:
       - name: Install dependencies
         run: npm ci
 
-      - name: Run linter
+      # - name: Run linter
-        run: npm run lint
+      #   run: npm run lint
 
       - name: NPM build
         run: npm run build:bit:cloud

.github/workflows/release.yml

@@ -54,6 +54,7 @@ jobs:
     runs-on: ubuntu-20.04
     needs: setup
     env:
+      _BRANCH_NAME: ${{ needs.setup.outputs.branch-name }}
       _RELEASE_VERSION: ${{ needs.setup.outputs.release_version }}
     steps:
       - name: Print environment
@@ -73,22 +74,24 @@ jobs:
       - name: Checkout repo
         uses: actions/checkout@5a4ac9002d0be2fb38bd78e4b4dbde5606d7042f
 
-      - name: Pull latest selfhost Release image
+      - name: Pull latest selfhost image
-        run: docker pull bitwarden/web:latest
+        run: docker pull bitwarden/web:$_BRANCH_NAME
 
-      - name: Tag version
+      - name: Tag version and latest
         run: |
-          docker tag bitwarden/web:latest bitwarden/web:$_RELEASE_VERSION
+          docker tag bitwarden/web:$_BRANCH_NAME bitwarden/web:$_RELEASE_VERSION
+          docker tag bitwarden/web:$_BRANCH_NAME bitwarden/web:latest
 
       - name: List Docker images
         run: docker images
 
-      - name: Push images
+      - name: Push version and latest image
-        run: |
-          docker push bitwarden/web:$_RELEASE_VERSION
         env:
           DOCKER_CONTENT_TRUST: 1
           DOCKER_CONTENT_TRUST_REPOSITORY_PASSPHRASE: ${{ steps.setup-dct.outputs.dct-delegate-repo-passphrase }}
+        run: |
+          docker push bitwarden/web:$_RELEASE_VERSION
+          docker push bitwarden/web:latest
 
       - name: Log out of Docker
         run: docker logout
@@ -116,8 +119,6 @@ jobs:
 
       - name: Checkout Repo
         uses: actions/checkout@5a4ac9002d0be2fb38bd78e4b4dbde5606d7042f  # v2.3.4
-        with:
-          ref: release
 
       - name: Setup git config
         run: |

.github/workflows/version-bump.yml

@@ -0,0 +1,71 @@
+---
+name: Version Bump
+
+on:
+  workflow_dispatch:
+    inputs:
+      version_number:
+        description: "New Version"
+        required: true
+
+jobs:
+  bump_props_version:
+    name: "Create version_bump_${{ github.event.inputs.version_number }} branch"
+    runs-on: ubuntu-20.04
+    steps:
+      - name: Checkout Branch
+        uses: actions/checkout@ec3a7ce113134d7a93b817d10a8272cb61118579
+
+      - name: Create Version Branch
+        run: |
+          git switch -c version_bump_${{ github.event.inputs.version_number }}
+          git push -u origin version_bump_${{ github.event.inputs.version_number }}
+
+      - name: Checkout Version Branch
+        uses: actions/checkout@ec3a7ce113134d7a93b817d10a8272cb61118579
+        with:
+          ref: version_bump_${{ github.event.inputs.version_number }}
+
+      - name: Bump Version - package.json
+        uses: bitwarden/gh-actions/version-bump@0c263b3963211ccaf5804313c3b3a0bcc52d4b19
+        with:
+          version: ${{ github.event.inputs.version_number }}
+          file_path: "./package.json"
+
+      - name: Bump Version - package-lock.json
+        uses: bitwarden/gh-actions/version-bump@0c263b3963211ccaf5804313c3b3a0bcc52d4b19
+        with:
+          version: ${{ github.event.inputs.version_number }}
+          file_path: "./package-lock.json"
+
+      - name: Commit files
+        run: |
+          git config --local user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          git config --local user.name "github-actions[bot]"
+          git commit -m "Bumped version to ${{ github.event.inputs.version_number }}" -a
+
+      - name: Push changes
+        run: git push -u origin version_bump_${{ github.event.inputs.version_number }}
+
+      - name: Create Version PR
+        env:
+          PR_BRANCH: "version_bump_${{ github.event.inputs.version_number }}"
+          GITHUB_TOKEN: "${{ secrets.GITHUB_TOKEN }}"
+          BASE_BRANCH: master
+          TITLE: "Bump version to ${{ github.event.inputs.version_number }}"
+        run: |
+          gh pr create --title "$TITLE" \
+            --base "$BASE" \
+            --head "$PR_BRANCH" \
+            --label "version update" \
+            --label "automated pr" \
+            --body "
+              ## Type of change
+              - [ ] Bug fix
+              - [ ] New feature development
+              - [ ] Tech debt (refactoring, code cleanup, dependency upgrades, etc)
+              - [ ] Build/deploy pipeline (DevOps)
+              - [X] Other
+
+              ## Objective
+              Automated version bump to ${{ github.event.inputs.version_number }}"

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

.prettierignore

@@ -0,0 +1,10 @@
+# Build directories
+build
+dist
+
+jslib
+
+# External libraries / auto synced locales
+src/locales
+src/404/*.min.css
+src/scripts/u2f.js

.prettierrc.json

@@ -0,0 +1,3 @@
+{
+  "printWidth": 100
+}

README.md

@@ -23,8 +23,8 @@
 
 ### Requirements
 
-- [Node.js](https://nodejs.org) v14.17 or greater
+- [Node.js](https://nodejs.org) v16.13.1 or greater
-- NPM v7
+- NPM v8
 
 ### Run the app
 

bitwarden_license/src/app/app.module.ts

@@ -1,11 +1,11 @@
-import { ToasterModule } from 'angular2-toaster';
-import { InfiniteScrollModule } from 'ngx-infinite-scroll';
-
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterModule } from '@angular/router';
+import { InfiniteScrollModule } from 'ngx-infinite-scroll';
+
+import { BitwardenToastModule } from 'jslib-angular/components/toastr.component';
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
@@ -25,7 +25,11 @@ import { WildcardRoutingModule } from 'src/app/wildcard-routing.module';
         FormsModule,
         ReactiveFormsModule,
         ServicesModule,
-        ToasterModule.forRoot(),
+        BitwardenToastModule.forRoot({
+            maxOpened: 5,
+            autoDismiss: true,
+            closeButton: true,
+        }),
         InfiniteScrollModule,
         DragDropModule,
         AppRoutingModule,

bitwarden_license/src/app/organizations/manage/sso.component.html

@@ -83,9 +83,9 @@
     <div class="form-group">
         <label for="type">{{'type' | i18n}}</label>
         <select class="form-control" id="type" formControlName="configType">
-            <option value="0" disabled>{{'selectType' | i18n}}</option>
+            <option [ngValue]="0" disabled>{{'selectType' | i18n}}</option>
-            <option value="1">OpenID Connect</option>
+            <option [ngValue]="1">OpenID Connect</option>
-            <option value="2">SAML 2.0</option>
+            <option [ngValue]="2">SAML 2.0</option>
         </select>
     </div>
 
@@ -138,8 +138,8 @@
             <div class="form-group">
                 <label for="redirectBehavior">{{'oidcRedirectBehavior' | i18n}}</label>
                 <select class="form-control" formControlName="redirectBehavior" id="redirectBehavior">
-                    <option value="0">Redirect GET</option>
+                    <option [ngValue]="0">Redirect GET</option>
-                    <option value="1">Form POST</option>
+                    <option [ngValue]="1">Form POST</option>
                 </select>
             </div>
             <div class="form-group">

bitwarden_license/src/app/organizations/manage/sso.component.ts

@@ -7,8 +7,8 @@ import { ActivatedRoute } from '@angular/router';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 
@@ -81,7 +81,7 @@ export class SsoComponent implements OnInit {
 
     constructor(private fb: FormBuilder, private route: ActivatedRoute, private apiService: ApiService,
         private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
-        private userService: UserService) { }
+        private organizationService: OrganizationService) { }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
@@ -91,7 +91,7 @@ export class SsoComponent implements OnInit {
     }
 
     async load() {
-        this.organization = await this.userService.getOrganization(this.organizationId);
+        this.organization = await this.organizationService.get(this.organizationId);
         const ssoSettings = await this.apiService.getOrganizationSso(this.organizationId);
 
         this.data.patchValue(ssoSettings.data);

bitwarden_license/src/app/providers/clients/add-organization.component.ts

@@ -5,22 +5,18 @@ import {
     OnInit,
     Output
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
-import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { ValidationService } from 'jslib-angular/services/validation.service';
 
-import { ProviderService } from '../services/provider.service';
+import { WebProviderService } from '../services/webProvider.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 import { Provider } from 'jslib-common/models/domain/provider';
 
-import { PlanType } from 'jslib-common/enums/planType';
-
 @Component({
     selector: 'provider-add-organization',
     templateUrl: 'add-organization.component.html',
@@ -35,10 +31,13 @@ export class AddOrganizationComponent implements OnInit {
     formPromise: Promise<any>;
     loading = true;
 
-    constructor(private userService: UserService, private providerService: ProviderService,
+    constructor(
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private providerService: ProviderService,
-        private platformUtilsService: PlatformUtilsService, private validationService: ValidationService,
+        private webProviderService: WebProviderService,
-        private apiService: ApiService) { }
+        private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService,
+        private validationService: ValidationService
+    ) { }
 
     async ngOnInit() {
         await this.load();
@@ -49,7 +48,7 @@ export class AddOrganizationComponent implements OnInit {
             return;
         }
 
-        this.provider = await this.userService.getProvider(this.providerId);
+        this.provider = await this.providerService.get(this.providerId);
 
         this.loading = false;
     }
@@ -68,7 +67,7 @@ export class AddOrganizationComponent implements OnInit {
         }
 
         try {
-            this.formPromise = this.providerService.addOrganizationToProvider(this.providerId, organization.id);
+            this.formPromise = this.webProviderService.addOrganizationToProvider(this.providerId, organization.id);
             await this.formPromise;
         } catch (e) {
             this.validationService.showError(e);
@@ -77,7 +76,7 @@ export class AddOrganizationComponent implements OnInit {
             this.formPromise = null;
         }
 
-        this.toasterService.popAsync('success', null, this.i18nService.t('organizationJoinedProvider'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('organizationJoinedProvider'));
         this.onAddedOrganization.emit();
     }
 }

bitwarden_license/src/app/providers/clients/clients.component.ts

@@ -5,16 +5,16 @@ import {
     ViewContainerRef
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 import { ValidationService } from 'jslib-angular/services/validation.service';
@@ -27,7 +27,7 @@ import {
     ProviderOrganizationOrganizationDetailsResponse
 } from 'jslib-common/models/response/provider/providerOrganizationResponse';
 
-import { ProviderService } from '../services/provider.service';
+import { WebProviderService } from '../services/webProvider.service';
 
 import { AddOrganizationComponent } from './add-organization.component';
 
@@ -55,12 +55,19 @@ export class ClientsComponent implements OnInit {
     protected actionPromise: Promise<any>;
     private pagedClientsCount = 0;
 
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(
-        private apiService: ApiService, private searchService: SearchService,
+        private route: ActivatedRoute,
-        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
+        private providerService: ProviderService,
-        private toasterService: ToasterService, private validationService: ValidationService,
+        private apiService: ApiService,
-        private providerService: ProviderService, private logService: LogService,
+        private searchService: SearchService,
-        private modalService: ModalService) { }
+        private platformUtilsService: PlatformUtilsService,
+        private i18nService: I18nService,
+        private validationService: ValidationService,
+        private webProviderService: WebProviderService,
+        private logService: LogService,
+        private modalService: ModalService,
+        private organizationService: OrganizationService
+    ) { }
 
     async ngOnInit() {
         this.route.parent.params.subscribe(async params => {
@@ -77,8 +84,8 @@ export class ClientsComponent implements OnInit {
     async load() {
         const response = await this.apiService.getProviderClients(this.providerId);
         this.clients = response.data != null && response.data.length > 0 ? response.data : [];
-        this.manageOrganizations = (await this.userService.getProvider(this.providerId)).type === ProviderUserType.ProviderAdmin;
+        this.manageOrganizations = (await this.providerService.get(this.providerId)).type === ProviderUserType.ProviderAdmin;
-        const candidateOrgs = (await this.userService.getAllOrganizations()).filter(o => o.isOwner && o.providerId == null);
+        const candidateOrgs = (await this.organizationService.getAll()).filter(o => o.isOwner && o.providerId == null);
         const allowedOrgsIds = await Promise.all(candidateOrgs.map(o => this.apiService.getOrganization(o.id))).then(orgs =>
             orgs.filter(o => !DisallowedPlanTypes.includes(o.planType))
                 .map(o => o.id));
@@ -146,10 +153,11 @@ export class ClientsComponent implements OnInit {
             return false;
         }
 
-        this.actionPromise = this.providerService.detachOrganizastion(this.providerId, organization.id);
+        this.actionPromise = this.webProviderService.detachOrganizastion(this.providerId, organization.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('detachedOrganization', organization.organizationName));
+            this.platformUtilsService.showToast('success', null,
+                this.i18nService.t('detachedOrganization', organization.organizationName));
             await this.load();
         } catch (e) {
             this.validationService.showError(e);

bitwarden_license/src/app/providers/manage/accept-provider.component.ts

@@ -1,14 +1,13 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { Toast, ToasterService } from 'angular2-toaster';
 
 import { BaseAcceptComponent } from 'src/app/common/base.accept.component';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 import { ProviderUserAcceptRequest } from 'jslib-common/models/request/provider/providerUserAcceptRequest';
 
 @Component({
@@ -22,9 +21,15 @@ export class AcceptProviderComponent extends BaseAcceptComponent {
 
     requiredParameters = ['providerId', 'providerUserId', 'token'];
 
-    constructor(router: Router, toasterService: ToasterService, i18nService: I18nService, route: ActivatedRoute,
+    constructor(
-        userService: UserService, stateService: StateService, private apiService: ApiService) {
+        router: Router,
-        super(router, toasterService, i18nService, route, userService, stateService);
+        i18nService: I18nService,
+        route: ActivatedRoute,
+        stateService: StateService,
+        private apiService: ApiService,
+        platformUtilService: PlatformUtilsService,
+    ) {
+        super(router, platformUtilService, i18nService, route, stateService);
     }
 
     async authedHandler(qParams: any) {
@@ -32,13 +37,8 @@ export class AcceptProviderComponent extends BaseAcceptComponent {
         request.token = qParams.token;
 
         await this.apiService.postProviderUserAccept(qParams.providerId, qParams.providerUserId, request);
-        const toast: Toast = {
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
-            type: 'success',
+            this.i18nService.t('providerInviteAcceptedDesc'), { timeout: 10000 });
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('providerInviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
         this.router.navigate(['/vault']);
     }
 

bitwarden_license/src/app/providers/manage/bulk/bulk-confirm.component.ts

@@ -12,7 +12,7 @@ import { BulkConfirmComponent as OrganizationBulkConfirmComponent } from 'src/ap
 import { BulkUserDetails } from 'src/app/organizations/manage/bulk/bulk-status.component';
 
 @Component({
-    templateUrl: '/src/app/organizations/manage/bulk/bulk-confirm.component.html',
+    templateUrl: '../../../../../../src/app/organizations/manage/bulk/bulk-confirm.component.html',
 })
 export class BulkConfirmComponent extends OrganizationBulkConfirmComponent {
 

bitwarden_license/src/app/providers/manage/bulk/bulk-remove.component.ts

@@ -8,7 +8,7 @@ import { ProviderUserBulkRequest } from 'jslib-common/models/request/provider/pr
 import { BulkRemoveComponent as OrganizationBulkRemoveComponent } from 'src/app/organizations/manage/bulk/bulk-remove.component';
 
 @Component({
-    templateUrl: '/src/app/organizations/manage/bulk/bulk-remove.component.html',
+    templateUrl: '../../../../../../src/app/organizations/manage/bulk/bulk-remove.component.html',
 })
 export class BulkRemoveComponent extends OrganizationBulkRemoveComponent {
 

bitwarden_license/src/app/providers/manage/events.component.ts

@@ -3,14 +3,13 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { ExportService } from 'jslib-common/abstractions/export.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
 
@@ -31,17 +30,31 @@ export class EventsComponent extends BaseEventsComponent implements OnInit {
     private providerUsersUserIdMap = new Map<string, any>();
     private providerUsersIdMap = new Map<string, any>();
 
-    constructor(private apiService: ApiService, private route: ActivatedRoute, eventService: EventService,
+    constructor(
-        i18nService: I18nService, toasterService: ToasterService, private userService: UserService,
+        private apiService: ApiService,
-        exportService: ExportService, platformUtilsService: PlatformUtilsService, private router: Router,
+        private route: ActivatedRoute,
-        logService: LogService, private userNamePipe: UserNamePipe) {
+        eventService: EventService,
-        super(eventService, i18nService, toasterService, exportService, platformUtilsService, logService);
+        i18nService: I18nService,
+        private providerService: ProviderService,
+        exportService: ExportService,
+        platformUtilsService: PlatformUtilsService,
+        private router: Router,
+        logService: LogService,
+        private userNamePipe: UserNamePipe,
+    ) {
+        super(
+            eventService,
+            i18nService,
+            exportService,
+            platformUtilsService,
+            logService,
+        );
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
             this.providerId = params.providerId;
-            const provider = await this.userService.getProvider(this.providerId);
+            const provider = await this.providerService.get(this.providerId);
             if (provider == null || !provider.useEvents) {
                 this.router.navigate(['/providers', this.providerId]);
                 return;

bitwarden_license/src/app/providers/manage/manage.component.ts

@@ -4,7 +4,7 @@ import {
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { Provider } from 'jslib-common/models/domain/provider';
 
@@ -16,11 +16,11 @@ export class ManageComponent implements OnInit {
     provider: Provider;
     accessEvents = false;
 
-    constructor(private route: ActivatedRoute, private userService: UserService) { }
+    constructor(private route: ActivatedRoute, private providerService: ProviderService) { }
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
-            this.provider = await this.userService.getProvider(params.providerId);
+            this.provider = await this.providerService.get(params.providerId);
             this.accessEvents = this.provider.useEvents;
         });
     }

bitwarden_license/src/app/providers/manage/people.component.ts

@@ -5,7 +5,6 @@ import {
     ViewContainerRef
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -14,9 +13,9 @@ import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 import { ValidationService } from 'jslib-angular/services/validation.service';
@@ -59,20 +58,41 @@ export class PeopleComponent extends BasePeopleComponent<ProviderUserUserDetails
     providerId: string;
     accessEvents = false;
 
-    constructor(apiService: ApiService, private route: ActivatedRoute,
+    constructor(
-        i18nService: I18nService, modalService: ModalService,
+        apiService: ApiService,
-        platformUtilsService: PlatformUtilsService, toasterService: ToasterService,
+        private route: ActivatedRoute,
-        cryptoService: CryptoService, private userService: UserService, private router: Router,
+        i18nService: I18nService,
-        storageService: StorageService, searchService: SearchService, validationService: ValidationService,
+        modalService: ModalService,
-        logService: LogService, searchPipe: SearchPipe, userNamePipe: UserNamePipe) {
+        platformUtilsService: PlatformUtilsService,
-        super(apiService, searchService, i18nService, platformUtilsService, toasterService, cryptoService,
+        cryptoService: CryptoService,
-            storageService, validationService, modalService, logService, searchPipe, userNamePipe);
+        private router: Router,
+        searchService: SearchService,
+        validationService: ValidationService,
+        logService: LogService,
+        searchPipe: SearchPipe,
+        userNamePipe: UserNamePipe,
+        stateService: StateService,
+        private providerService: ProviderService,
+    ) {
+        super(
+            apiService,
+            searchService,
+            i18nService,
+            platformUtilsService,
+            cryptoService,
+            validationService,
+            modalService,
+            logService,
+            searchPipe,
+            userNamePipe,
+            stateService,
+        );
     }
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
             this.providerId = params.providerId;
-            const provider = await this.userService.getProvider(this.providerId);
+            const provider = await this.providerService.get(this.providerId);
 
             if (!provider.canManageUsers) {
                 this.router.navigate(['../'], { relativeTo: this.route });
@@ -164,7 +184,7 @@ export class PeopleComponent extends BasePeopleComponent<ProviderUserUserDetails
         const filteredUsers = users.filter(u => u.status === ProviderUserStatusType.Invited);
 
         if (filteredUsers.length <= 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('noSelectedUsersApplicable'));
             return;
         }

bitwarden_license/src/app/providers/manage/user-add-edit.component.ts

@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -44,8 +42,7 @@ export class UserAddEditComponent implements OnInit {
     userType = ProviderUserType;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
-        private logService: LogService) { }
 
     async ngOnInit() {
         this.editMode = this.loading = this.providerUserId != null;
@@ -79,7 +76,7 @@ export class UserAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postProviderUserInvite(this.providerId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedUserId' : 'invitedUsers', this.name));
             this.onSavedUser.emit();
         } catch (e) {
@@ -102,7 +99,7 @@ export class UserAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteProviderUser(this.providerId, this.providerUserId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId', this.name));
             this.onDeletedUser.emit();
         } catch (e) {
             this.logService.error(e);

bitwarden_license/src/app/providers/providers-layout.component.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { Provider } from 'jslib-common/models/domain/provider';
 
@@ -14,7 +14,7 @@ export class ProvidersLayoutComponent {
     provider: Provider;
     private providerId: string;
 
-    constructor(private route: ActivatedRoute, private userService: UserService) { }
+    constructor(private route: ActivatedRoute, private providerService: ProviderService) { }
 
     ngOnInit() {
         document.body.classList.remove('layout_frontend');
@@ -25,7 +25,7 @@ export class ProvidersLayoutComponent {
     }
 
     async load() {
-        this.provider = await this.userService.getProvider(this.providerId);
+        this.provider = await this.providerService.get(this.providerId);
     }
 
     get showMenuBar() {

bitwarden_license/src/app/providers/providers.module.ts

@@ -7,7 +7,7 @@ import { ModalService } from 'jslib-angular/services/modal.service';
 
 import { ProviderGuardService } from './services/provider-guard.service';
 import { ProviderTypeGuardService } from './services/provider-type-guard.service';
-import { ProviderService } from './services/provider.service';
+import { WebProviderService } from './services/webProvider.service';
 
 import { ProvidersLayoutComponent } from './providers-layout.component';
 import { ProvidersRoutingModule } from './providers-routing.module';
@@ -57,7 +57,7 @@ import { OssModule } from 'src/app/oss.module';
         UserAddEditComponent,
     ],
     providers: [
-        ProviderService,
+        WebProviderService,
         ProviderGuardService,
         ProviderTypeGuardService,
     ],

bitwarden_license/src/app/providers/services/provider-guard.service.ts

@@ -5,24 +5,27 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 @Injectable()
 export class ProviderGuardService implements CanActivate {
-    constructor(private userService: UserService, private router: Router,
+    constructor(
-        private toasterService: ToasterService, private i18nService: I18nService) { }
+        private router: Router,
+        private platformUtilsService: PlatformUtilsService,
+        private i18nService: I18nService,
+        private providerService: ProviderService,
+    ) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
-        const provider = await this.userService.getProvider(route.params.providerId);
+        const provider = await this.providerService.get(route.params.providerId);
         if (provider == null) {
             this.router.navigate(['/']);
             return false;
         }
         if (!provider.isProviderAdmin && !provider.enabled) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('providerIsDisabled'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('providerIsDisabled'));
             this.router.navigate(['/']);
             return false;
         }

bitwarden_license/src/app/providers/services/provider-type-guard.service.ts

@@ -5,16 +5,16 @@ import {
     Router,
 } from '@angular/router';
 
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { Permissions } from 'jslib-common/enums/permissions';
 
 @Injectable()
 export class ProviderTypeGuardService implements CanActivate {
-    constructor(private userService: UserService, private router: Router) { }
+    constructor(private providerService: ProviderService, private router: Router) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
-        const provider = await this.userService.getProvider(route.params.providerId);
+        const provider = await this.providerService.get(route.params.providerId);
         const permissions = route.data == null ? null : route.data.permissions as Permissions[];
 
         if (

bitwarden_license/src/app/providers/services/webProvider.service.ts

@@ -7,7 +7,7 @@ import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { ProviderAddOrganizationRequest } from 'jslib-common/models/request/provider/providerAddOrganizationRequest';
 
 @Injectable()
-export class ProviderService {
+export class WebProviderService {
     constructor(private cryptoService: CryptoService, private syncService: SyncService, private apiService: ApiService) {}
 
     async addOrganizationToProvider(providerId: string, organizationId: string) {

bitwarden_license/src/app/providers/settings/account.component.ts

@@ -1,6 +1,5 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -26,9 +25,8 @@ export class AccountComponent {
     private providerId: string;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private route: ActivatedRoute,
+        private route: ActivatedRoute, private syncService: SyncService,
-        private syncService: SyncService, private platformUtilsService: PlatformUtilsService,
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
-        private logService: LogService) { }
 
     async ngOnInit() {
         this.selfHosted = this.platformUtilsService.isSelfHost();
@@ -54,7 +52,7 @@ export class AccountComponent {
                 return this.syncService.fullSync(true);
             });
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('providerUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('providerUpdated'));
         } catch (e) {
             this.logService.error(`Handled exception: ${e}`);
         }

bitwarden_license/src/app/providers/settings/settings.component.ts

@@ -2,19 +2,19 @@ import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 @Component({
     selector: 'provider-settings',
     templateUrl: 'settings.component.html',
 })
 export class SettingsComponent {
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(private route: ActivatedRoute, private providerService: ProviderService,
         private platformUtilsService: PlatformUtilsService) { }
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
-            const provider = await this.userService.getProvider(params.providerId);
+            const provider = await this.providerService.get(params.providerId);
         });
     }
 }

bitwarden_license/src/app/providers/setup/setup.component.ts

@@ -6,10 +6,6 @@ import {
     ActivatedRoute,
     Router,
 } from '@angular/router';
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -18,6 +14,7 @@ import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 
 import { ValidationService } from 'jslib-angular/services/validation.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { ProviderSetupRequest } from 'jslib-common/models/request/provider/providerSetupRequest';
 
@@ -36,7 +33,7 @@ export class SetupComponent implements OnInit {
     name: string;
     billingEmail: string;
 
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(private router: Router, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private route: ActivatedRoute,
         private cryptoService: CryptoService, private apiService: ApiService,
         private syncService: SyncService, private validationService: ValidationService) { }
@@ -47,13 +44,8 @@ export class SetupComponent implements OnInit {
             const error = qParams.providerId == null || qParams.email == null || qParams.token == null;
 
             if (error) {
-                const toast: Toast = {
+                this.platformUtilsService.showToast('error', null, this.i18nService.t('emergencyInviteAcceptFailed'),
-                    type: 'error',
+                    { timeout: 10000 });
-                    title: null,
-                    body: this.i18nService.t('emergencyInviteAcceptFailed'),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
                 this.router.navigate(['/']);
                 return;
             }
@@ -92,7 +84,7 @@ export class SetupComponent implements OnInit {
             request.key = key;
 
             const provider = await this.apiService.postProviderSetup(this.providerId, request);
-            this.toasterService.popAsync('success', null, this.i18nService.t('providerSetup'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('providerSetup'));
             await this.syncService.fullSync(true);
 
             this.router.navigate(['/providers', provider.id]);

bitwarden_license/webpack.config.js

@@ -1,9 +1,9 @@
-const AngularCompilerPlugin = require('@ngtools/webpack').AngularCompilerPlugin;
+const { AngularWebpackPlugin } = require('@ngtools/webpack');
 
 const webpackConfig = require('../webpack.config');
 
 webpackConfig.entry['app/main'] = './bitwarden_license/src/app/main.ts';
-webpackConfig.plugins[webpackConfig.plugins.length -1] = new AngularCompilerPlugin({
+webpackConfig.plugins[webpackConfig.plugins.length -1] = new AngularWebpackPlugin({
     tsConfigPath: 'tsconfig.json',
     entryModule: 'bitwarden_license/src/app/app.module#AppModule',
     sourceMap: true,

config/base.json

@@ -7,6 +7,6 @@
         "buttonAction": "https://www.sandbox.paypal.com/cgi-bin/webscr"
     },
     "dev": {
-        "allowedHosts": []
+        "allowedHosts": "auto"
     }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bitwarden-web",
-  "version": "2.24.4",
+  "version": "2.25.0",
   "license": "GPL-3.0",
   "repository": "https://github.com/bitwarden/web",
   "scripts": {
@@ -30,43 +30,56 @@
     "deploy": "npm run dist:bit && gh-pages -d build",
     "deploy:dev": "npm run dist:bit && gh-pages -d build -r git@github.com:kspearrin/bitwarden-web-dev.git",
     "lint": "tslint 'src/**/*.ts' 'bitwarden_license/src/**/*.ts'",
-    "lint:fix": "tslint 'src/**/*.ts' 'bitwarden_license/src/**/*.ts' --fix"
+    "lint:fix": "tslint 'src/**/*.ts' 'bitwarden_license/src/**/*.ts' --fix",
+    "prettier": "prettier --write .",
+    "prepare": "husky install"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "^11.2.11",
+    "@angular/compiler-cli": "^12.2.13",
-    "@ngtools/webpack": "^11.2.10",
+    "@ngtools/webpack": "^12.2.13",
     "@types/jquery": "^3.5.5",
-    "@types/node": "^14.17.2",
+    "@types/node": "^16.11.12",
     "@types/webcrypto": "^0.0.28",
-    "@types/webpack": "^4.4.27",
+    "@types/webpack": "^5.28.0",
-    "clean-webpack-plugin": "^3.0.0",
+    "buffer": "^6.0.3",
-    "copy-webpack-plugin": "^6.4.0",
+    "clean-webpack-plugin": "^4.0.0",
+    "copy-webpack-plugin": "^10.0.0",
     "cross-env": "^7.0.3",
-    "css-loader": "^5.2.3",
+    "css-loader": "^6.5.1",
-    "del": "^6.0.0",
-    "file-loader": "^6.2.0",
     "gh-pages": "^3.1.0",
-    "html-loader": "^1.3.2",
+    "html-loader": "^3.0.1",
     "html-webpack-injector": "1.1.4",
-    "html-webpack-plugin": "^4.5.1",
+    "html-webpack-plugin": "^5.5.0",
-    "mini-css-extract-plugin": "^1.5.0",
+    "husky": "^7.0.4",
+    "lint-staged": "^12.1.2",
+    "mini-css-extract-plugin": "^2.4.5",
+    "prettier": "2.5.1",
+    "process": "^0.11.10",
     "sass": "^1.32.10",
-    "sass-loader": "^10.1.1",
+    "sass-loader": "^12.4.0",
-    "style-loader": "^2.0.0",
+    "style-loader": "^3.3.1",
-    "tapable": "^1.1.3",
+    "terser-webpack-plugin": "^5.2.5",
-    "terser-webpack-plugin": "^4.2.3",
+    "ts-loader": "^9.2.5",
-    "ts-loader": "^8.1.0",
     "tslint": "^6.1.3",
     "tslint-loader": "^3.5.4",
-    "typescript": "4.1.5",
+    "typescript": "4.3.5",
-    "webpack": "^4.46.0",
+    "util": "^0.12.4",
-    "webpack-cli": "^4.6.0",
+    "webpack": "^5.64.4",
-    "webpack-dev-server": "^3.11.2"
+    "webpack-cli": "^4.9.1",
+    "webpack-dev-server": "^4.6.0"
   },
   "dependencies": {
+    "@angular/animations": "^12.2.13",
+    "@angular/cdk": "^12.2.13",
+    "@angular/common": "^12.2.13",
+    "@angular/compiler": "^12.2.13",
+    "@angular/core": "^12.2.13",
+    "@angular/forms": "^12.2.13",
+    "@angular/platform-browser": "^12.2.13",
+    "@angular/platform-browser-dynamic": "^12.2.13",
+    "@angular/router": "^12.2.13",
     "@bitwarden/jslib-angular": "file:jslib/angular",
     "@bitwarden/jslib-common": "file:jslib/common",
-    "angular2-toaster": "11.0.1",
     "bootstrap": "4.6.0",
     "braintree-web-drop-in": "1.30.1",
     "browser-hrtime": "^1.1.8",
@@ -75,14 +88,19 @@
     "font-awesome": "4.7.0",
     "jquery": "3.6.0",
     "ngx-infinite-scroll": "^10.0.1",
+    "ngx-toastr": "14.1.4",
     "popper.js": "1.16.1",
     "qrious": "4.0.2",
+    "rxjs": "^7.4.0",
     "sweetalert2": "^10.16.6",
     "webcrypto-shim": "0.1.7",
     "whatwg-fetch": "3.6.2"
   },
   "engines": {
-    "node": "~14",
+    "node": "~16",
-    "npm": "~7"
+    "npm": "~8"
+  },
+  "lint-staged": {
+    "*.{js,ts,css,scss,md}": "prettier --write"
   }
 }

src/404.html

@@ -27,7 +27,7 @@
                 <div class="row align-items-center">
                     <div class="col brand">
                         <i class="fa fa-shield"></i>&nbsp;
-                        <strong>bit</strong>warden</span>
+                        <strong>bit</strong>warden
                     </div>
                 </div>
             </div>

src/app/accounts/accept-emergency.component.ts

@@ -4,15 +4,10 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 import { EmergencyAccessAcceptRequest } from 'jslib-common/models/request/emergencyAccessAcceptRequest';
 import { BaseAcceptComponent } from '../common/base.accept.component';
 
@@ -28,11 +23,21 @@ export class AcceptEmergencyComponent extends BaseAcceptComponent {
     protected failedShortMessage = 'emergencyInviteAcceptFailedShort';
     protected failedMessage = 'emergencyInviteAcceptFailed';
 
-    constructor(router: Router, toasterService: ToasterService,
+    constructor(
-        i18nService: I18nService, route: ActivatedRoute,
+        router: Router,
-        private apiService: ApiService, userService: UserService,
+        platformUtilsService: PlatformUtilsService,
-        stateService: StateService) {
+        i18nService: I18nService,
-        super(router, toasterService, i18nService, route, userService, stateService);
+        route: ActivatedRoute,
+        private apiService: ApiService,
+        stateService: StateService
+    ) {
+        super(
+            router,
+            platformUtilsService,
+            i18nService,
+            route,
+            stateService
+        );
     }
 
     async authedHandler(qParams: any): Promise<void> {
@@ -40,13 +45,8 @@ export class AcceptEmergencyComponent extends BaseAcceptComponent {
         request.token = qParams.token;
         this.actionPromise = this.apiService.postEmergencyAccessAccept(qParams.id, request);
         await this.actionPromise;
-        const toast: Toast = {
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
-            type: 'success',
+            this.i18nService.t('emergencyInviteAcceptedDesc'), {timeout: 10000});
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('emergencyInviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
         this.router.navigate(['/vault']);
     }
 

src/app/accounts/accept-organization.component.ts

@@ -4,18 +4,13 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { OrganizationUserAcceptRequest } from 'jslib-common/models/request/organizationUserAcceptRequest';
 import { OrganizationUserResetPasswordEnrollmentRequest } from 'jslib-common/models/request/organizationUserResetPasswordEnrollmentRequest';
@@ -33,12 +28,24 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
 
     protected requiredParameters: string[] = ['organizationId', 'organizationUserId', 'token'];
 
-    constructor(router: Router, toasterService: ToasterService,
+    constructor(
-        i18nService: I18nService, route: ActivatedRoute,
+        router: Router,
-        private apiService: ApiService, userService: UserService,
+        platformUtilsService: PlatformUtilsService,
-        stateService: StateService, private cryptoService: CryptoService,
+        i18nService: I18nService,
-        private policyService: PolicyService, private logService: LogService) {
+        route: ActivatedRoute,
-        super(router, toasterService, i18nService, route, userService, stateService);
+        private apiService: ApiService,
+        stateService: StateService,
+        private cryptoService: CryptoService,
+        private policyService: PolicyService,
+        private logService: LogService
+    ) {
+        super(
+            router,
+            platformUtilsService,
+            i18nService,
+            route,
+            stateService
+        );
     }
 
     async authedHandler(qParams: any): Promise<void> {
@@ -64,10 +71,7 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
                     const resetRequest = new OrganizationUserResetPasswordEnrollmentRequest();
                     resetRequest.resetPasswordKey = encryptedKey.encryptedString;
 
-                    // Get User Id
+                    return this.apiService.putOrganizationUserResetPasswordEnrollment(qParams.organizationId, await this.stateService.getUserId(), resetRequest);
-                    const userId = await this.userService.getUserId();
-
-                    return this.apiService.putOrganizationUserResetPasswordEnrollment(qParams.organizationId, userId, resetRequest);
                 });
         } else {
             this.actionPromise = this.apiService.postOrganizationUserAccept(qParams.organizationId,
@@ -75,15 +79,10 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
         }
 
         await this.actionPromise;
-        const toast: Toast = {
+        this.platformUtilService.showToast('success', this.i18nService.t('inviteAccepted'),
-            type: 'success',
+            this.i18nService.t('inviteAcceptedDesc'), {timeout: 10000});
-            title: this.i18nService.t('inviteAccepted'),
-            body: this.i18nService.t('inviteAcceptedDesc'),
-            timeout: 10000,
-        };
-        this.toasterService.popAsync(toast);
 
-        await this.stateService.remove('orgInvitation');
+        await this.stateService.setOrganizationInvitation(null);
         this.router.navigate(['/vault']);
     }
 
@@ -93,7 +92,7 @@ export class AcceptOrganizationComponent extends BaseAcceptComponent {
             // Fix URL encoding of space issue with Angular
             this.orgName = this.orgName.replace(/\+/g, ' ');
         }
-        await this.stateService.save('orgInvitation', qParams);
+        await this.stateService.setOrganizationInvitation(qParams);
     }
 
     private async performResetPasswordAutoEnroll(qParams: any): Promise<boolean> {

src/app/accounts/lock.component.ts

@@ -1,4 +1,7 @@
-import { Component } from '@angular/core';
+import {
+    Component,
+    NgZone,
+} from '@angular/core';
 import { Router } from '@angular/router';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -10,8 +13,6 @@ import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 import { VaultTimeoutService } from 'jslib-common/abstractions/vaultTimeout.service';
 
 import { RouterService } from '../services/router.service';
@@ -25,19 +26,18 @@ import { LockComponent as BaseLockComponent } from 'jslib-angular/components/loc
 export class LockComponent extends BaseLockComponent {
     constructor(router: Router, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, messagingService: MessagingService,
-        userService: UserService, cryptoService: CryptoService,
+        cryptoService: CryptoService, vaultTimeoutService: VaultTimeoutService,
-        storageService: StorageService, vaultTimeoutService: VaultTimeoutService,
         environmentService: EnvironmentService, private routerService: RouterService,
         stateService: StateService, apiService: ApiService, logService: LogService,
-        keyConnectorService: KeyConnectorService) {
+        keyConnectorService: KeyConnectorService, ngZone: NgZone) {
-        super(router, i18nService, platformUtilsService, messagingService, userService, cryptoService,
+        super(router, i18nService, platformUtilsService, messagingService, cryptoService,
-            storageService, vaultTimeoutService, environmentService, stateService, apiService, logService,
+            vaultTimeoutService, environmentService, stateService, apiService, logService,
-            keyConnectorService);
+            keyConnectorService, ngZone);
     }
 
     async ngOnInit() {
         await super.ngOnInit();
-        this.onSuccessfulSubmit = () => {
+        this.onSuccessfulSubmit = async () => {
             const previousUrl = this.routerService.getPreviousUrl();
             if (previousUrl !== '/' && previousUrl.indexOf('lock') === -1) {
                 this.successRoute = previousUrl;

src/app/accounts/login.component.ts

@@ -1,4 +1,7 @@
-import { Component } from '@angular/core';
+import {
+    Component,
+    NgZone,
+} from '@angular/core';
 import {
     ActivatedRoute,
     Router,
@@ -16,7 +19,6 @@ import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGen
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
 
 import { LoginComponent as BaseLoginComponent } from 'jslib-angular/components/login.component';
 
@@ -31,16 +33,16 @@ export class LoginComponent extends BaseLoginComponent {
     showResetPasswordAutoEnrollWarning = false;
 
     constructor(authService: AuthService, router: Router,
-        i18nService: I18nService, private route: ActivatedRoute,
+        i18nService: I18nService, private route: ActivatedRoute, stateService: StateService,
-        storageService: StorageService, stateService: StateService,
         platformUtilsService: PlatformUtilsService, environmentService: EnvironmentService,
         passwordGenerationService: PasswordGenerationService, cryptoFunctionService: CryptoFunctionService,
-        private apiService: ApiService, private policyService: PolicyService, logService: LogService) {
+        private apiService: ApiService, private policyService: PolicyService, logService: LogService,
+        ngZone: NgZone) {
         super(authService, router,
             platformUtilsService, i18nService,
             stateService, environmentService,
             passwordGenerationService, cryptoFunctionService,
-            storageService, logService);
+            logService, ngZone);
         this.onSuccessfulLoginNavigate = this.goAfterLogIn;
     }
 
@@ -50,16 +52,16 @@ export class LoginComponent extends BaseLoginComponent {
                 this.email = qParams.email;
             }
             if (qParams.premium != null) {
-                this.stateService.save('loginRedirect', { route: '/settings/premium' });
+                this.stateService.setLoginRedirect({ route: '/settings/premium' });
             } else if (qParams.org != null) {
-                this.stateService.save('loginRedirect',
+                this.stateService.setLoginRedirect(
                     { route: '/settings/create-organization', qParams: { plan: qParams.org } });
             }
 
             // Are they coming from an email for sponsoring a families organization
             if (qParams.sponsorshipToken != null) {
                 // After logging in redirect them to setup the families sponsorship
-                this.stateService.save('loginRedirect', {
+                this.stateService.setLoginRedirect({
                     route: '/setup/families-for-enterprise',
                     qParams: { token: qParams.sponsorshipToken },
                 });
@@ -67,7 +69,7 @@ export class LoginComponent extends BaseLoginComponent {
             await super.ngOnInit();
         });
 
-        const invite = await this.stateService.get<any>('orgInvitation');
+        const invite = await this.stateService.getOrganizationInvitation();
         if (invite != null) {
             let policyList: Policy[] = null;
             try {
@@ -87,10 +89,10 @@ export class LoginComponent extends BaseLoginComponent {
     }
 
     async goAfterLogIn() {
-        const loginRedirect = await this.stateService.get<any>('loginRedirect');
+        const loginRedirect = await this.stateService.getLoginRedirect();
         if (loginRedirect != null) {
             this.router.navigate([loginRedirect.route], { queryParams: loginRedirect.qParams });
-            await this.stateService.remove('loginRedirect');
+            await this.stateService.setLoginRedirect(null);
         } else {
             this.router.navigate([this.successRoute]);
         }

src/app/accounts/recover-delete.component.ts

@@ -1,11 +1,10 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { DeleteRecoverRequest } from 'jslib-common/models/request/deleteRecoverRequest';
 
@@ -18,7 +17,7 @@ export class RecoverDeleteComponent {
     formPromise: Promise<any>;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private logService: LogService) {
     }
 
@@ -28,7 +27,7 @@ export class RecoverDeleteComponent {
             request.email = this.email.trim().toLowerCase();
             this.formPromise = this.apiService.postAccountRecoverDelete(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deleteRecoverEmailSent'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deleteRecoverEmailSent'));
             this.router.navigate(['/']);
         } catch (e) {
             this.logService.error(e);

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

@@ -1,13 +1,12 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { AuthService } from 'jslib-common/abstractions/auth.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { TwoFactorRecoveryRequest } from 'jslib-common/models/request/twoFactorRecoveryRequest';
 
@@ -22,7 +21,7 @@ export class RecoverTwoFactorComponent {
     formPromise: Promise<any>;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private cryptoService: CryptoService, private authService: AuthService,
         private logService: LogService) { }
 
@@ -35,7 +34,7 @@ export class RecoverTwoFactorComponent {
             request.masterPasswordHash = await this.cryptoService.hashPassword(this.masterPassword, key);
             this.formPromise = this.apiService.postTwoFactorRecover(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('twoStepRecoverDisabled'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('twoStepRecoverDisabled'));
             this.router.navigate(['/']);
         } catch (e) {
             this.logService.error(e);

src/app/accounts/register.component.ts

@@ -53,11 +53,11 @@ export class RegisterComponent extends BaseRegisterComponent {
                 this.email = qParams.email;
             }
             if (qParams.premium != null) {
-                this.stateService.save('loginRedirect', { route: '/settings/premium' });
+                this.stateService.setLoginRedirect({ route: '/settings/premium' });
             } else if (qParams.org != null) {
                 this.showCreateOrgMessage = true;
                 this.referenceData.flow = qParams.org;
-                this.stateService.save('loginRedirect',
+                this.stateService.setLoginRedirect(
                     { route: '/settings/create-organization', qParams: { plan: qParams.org } });
             }
             if (qParams.layout != null) {
@@ -71,7 +71,7 @@ export class RegisterComponent extends BaseRegisterComponent {
             // Are they coming from an email for sponsoring a families organization
             if (qParams.sponsorshipToken != null) {
                 // After logging in redirect them to setup the families sponsorship
-                this.stateService.save('loginRedirect', {
+                this.stateService.setLoginRedirect({
                     route: '/setup/families-for-enterprise',
                     qParams: { token: qParams.sponsorshipToken },
                 });
@@ -80,7 +80,7 @@ export class RegisterComponent extends BaseRegisterComponent {
                 this.referenceData.id = null;
             }
         });
-        const invite = await this.stateService.get<any>('orgInvitation');
+        const invite = await this.stateService.getOrganizationInvitation();
         if (invite != null) {
             try {
                 const policies = await this.apiService.getPoliciesByToken(invite.organizationId, invite.token,

src/app/accounts/set-password.component.ts

@@ -11,8 +11,8 @@ import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import {
     SetPasswordComponent as BaseSetPasswordComponent,
@@ -25,10 +25,10 @@ import {
 export class SetPasswordComponent extends BaseSetPasswordComponent {
     constructor(apiService: ApiService, i18nService: I18nService,
         cryptoService: CryptoService, messagingService: MessagingService,
-        userService: UserService, passwordGenerationService: PasswordGenerationService,
+        passwordGenerationService: PasswordGenerationService, platformUtilsService: PlatformUtilsService,
-        platformUtilsService: PlatformUtilsService, policyService: PolicyService, router: Router,
+        policyService: PolicyService, router: Router,
-        syncService: SyncService, route: ActivatedRoute) {
+        syncService: SyncService, route: ActivatedRoute, stateService: StateService) {
-        super(i18nService, cryptoService, messagingService, userService, passwordGenerationService,
+        super(i18nService, cryptoService, messagingService, passwordGenerationService,
-            platformUtilsService, policyService, router, apiService, syncService, route);
+            platformUtilsService, policyService, router, apiService, syncService, route, stateService);
     }
 }

src/app/accounts/sso.component.ts

@@ -15,12 +15,9 @@ import { LogService } from 'jslib-common/abstractions/log.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
 
 import { SsoComponent as BaseSsoComponent } from 'jslib-angular/components/sso.component';
 
-const IdentifierStorageKey = 'ssoOrgIdentifier';
-
 @Component({
     selector: 'app-sso',
     templateUrl: 'sso.component.html',
@@ -28,11 +25,11 @@ const IdentifierStorageKey = 'ssoOrgIdentifier';
 export class SsoComponent extends BaseSsoComponent {
     constructor(authService: AuthService, router: Router,
         i18nService: I18nService, route: ActivatedRoute,
-        storageService: StorageService, stateService: StateService,
+        stateService: StateService, platformUtilsService: PlatformUtilsService,
-        platformUtilsService: PlatformUtilsService, apiService: ApiService,
+        apiService: ApiService, cryptoFunctionService: CryptoFunctionService,
-        cryptoFunctionService: CryptoFunctionService, environmentService: EnvironmentService,
+        environmentService: EnvironmentService, passwordGenerationService: PasswordGenerationService,
-        passwordGenerationService: PasswordGenerationService, logService: LogService) {
+        logService: LogService) {
-        super(authService, router, i18nService, route, storageService, stateService, platformUtilsService,
+        super(authService, router, i18nService, route, stateService, platformUtilsService,
             apiService, cryptoFunctionService, environmentService, passwordGenerationService, logService);
         this.redirectUri = window.location.origin + '/sso-connector.html';
         this.clientId = 'web';
@@ -44,7 +41,7 @@ export class SsoComponent extends BaseSsoComponent {
             if (qParams.identifier != null) {
                 this.identifier = qParams.identifier;
             } else {
-                const storedIdentifier = await this.storageService.get<string>(IdentifierStorageKey);
+                const storedIdentifier = await this.stateService.getSsoOrgIdentifier();
                 if (storedIdentifier != null) {
                     this.identifier = storedIdentifier;
                 }
@@ -53,7 +50,7 @@ export class SsoComponent extends BaseSsoComponent {
     }
 
     async submit() {
-        await this.storageService.save(IdentifierStorageKey, this.identifier);
+        await this.stateService.setSsoOrganizationIdentifier(this.identifier);
         if (this.clientId === 'browser') {
             document.cookie = `ssoHandOffMessage=${this.i18nService.t('ssoHandOff')};SameSite=strict`;
         }

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

@@ -13,9 +13,9 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { AuthService } from 'jslib-common/abstractions/auth.service';
 import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { LogService } from 'jslib-common/abstractions/log.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -23,7 +23,6 @@ import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType'
 
 import { TwoFactorComponent as BaseTwoFactorComponent } from 'jslib-angular/components/two-factor.component';
 
-import { LogService } from 'jslib-common/abstractions/log.service';
 import { TwoFactorOptionsComponent } from './two-factor-options.component';
 
 @Component({
@@ -37,9 +36,9 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
         i18nService: I18nService, apiService: ApiService,
         platformUtilsService: PlatformUtilsService, stateService: StateService,
         environmentService: EnvironmentService, private modalService: ModalService,
-        storageService: StorageService, route: ActivatedRoute, logService: LogService) {
+        route: ActivatedRoute, logService: LogService) {
         super(authService, router, i18nService, apiService, platformUtilsService, window, environmentService,
-            stateService, storageService, route, logService);
+            stateService, route, logService);
         this.onSuccessfulLoginNavigate = this.goAfterLogIn;
     }
 
@@ -57,10 +56,10 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
     }
 
     async goAfterLogIn() {
-        const loginRedirect = await this.stateService.get<any>('loginRedirect');
+        const loginRedirect = await this.stateService.getLoginRedirect();
         if (loginRedirect != null) {
             this.router.navigate([loginRedirect.route], { queryParams: loginRedirect.qParams });
-            await this.stateService.remove('loginRedirect');
+            await this.stateService.setLoginRedirect(null);
         } else {
             this.router.navigate([this.successRoute], {
                 queryParams: {

src/app/accounts/update-temp-password.component.ts

@@ -9,9 +9,9 @@ import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGen
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { UpdateTempPasswordComponent as BaseUpdateTempPasswordComponent } from 'jslib-angular/components/update-temp-password.component';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 @Component({
     selector: 'app-update-temp-password',
@@ -21,10 +21,9 @@ import { UpdateTempPasswordComponent as BaseUpdateTempPasswordComponent } from '
 export class UpdateTempPasswordComponent extends BaseUpdateTempPasswordComponent {
     constructor(i18nService: I18nService, platformUtilsService: PlatformUtilsService,
         passwordGenerationService: PasswordGenerationService, policyService: PolicyService,
-        cryptoService: CryptoService, userService: UserService,
+        cryptoService: CryptoService, messagingService: MessagingService,
-        messagingService: MessagingService, apiService: ApiService,
+        apiService: ApiService, logService: LogService, stateService: StateService, syncService: SyncService) {
-        syncService: SyncService, logService: LogService) {
         super(i18nService, platformUtilsService, passwordGenerationService, policyService, cryptoService,
-            userService, messagingService, apiService, syncService, logService);
+            messagingService, apiService, stateService, syncService, logService);
     }
 }

src/app/accounts/verify-email-token.component.ts

@@ -9,12 +9,11 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { VerifyEmailRequest } from 'jslib-common/models/request/verifyEmailRequest';
 
@@ -23,10 +22,15 @@ import { VerifyEmailRequest } from 'jslib-common/models/request/verifyEmailReque
     templateUrl: 'verify-email-token.component.html',
 })
 export class VerifyEmailTokenComponent implements OnInit {
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(
-        private i18nService: I18nService, private route: ActivatedRoute,
+        private router: Router,
-        private apiService: ApiService, private userService: UserService,
+        private platformUtilsService: PlatformUtilsService,
-        private logService: LogService) { }
+        private i18nService: I18nService,
+        private route: ActivatedRoute,
+        private apiService: ApiService,
+        private logService: LogService,
+        private stateService: StateService
+    ) { }
 
     ngOnInit() {
         this.route.queryParams.pipe(first()).subscribe(async qParams => {
@@ -34,18 +38,17 @@ export class VerifyEmailTokenComponent implements OnInit {
                 try {
                     await this.apiService.postAccountVerifyEmailToken(
                         new VerifyEmailRequest(qParams.userId, qParams.token));
-                    const authed = await this.userService.isAuthenticated();
+                    if (await this.stateService.getIsAuthenticated()) {
-                    if (authed) {
                         await this.apiService.refreshIdentityToken();
                     }
-                    this.toasterService.popAsync('success', null, this.i18nService.t('emailVerified'));
+                    this.platformUtilsService.showToast('success', null, this.i18nService.t('emailVerified'));
                     this.router.navigate(['/']);
                     return;
                 } catch (e) {
                     this.logService.error(e);
                 }
             }
-            this.toasterService.popAsync('error', null, this.i18nService.t('emailVerifiedFailed'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('emailVerifiedFailed'));
             this.router.navigate(['/']);
         });
     }

src/app/accounts/verify-recover-delete.component.ts

@@ -9,11 +9,10 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { VerifyDeleteRecoverRequest } from 'jslib-common/models/request/verifyDeleteRecoverRequest';
 
@@ -29,7 +28,7 @@ export class VerifyRecoverDeleteComponent implements OnInit {
     private token: string;
 
     constructor(private router: Router, private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
         private route: ActivatedRoute, private logService: LogService) {
     }
 
@@ -50,7 +49,7 @@ export class VerifyRecoverDeleteComponent implements OnInit {
             const request = new VerifyDeleteRecoverRequest(this.userId, this.token);
             this.formPromise = this.apiService.postAccountRecoverDeleteToken(request);
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('accountDeleted'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('accountDeleted'),
                 this.i18nService.t('accountDeletedDesc'));
             this.router.navigate(['/']);
         } catch (e) {

src/app/app.component.html

@@ -1,2 +1 @@
-<toaster-container [toasterconfig]="toasterConfig" aria-live="polite"></toaster-container>
 <router-outlet></router-outlet>

src/app/app.component.ts

@@ -1,13 +1,3 @@
-import * as jq from 'jquery';
-import Swal from 'sweetalert2';
-
-import {
-    BodyOutputType,
-    Toast,
-    ToasterConfig,
-    ToasterService,
-} from 'angular2-toaster';
-
 import {
     Component,
     NgZone,
@@ -20,12 +10,12 @@ import {
     NavigationEnd,
     Router,
 } from '@angular/router';
-
+import * as jq from 'jquery';
-import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';
+import { IndividualConfig, ToastrService } from 'ngx-toastr';
-
+import Swal from 'sweetalert2';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
 
 import { AuthService } from 'jslib-common/abstractions/auth.service';
+import { BroadcasterService } from 'jslib-common/abstractions/broadcaster.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
@@ -40,13 +30,11 @@ import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
 import { SettingsService } from 'jslib-common/abstractions/settings.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
+import { StorageService } from 'jslib-common/abstractions/storage.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { TokenService } from 'jslib-common/abstractions/token.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 import { VaultTimeoutService } from 'jslib-common/abstractions/vaultTimeout.service';
 
-import { ConstantsService } from 'jslib-common/services/constants.service';
-
 import { PolicyListService } from './services/policy-list.service';
 import { RouterService } from './services/router.service';
 
@@ -69,32 +57,37 @@ const IdleTimeout = 60000 * 10; // 10 minutes
 })
 export class AppComponent implements OnDestroy, OnInit {
 
-    toasterConfig: ToasterConfig = new ToasterConfig({
-        showCloseButton: true,
-        mouseoverTimerStop: true,
-        animation: 'flyRight',
-        limit: 5,
-    });
-
     private lastActivity: number = null;
     private idleTimer: number = null;
     private isIdle = false;
 
     constructor(
-        private broadcasterService: BroadcasterService, private userService: UserService,
+        private broadcasterService: BroadcasterService,
-        private tokenService: TokenService, private folderService: FolderService,
+        private tokenService: TokenService,
-        private settingsService: SettingsService, private syncService: SyncService,
+        private folderService: FolderService,
-        private passwordGenerationService: PasswordGenerationService, private cipherService: CipherService,
+        private settingsService: SettingsService,
-        private authService: AuthService, private router: Router,
+        private syncService: SyncService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private passwordGenerationService: PasswordGenerationService,
-        private platformUtilsService: PlatformUtilsService, private ngZone: NgZone,
+        private cipherService: CipherService,
-        private vaultTimeoutService: VaultTimeoutService, private storageService: StorageService,
+        private authService: AuthService,
-        private cryptoService: CryptoService, private collectionService: CollectionService,
+        private router: Router,
-        private sanitizer: DomSanitizer, private searchService: SearchService,
+        private toastrService: ToastrService,
-        private notificationsService: NotificationsService, private routerService: RouterService,
+        private i18nService: I18nService,
-        private stateService: StateService, private eventService: EventService,
+        private platformUtilsService: PlatformUtilsService,
-        private policyService: PolicyService, protected policyListService: PolicyListService,
+        private ngZone: NgZone,
-        private keyConnectorService: KeyConnectorService) { }
+        private vaultTimeoutService: VaultTimeoutService,
+        private cryptoService: CryptoService,
+        private collectionService: CollectionService,
+        private sanitizer: DomSanitizer,
+        private searchService: SearchService,
+        private notificationsService: NotificationsService,
+        private routerService: RouterService,
+        private stateService: StateService,
+        private eventService: EventService,
+        private policyService: PolicyService,
+        protected policyListService: PolicyListService,
+        private keyConnectorService: KeyConnectorService
+    ) { }
 
     ngOnInit() {
         this.ngZone.runOutsideAngular(() => {
@@ -209,31 +202,29 @@ export class AppComponent implements OnDestroy, OnInit {
 
     private async logOut(expired: boolean) {
         await this.eventService.uploadEvents();
-        const userId = await this.userService.getUserId();
+        const userId = await this.stateService.getUserId();
-
         await Promise.all([
             this.eventService.clearEvents(),
             this.syncService.setLastSync(new Date(0)),
             this.tokenService.clearToken(),
             this.cryptoService.clearKeys(),
-            this.userService.clear(),
             this.settingsService.clear(userId),
             this.cipherService.clear(userId),
             this.folderService.clear(userId),
             this.collectionService.clear(userId),
             this.policyService.clear(userId),
             this.passwordGenerationService.clear(),
-            this.stateService.purge(),
             this.keyConnectorService.clear(),
         ]);
 
         this.searchService.clearIndex();
         this.authService.logOut(async () => {
             if (expired) {
-                this.toasterService.popAsync('warning', this.i18nService.t('loggedOut'),
+                this.platformUtilsService.showToast('warning', this.i18nService.t('loggedOut'),
                     this.i18nService.t('loginExpired'));
             }
 
+            await this.stateService.clean({ userId: userId });
             Swal.close();
             this.router.navigate(['/']);
         });
@@ -246,8 +237,7 @@ export class AppComponent implements OnDestroy, OnInit {
         }
 
         this.lastActivity = now;
-        this.storageService.save(ConstantsService.lastActiveKey, now);
+        this.stateService.setLastActive(now);
-
         // Idle states
         if (this.isIdle) {
             this.isIdle = false;
@@ -266,30 +256,29 @@ export class AppComponent implements OnDestroy, OnInit {
     }
 
     private showToast(msg: any) {
-        const toast: Toast = {
+        let message = '';
-            type: msg.type,
+
-            title: msg.title,
+        const options: Partial<IndividualConfig> = {};
-        };
+
         if (typeof (msg.text) === 'string') {
-            toast.body = msg.text;
+            message = msg.text;
         } else if (msg.text.length === 1) {
-            toast.body = msg.text[0];
+            message = msg.text[0];
         } else {
-            let message = '';
             msg.text.forEach((t: string) =>
                 message += ('<p>' + this.sanitizer.sanitize(SecurityContext.HTML, t) + '</p>'));
-            toast.body = message;
+            options.enableHtml = true;
-            toast.bodyOutputType = BodyOutputType.TrustedHtml;
         }
         if (msg.options != null) {
             if (msg.options.trustedHtml === true) {
-                toast.bodyOutputType = BodyOutputType.TrustedHtml;
+                options.enableHtml = true;
             }
             if (msg.options.timeout != null && msg.options.timeout > 0) {
-                toast.timeout = msg.options.timeout;
+                options.timeOut = msg.options.timeout;
             }
         }
-        this.toasterService.popAsync(toast);
+
+        this.toastrService.show(message, msg.title, options, 'toast-' + msg.type);
     }
 
     private idleStateChanged() {
@@ -301,7 +290,7 @@ export class AppComponent implements OnDestroy, OnInit {
     }
 
     private async setFullWidth() {
-        const enableFullWidth = await this.storageService.get<boolean>('enableFullWidth');
+        const enableFullWidth = await this.stateService.getEnableFullWidth();
         if (enableFullWidth) {
             document.body.classList.add('full-width');
         } else {

src/app/app.module.ts

@@ -1,4 +1,3 @@
-import { ToasterModule } from 'angular2-toaster';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 
 import { DragDropModule } from '@angular/cdk/drag-drop';
@@ -6,6 +5,8 @@ import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
+import { BitwardenToastModule } from 'jslib-angular/components/toastr.component';
+
 import { AppComponent } from './app.component';
 import { OssRoutingModule } from './oss-routing.module';
 import { OssModule } from './oss.module';
@@ -18,7 +19,11 @@ import { WildcardRoutingModule } from './wildcard-routing.module';
         BrowserAnimationsModule,
         FormsModule,
         ServicesModule,
-        ToasterModule.forRoot(),
+        BitwardenToastModule.forRoot({
+            maxOpened: 5,
+            autoDismiss: true,
+            closeButton: true,
+        }),
         InfiniteScrollModule,
         DragDropModule,
         OssRoutingModule,

src/app/common/base.accept.component.ts

@@ -7,16 +7,11 @@ import {
     Router,
 } from '@angular/router';
 
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
-
 import { first } from 'rxjs/operators';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 @Directive()
 export abstract class BaseAcceptComponent implements OnInit {
@@ -29,21 +24,20 @@ export abstract class BaseAcceptComponent implements OnInit {
     protected failedShortMessage = 'inviteAcceptFailedShort';
     protected failedMessage = 'inviteAcceptFailed';
 
-    constructor(protected router: Router, protected toasterService: ToasterService,
+    constructor(protected router: Router, protected platformUtilService: PlatformUtilsService,
         protected i18nService: I18nService, protected route: ActivatedRoute,
-        protected userService: UserService, protected stateService: StateService) { }
+        protected stateService: StateService) { }
 
     abstract authedHandler(qParams: any): Promise<void>;
     abstract unauthedHandler(qParams: any): Promise<void>;
 
     ngOnInit() {
         this.route.queryParams.pipe(first()).subscribe(async qParams => {
-            await this.stateService.remove('loginRedirect');
+            await this.stateService.setLoginRedirect(null);
-
             let error = this.requiredParameters.some(e => qParams?.[e] == null || qParams[e] === '');
             let errorMessage: string = null;
             if (!error) {
-                this.authed = await this.userService.isAuthenticated();
+                this.authed = await this.stateService.getIsAuthenticated();
 
                 if (this.authed) {
                     try {
@@ -53,7 +47,7 @@ export abstract class BaseAcceptComponent implements OnInit {
                         errorMessage = e.message;
                     }
                 } else {
-                    await this.stateService.save('loginRedirect', {
+                    await this.stateService.setLoginRedirect({
                         route: this.getRedirectRoute(),
                         qParams: qParams,
                     });
@@ -64,14 +58,9 @@ export abstract class BaseAcceptComponent implements OnInit {
             }
 
             if (error) {
-                const toast: Toast = {
+                const message = errorMessage != null ? this.i18nService.t(this.failedShortMessage, errorMessage) :
-                    type: 'error',
+                        this.i18nService.t(this.failedMessage);
-                    title: null,
+                this.platformUtilService.showToast('error', null, message, {timeout: 10000});
-                    body: errorMessage != null ? this.i18nService.t(this.failedShortMessage, errorMessage) :
-                        this.i18nService.t(this.failedMessage),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
                 this.router.navigate(['/']);
             }
 

src/app/common/base.events.component.ts

@@ -1,5 +1,4 @@
 import { Directive } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
 import { ExportService } from 'jslib-common/abstractions/export.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -29,8 +28,8 @@ export abstract class BaseEventsComponent {
     abstract readonly exportFileName: string;
 
     constructor(protected eventService: EventService, protected i18nService: I18nService,
-        protected toasterService: ToasterService, protected exportService: ExportService,
+        protected exportService: ExportService, protected platformUtilsService: PlatformUtilsService,
-        protected platformUtilsService: PlatformUtilsService, protected logService: LogService) {
+        protected logService: LogService) {
         const defaultDates = this.eventService.getDefaultDateFilters();
         this.start = defaultDates[0];
         this.end = defaultDates[1];
@@ -129,7 +128,7 @@ export abstract class BaseEventsComponent {
         try {
             dates = this.eventService.formatDateFilters(this.start, this.end);
         } catch (e) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('invalidDateRange'));
             return null;
         }

src/app/common/base.people.component.ts

@@ -3,20 +3,17 @@ import {
     ViewChild,
     ViewContainerRef
 } from '@angular/core';
-import { ToasterService } from 'angular2-toaster';
 
-import { ValidationService } from 'jslib-angular/services/validation.service';
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
-
-import { ConstantsService } from 'jslib-common/services/constants.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
+import { ValidationService } from 'jslib-angular/services/validation.service';
 
 import { SearchPipe } from 'jslib-angular/pipes/search.pipe';
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
@@ -89,12 +86,19 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
 
     private pagedUsersCount = 0;
 
-    constructor(protected apiService: ApiService, private searchService: SearchService,
+    constructor(
-        protected i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
+        protected apiService: ApiService,
-        protected toasterService: ToasterService, protected cryptoService: CryptoService,
+        private searchService: SearchService,
-        private storageService: StorageService, protected validationService: ValidationService,
+        protected i18nService: I18nService,
-        protected modalService: ModalService, private logService: LogService,
+        protected platformUtilsService: PlatformUtilsService,
-        private searchPipe: SearchPipe, protected userNamePipe: UserNamePipe ) { }
+        protected cryptoService: CryptoService,
+        protected validationService: ValidationService,
+        protected modalService: ModalService,
+        private logService: LogService,
+        private searchPipe: SearchPipe,
+        protected userNamePipe: UserNamePipe,
+        protected stateService: StateService,
+    ) { }
 
     abstract edit(user: UserType): void;
     abstract getUsers(): Promise<ListResponse<UserType>>;
@@ -190,7 +194,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
         this.actionPromise = this.deleteUser(user.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.userNamePipe.transform(user)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId',
+                this.userNamePipe.transform(user)));
             this.removeUser(user);
         } catch (e) {
             this.validationService.showError(e);
@@ -206,7 +211,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
         this.actionPromise = this.reinviteUser(user.id);
         try {
             await this.actionPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenReinvited', this.userNamePipe.transform(user)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenReinvited',
+                this.userNamePipe.transform(user)));
         } catch (e) {
             this.validationService.showError(e);
         }
@@ -228,7 +234,8 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
                 this.actionPromise = this.confirmUser(user, publicKey);
                 await this.actionPromise;
                 updateUser(this);
-                this.toasterService.popAsync('success', null, this.i18nService.t('hasBeenConfirmed', this.userNamePipe.transform(user)));
+                this.platformUtilsService.showToast('success', null, this.i18nService.t('hasBeenConfirmed',
+                    this.userNamePipe.transform(user)));
             } catch (e) {
                 this.validationService.showError(e);
                 throw e;
@@ -245,7 +252,7 @@ export abstract class BasePeopleComponent<UserType extends ProviderUserUserDetai
             const publicKeyResponse = await this.apiService.getUserPublicKey(user.userId);
             const publicKey = Utils.fromB64ToArray(publicKeyResponse.publicKey);
 
-            const autoConfirm = await this.storageService.get<boolean>(ConstantsService.autoConfirmFingerprints);
+            const autoConfirm = await this.stateService.getAutoConfirmFingerPrints();
             if (autoConfirm == null || !autoConfirm) {
                 const [modal] = await this.modalService.openViewRef(UserConfirmComponent, this.confirmModalRef, comp => {
                     comp.name = this.userNamePipe.transform(user);

src/app/layouts/navbar.component.ts

@@ -5,9 +5,9 @@ import {
 
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
 import { TokenService } from 'jslib-common/abstractions/token.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { Provider } from 'jslib-common/models/domain/provider';
 
@@ -22,7 +22,7 @@ export class NavbarComponent implements OnInit {
     providers: Provider[] = [];
 
     constructor(private messagingService: MessagingService, private platformUtilsService: PlatformUtilsService,
-        private tokenService: TokenService, private userService: UserService, private syncService: SyncService) {
+        private tokenService: TokenService, private providerService: ProviderService, private syncService: SyncService) {
         this.selfHosted = this.platformUtilsService.isSelfHost();
     }
 
@@ -37,7 +37,7 @@ export class NavbarComponent implements OnInit {
         if (await this.syncService.getLastSync() == null) {
             await this.syncService.fullSync(false);
         }
-        this.providers = await this.userService.getAllProviders();
+        this.providers = await this.providerService.getAll();
     }
 
     lock() {

src/app/layouts/organization-layout.component.ts

@@ -7,9 +7,8 @@ import {
 
 import { ActivatedRoute } from '@angular/router';
 
-import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';
+import { BroadcasterService } from 'jslib-common/abstractions/broadcaster.service';
-
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 
@@ -24,7 +23,7 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
     businessTokenPromise: Promise<any>;
     private organizationId: string;
 
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(private route: ActivatedRoute, private organizationService: OrganizationService,
         private broadcasterService: BroadcasterService, private ngZone: NgZone) { }
 
     ngOnInit() {
@@ -49,7 +48,7 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
     }
 
     async load() {
-        this.organization = await this.userService.getOrganization(this.organizationId);
+        this.organization = await this.organizationService.get(this.organizationId);
     }
 
     get showMenuBar() {

src/app/organizations/manage/collection-add-edit.component.ts

@@ -6,14 +6,12 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { EncString } from 'jslib-common/models/domain/encString';
 import { SymmetricCryptoKey } from 'jslib-common/models/domain/symmetricCryptoKey';
@@ -47,13 +45,17 @@ export class CollectionAddEditComponent implements OnInit {
 
     private orgKey: SymmetricCryptoKey;
 
-    constructor(private apiService: ApiService, private i18nService: I18nService,
+    constructor(
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
+        private apiService: ApiService,
-        private cryptoService: CryptoService, private userService: UserService,
+        private i18nService: I18nService,
-        private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService,
+        private cryptoService: CryptoService,
+        private logService: LogService,
+        private organizationService: OrganizationService
+    ) { }
 
     async ngOnInit() {
-        const organization = await this.userService.getOrganization(this.organizationId);
+        const organization = await this.organizationService.get(this.organizationId);
         this.accessGroups = organization.useGroups;
         this.editMode = this.loading = this.collectionId != null;
         if (this.accessGroups) {
@@ -128,7 +130,7 @@ export class CollectionAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postCollection(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedCollectionId' : 'createdCollectionId', this.name));
             this.onSavedCollection.emit();
         } catch (e) {
@@ -151,7 +153,7 @@ export class CollectionAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteCollection(this.organizationId, this.collectionId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedCollectionId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedCollectionId', this.name));
             this.onDeletedCollection.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/collections.component.ts

@@ -5,7 +5,6 @@ import {
     ViewContainerRef,
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -13,9 +12,9 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -54,11 +53,17 @@ export class CollectionsComponent implements OnInit {
 
     private pagedCollectionsCount = 0;
 
-    constructor(private apiService: ApiService, private route: ActivatedRoute,
+    constructor(
-        private collectionService: CollectionService, private modalService: ModalService,
+        private apiService: ApiService,
-        private toasterService: ToasterService, private i18nService: I18nService,
+        private route: ActivatedRoute,
-        private platformUtilsService: PlatformUtilsService, private userService: UserService,
+        private collectionService: CollectionService,
-        private searchService: SearchService, private logService: LogService) { }
+        private modalService: ModalService,
+        private i18nService: I18nService,
+        private platformUtilsService: PlatformUtilsService,
+        private searchService: SearchService,
+        private logService: LogService,
+        private organizationService: OrganizationService,
+    ) { }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
@@ -71,7 +76,7 @@ export class CollectionsComponent implements OnInit {
     }
 
     async load() {
-        this.organization = await this.userService.getOrganization(this.organizationId);
+        this.organization = await this.organizationService.get(this.organizationId);
         this.canCreate = this.organization.canCreateNewCollections;
 
         const decryptCollections = async (r: ListResponse<CollectionResponse>) => {
@@ -119,7 +124,7 @@ export class CollectionsComponent implements OnInit {
         const canDelete = collection != null && this.canDelete(collection);
 
         if (!(canCreate || canEdit || canDelete)) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('missingPermissions'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('missingPermissions'));
             return;
         }
 
@@ -153,11 +158,11 @@ export class CollectionsComponent implements OnInit {
 
         try {
             await this.apiService.deleteCollection(this.organizationId, collection.id);
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedCollectionId', collection.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedCollectionId', collection.name));
             this.removeCollection(collection);
         } catch (e) {
             this.logService.error(e);
-            this.toasterService.popAsync('error', null, this.i18nService.t('missingPermissions'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('missingPermissions'));
         }
     }
 

src/app/organizations/manage/entity-events.component.ts

@@ -4,8 +4,6 @@ import {
     OnInit,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -14,6 +12,7 @@ import { EventService } from '../../services/event.service';
 
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { EventResponse } from 'jslib-common/models/response/eventResponse';
 import { ListResponse } from 'jslib-common/models/response/listResponse';
 
@@ -42,7 +41,7 @@ export class EntityEventsComponent implements OnInit {
     private orgUsersIdMap = new Map<string, any>();
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private eventService: EventService, private toasterService: ToasterService,
+        private eventService: EventService, private platformUtilsService: PlatformUtilsService,
         private userNamePipe: UserNamePipe, private logService: LogService) { }
 
     async ngOnInit() {
@@ -74,7 +73,7 @@ export class EntityEventsComponent implements OnInit {
         try {
             dates = this.eventService.formatDateFilters(this.start, this.end);
         } catch (e) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('invalidDateRange'));
             return;
         }

src/app/organizations/manage/entity-users.component.ts

@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -17,6 +15,7 @@ import { OrganizationUserType } from 'jslib-common/enums/organizationUserType';
 import { SelectionReadOnlyRequest } from 'jslib-common/models/request/selectionReadOnlyRequest';
 import { OrganizationUserUserDetailsResponse } from 'jslib-common/models/response/organizationUserResponse';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { Utils } from 'jslib-common/misc/utils';
 
 @Component({
@@ -42,7 +41,7 @@ export class EntityUsersComponent implements OnInit {
     private allUsers: OrganizationUserUserDetailsResponse[] = [];
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         await this.loadUsers();
@@ -129,7 +128,7 @@ export class EntityUsersComponent implements OnInit {
                 this.formPromise = this.apiService.putCollectionUsers(this.organizationId, this.entityId, selections);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('updatedUsers'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('updatedUsers'));
             this.onEditedUsers.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/events.component.ts

@@ -3,7 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { UserNamePipe } from 'jslib-angular/pipes/user-name.pipe';
 
@@ -11,8 +10,9 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { ExportService } from 'jslib-common/abstractions/export.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 import { EventResponse } from 'jslib-common/models/response/eventResponse';
@@ -32,17 +32,32 @@ export class EventsComponent extends BaseEventsComponent implements OnInit {
 
     private orgUsersUserIdMap = new Map<string, any>();
 
-    constructor(private apiService: ApiService, private route: ActivatedRoute, eventService: EventService,
+    constructor(
-        i18nService: I18nService, toasterService: ToasterService, private userService: UserService,
+        private apiService: ApiService,
-        exportService: ExportService, platformUtilsService: PlatformUtilsService, private router: Router,
+        private route: ActivatedRoute,
-        logService: LogService, private userNamePipe: UserNamePipe) {
+        eventService: EventService,
-        super(eventService, i18nService, toasterService, exportService, platformUtilsService, logService);
+        i18nService: I18nService,
+        exportService: ExportService,
+        platformUtilsService: PlatformUtilsService,
+        private router: Router,
+        logService: LogService,
+        private userNamePipe: UserNamePipe,
+        private organizationService: OrganizationService,
+        private providerService: ProviderService,
+    ) {
+        super(
+            eventService,
+            i18nService,
+            exportService,
+            platformUtilsService,
+            logService
+        );
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
             this.organizationId = params.organizationId;
-            this.organization = await this.userService.getOrganization(this.organizationId);
+            this.organization = await this.organizationService.get(this.organizationId);
             if (this.organization == null || !this.organization.useEvents) {
                 this.router.navigate(['/organizations', this.organizationId]);
                 return;
@@ -61,8 +76,8 @@ export class EventsComponent extends BaseEventsComponent implements OnInit {
 
         if (this.organization.providerId != null) {
             try {
-                const provider = await this.userService.getProvider(this.organization.providerId);
+                const provider = await this.providerService.get(this.organization.providerId);
-                if (provider != null && (await this.userService.getProvider(this.organization.providerId)).canManageUsers) {
+                if (provider != null && (await this.providerService.get(this.organization.providerId)).canManageUsers) {
                     const providerUsersResponse = await this.apiService.getProviderUsers(this.organization.providerId);
                     providerUsersResponse.data.forEach(u => {
                         const name = this.userNamePipe.transform(u);

src/app/organizations/manage/group-add-edit.component.ts

@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -42,7 +40,7 @@ export class GroupAddEditComponent implements OnInit {
     deletePromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private collectionService: CollectionService,
+        private collectionService: CollectionService,
         private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
@@ -112,7 +110,7 @@ export class GroupAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postGroup(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedGroupId' : 'createdGroupId', this.name));
             this.onSavedGroup.emit();
         } catch (e) {
@@ -135,7 +133,7 @@ export class GroupAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteGroup(this.organizationId, this.groupId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedGroupId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedGroupId', this.name));
             this.onDeletedGroup.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/groups.component.ts

@@ -11,14 +11,12 @@ import {
 
 import { first } from 'rxjs/operators';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -48,16 +46,22 @@ export class GroupsComponent implements OnInit {
 
     private pagedGroupsCount = 0;
 
-    constructor(private apiService: ApiService, private route: ActivatedRoute,
+    constructor(
-        private i18nService: I18nService, private modalService: ModalService,
+        private apiService: ApiService,
-        private toasterService: ToasterService, private platformUtilsService: PlatformUtilsService,
+        private route: ActivatedRoute,
-        private userService: UserService, private router: Router,
+        private i18nService: I18nService,
-        private searchService: SearchService, private logService: LogService) { }
+        private modalService: ModalService,
+        private platformUtilsService: PlatformUtilsService,
+        private router: Router,
+        private searchService: SearchService,
+        private logService: LogService,
+        private organizationService: OrganizationService,
+    ) { }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
             this.organizationId = params.organizationId;
-            const organization = await this.userService.getOrganization(this.organizationId);
+            const organization = await this.organizationService.get(this.organizationId);
             if (organization == null || !organization.useGroups) {
                 this.router.navigate(['/organizations', this.organizationId]);
                 return;
@@ -123,7 +127,7 @@ export class GroupsComponent implements OnInit {
 
         try {
             await this.apiService.deleteGroup(this.organizationId, group.id);
-            this.toasterService.popAsync('success', null, this.i18nService.t('deletedGroupId', group.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedGroupId', group.name));
             this.removeGroup(group);
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/manage.component.ts

@@ -4,7 +4,7 @@ import {
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 
@@ -19,11 +19,11 @@ export class ManageComponent implements OnInit {
     accessEvents: boolean = false;
     accessSso: boolean = false;
 
-    constructor(private route: ActivatedRoute, private userService: UserService) {}
+    constructor(private route: ActivatedRoute, private organizationService: OrganizationService) {}
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             this.accessPolicies = this.organization.usePolicies;
             this.accessSso = this.organization.useSso;
             this.accessEvents = this.organization.useEvents;

src/app/organizations/manage/people.component.ts

@@ -12,20 +12,18 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ValidationService } from 'jslib-angular/services/validation.service';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -80,21 +78,43 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
     orgResetPasswordPolicyEnabled = false;
     callingUserType: OrganizationUserType = null;
 
-    constructor(apiService: ApiService, private route: ActivatedRoute,
+    constructor(
-        i18nService: I18nService, modalService: ModalService,
+        apiService: ApiService,
-        platformUtilsService: PlatformUtilsService, toasterService: ToasterService,
+        private route: ActivatedRoute,
-        cryptoService: CryptoService, private userService: UserService, private router: Router,
+        i18nService: I18nService,
-        storageService: StorageService, searchService: SearchService,
+        modalService: ModalService,
-        validationService: ValidationService, private policyService: PolicyService,
+        platformUtilsService: PlatformUtilsService,
-        logService: LogService, searchPipe: SearchPipe, userNamePipe: UserNamePipe, private syncService: SyncService) {
+        cryptoService: CryptoService,
-            super(apiService, searchService, i18nService, platformUtilsService, toasterService, cryptoService,
+        private router: Router,
-                storageService, validationService, modalService, logService, searchPipe, userNamePipe);
+        searchService: SearchService,
+        validationService: ValidationService,
+        private policyService: PolicyService,
+        logService: LogService,
+        searchPipe: SearchPipe,
+        userNamePipe: UserNamePipe,
+        private syncService: SyncService,
+        stateService: StateService,
+        private organizationService: OrganizationService,
+    ) {
+            super(
+                apiService,
+                searchService,
+                i18nService,
+                platformUtilsService,
+                cryptoService,
+                validationService,
+                modalService,
+                logService,
+                searchPipe,
+                userNamePipe,
+                stateService,
+            );
         }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
             this.organizationId = params.organizationId;
-            const organization = await this.userService.getOrganization(this.organizationId);
+            const organization = await this.organizationService.get(this.organizationId);
             if (!organization.canManageUsers) {
                 this.router.navigate(['../collections'], { relativeTo: this.route });
                 return;
@@ -239,7 +259,7 @@ export class PeopleComponent extends BasePeopleComponent<OrganizationUserUserDet
         const filteredUsers = users.filter(u => u.status === OrganizationUserStatusType.Invited);
 
         if (filteredUsers.length <= 0) {
-            this.toasterService.popAsync('error', this.i18nService.t('errorOccurred'),
+            this.platformUtilsService.showToast('error', this.i18nService.t('errorOccurred'),
                 this.i18nService.t('noSelectedUsersApplicable'));
             return;
         }

src/app/organizations/manage/policies.component.ts

@@ -14,7 +14,7 @@ import { first } from 'rxjs/operators';
 import { PolicyType } from 'jslib-common/enums/policyType';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -43,13 +43,13 @@ export class PoliciesComponent implements OnInit {
     private policiesEnabledMap: Map<PolicyType, boolean> = new Map<PolicyType, boolean>();
 
     constructor(private apiService: ApiService, private route: ActivatedRoute,
-        private modalService: ModalService, private userService: UserService,
+        private modalService: ModalService, private organizationService: OrganizationService,
         private policyListService: PolicyListService, private router: Router) { }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
             this.organizationId = params.organizationId;
-            this.organization = await this.userService.getOrganization(this.organizationId);
+            this.organization = await this.organizationService.get(this.organizationId);
             if (this.organization == null || !this.organization.usePolicies) {
                 this.router.navigate(['/organizations', this.organizationId]);
                 return;

src/app/organizations/manage/policy-edit.component.ts

@@ -9,11 +9,10 @@ import {
     ViewContainerRef,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { PolicyType } from 'jslib-common/enums/policyType';
 
@@ -45,7 +44,7 @@ export class PolicyEditComponent {
     private policyResponse: PolicyResponse;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private componentFactoryResolver: ComponentFactoryResolver,
+        private platformUtilsService: PlatformUtilsService, private componentFactoryResolver: ComponentFactoryResolver,
         private cdr: ChangeDetectorRef, private logService: LogService) {
     }
 
@@ -78,14 +77,14 @@ export class PolicyEditComponent {
         try {
             request = await this.policyComponent.buildRequest(this.policiesEnabledMap);
         } catch (e) {
-            this.toasterService.pop('error', null, e);
+            this.platformUtilsService.showToast('error', null, e);
             return;
         }
 
         try {
             this.formPromise = this.apiService.putPolicy(this.organizationId, this.policy.type, request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('editedPolicyId', this.i18nService.t(this.policy.name)));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('editedPolicyId', this.i18nService.t(this.policy.name)));
             this.onSavedPolicy.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/user-add-edit.component.ts

@@ -6,8 +6,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -86,7 +84,7 @@ export class UserAddEditComponent implements OnInit {
     }
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private collectionService: CollectionService,
+        private collectionService: CollectionService,
         private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
@@ -181,7 +179,7 @@ export class UserAddEditComponent implements OnInit {
                 this.formPromise = this.apiService.postOrganizationUserInvite(this.organizationId, request);
             }
             await this.formPromise;
-            this.toasterService.popAsync('success', null,
+            this.platformUtilsService.showToast('success', null,
                 this.i18nService.t(this.editMode ? 'editedUserId' : 'invitedUsers', this.name));
             this.onSavedUser.emit();
         } catch (e) {
@@ -205,7 +203,7 @@ export class UserAddEditComponent implements OnInit {
         try {
             this.deletePromise = this.apiService.deleteOrganizationUser(this.organizationId, this.organizationUserId);
             await this.deletePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removedUserId', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removedUserId', this.name));
             this.onDeletedUser.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/manage/user-confirm.component.ts

@@ -6,11 +6,9 @@ import {
     Output,
 } from '@angular/core';
 
-import { ConstantsService } from 'jslib-common/services/constants.service';
-
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 @Component({
     selector: 'app-user-confirm',
@@ -27,8 +25,8 @@ export class UserConfirmComponent implements OnInit {
     fingerprint: string;
     formPromise: Promise<any>;
 
-    constructor(private cryptoService: CryptoService, private storageService: StorageService,
+    constructor(private cryptoService: CryptoService, private logService: LogService,
-        private logService: LogService) { }
+        private stateService: StateService) { }
 
     async ngOnInit() {
         try {
@@ -50,7 +48,7 @@ export class UserConfirmComponent implements OnInit {
         }
 
         if (this.dontAskAgain) {
-            await this.storageService.save(ConstantsService.autoConfirmFingerprints, true);
+            await this.stateService.setAutoConfirmFingerprints(true);
         }
 
         this.onConfirmedUser.emit();

src/app/organizations/manage/user-groups.component.ts

@@ -6,11 +6,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { OrganizationUserUpdateGroupsRequest } from 'jslib-common/models/request/organizationUserUpdateGroupsRequest';
 import { GroupResponse } from 'jslib-common/models/response/groupResponse';
@@ -32,7 +31,7 @@ export class UserGroupsComponent implements OnInit {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     async ngOnInit() {
         const groupsResponse = await this.apiService.getGroups(this.organizationId);
@@ -77,7 +76,7 @@ export class UserGroupsComponent implements OnInit {
             this.formPromise = this.apiService.putOrganizationUserGroups(this.organizationId, this.organizationUserId,
                 request);
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('editedGroupsForUser', this.name));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('editedGroupsForUser', this.name));
             this.onSavedUser.emit();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/policies/master-password.component.ts

@@ -2,7 +2,7 @@ import { Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 import { PolicyType } from 'jslib-common/enums/policyType';
 
@@ -33,7 +33,7 @@ export class MasterPasswordPolicyComponent extends BasePolicyComponent {
     passwordScores: { name: string; value: number; }[];
     showKeyConnectorInfo: boolean = false;
 
-    constructor(private fb: FormBuilder, i18nService: I18nService, private userService: UserService) {
+    constructor(private fb: FormBuilder, i18nService: I18nService, private organizationService: OrganizationService) {
         super();
 
         this.passwordScores = [
@@ -48,7 +48,7 @@ export class MasterPasswordPolicyComponent extends BasePolicyComponent {
 
     async ngOnInit() {
         super.ngOnInit();
-        const organization = await this.userService.getOrganization(this.policyResponse.organizationId);
+        const organization = await this.organizationService.get(this.policyResponse.organizationId);
         this.showKeyConnectorInfo = organization.keyConnectorEnabled;
     }
 }

src/app/organizations/policies/reset-password.component.ts

@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 import { PolicyType } from 'jslib-common/enums/policyType';
 
@@ -32,13 +32,13 @@ export class ResetPasswordPolicyComponent extends BasePolicyComponent {
     defaultTypes: { name: string; value: string; }[];
     showKeyConnectorInfo: boolean = false;
 
-    constructor(private fb: FormBuilder, private userService: UserService) {
+    constructor(private fb: FormBuilder, private organizationService: OrganizationService) {
         super();
     }
 
     async ngOnInit() {
         super.ngOnInit();
-        const organization = await this.userService.getOrganization(this.policyResponse.organizationId);
+        const organization = await this.organizationService.get(this.policyResponse.organizationId);
         this.showKeyConnectorInfo = organization.keyConnectorEnabled;
     }
 }

src/app/organizations/settings/account.component.ts

@@ -9,7 +9,6 @@ import {
     Router
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
 import { ModalService } from 'jslib-angular/services/modal.service';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -52,7 +51,7 @@ export class AccountComponent {
 
     constructor(private modalService: ModalService,
         private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private route: ActivatedRoute,
+        private route: ActivatedRoute,
         private syncService: SyncService, private platformUtilsService: PlatformUtilsService,
         private cryptoService: CryptoService, private logService: LogService,
         private router: Router) { }
@@ -90,7 +89,7 @@ export class AccountComponent {
                 return this.syncService.fullSync(true);
             });
             await this.formPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('organizationUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('organizationUpdated'));
         } catch (e) {
             this.logService.error(e);
         }
@@ -99,7 +98,7 @@ export class AccountComponent {
     async submitTaxInfo() {
         this.taxFormPromise = this.taxInfo.submitTaxInfo();
         await this.taxFormPromise;
-        this.toasterService.popAsync('success', null, this.i18nService.t('taxInfoUpdated'));
+        this.platformUtilsService.showToast('success', null, this.i18nService.t('taxInfoUpdated'));
     }
 
     async deleteOrganization() {

src/app/organizations/settings/adjust-subscription.component.ts

@@ -5,11 +5,10 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 import { OrganizationSubscriptionUpdateRequest } from 'jslib-common/models/request/organizationSubscriptionUpdateRequest';
 
@@ -31,7 +30,7 @@ export class AdjustSubscription {
     newMaxSeats: number;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private logService: LogService) { }
+        private platformUtilsService: PlatformUtilsService, private logService: LogService) { }
 
     ngOnInit() {
         this.limitSubscription = this.maxAutoscaleSeats != null;
@@ -47,7 +46,7 @@ export class AdjustSubscription {
 
             await this.formPromise;
 
-            this.toasterService.popAsync('success', null, this.i18nService.t('subscriptionUpdated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('subscriptionUpdated'));
         } catch (e) {
             this.logService.error(e);
         }

src/app/organizations/settings/delete-organization.component.ts

@@ -4,13 +4,12 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { Verification } from 'jslib-common/types/verification';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { UserVerificationService } from 'jslib-common/abstractions/userVerification.service';
 
 @Component({
@@ -26,7 +25,7 @@ export class DeleteOrganizationComponent {
     formPromise: Promise<any>;
 
     constructor(private apiService: ApiService, private i18nService: I18nService,
-        private toasterService: ToasterService, private userVerificationService: UserVerificationService,
+        private platformUtilsService: PlatformUtilsService, private userVerificationService: UserVerificationService,
         private logService: LogService) { }
 
     async submit() {
@@ -34,7 +33,7 @@ export class DeleteOrganizationComponent {
             this.formPromise = this.userVerificationService.buildRequest(this.masterPassword)
                 .then(request => this.apiService.deleteOrganization(this.organizationId, request));
             await this.formPromise;
-            this.toasterService.popAsync('success', this.i18nService.t('organizationDeleted'),
+            this.platformUtilsService.showToast('success', this.i18nService.t('organizationDeleted'),
                 this.i18nService.t('organizationDeletedDesc'));
             this.onSuccess.emit();
         } catch (e) {

src/app/organizations/settings/organization-billing.component.ts

@@ -4,8 +4,6 @@ import {
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -18,10 +16,10 @@ import { UserBillingComponent } from '../../settings/user-billing.component';
     templateUrl: '../../settings/user-billing.component.html',
 })
 export class OrganizationBillingComponent extends UserBillingComponent implements OnInit {
-    constructor(apiService: ApiService, i18nService: I18nService, toasterService: ToasterService,
+    constructor(apiService: ApiService, i18nService: I18nService,
         private route: ActivatedRoute, platformUtilsService: PlatformUtilsService,
         logService: LogService) {
-        super(apiService, i18nService, toasterService, platformUtilsService, logService);
+        super(apiService, i18nService, platformUtilsService, logService);
     }
 
     async ngOnInit() {

src/app/organizations/settings/organization-subscription.component.ts

@@ -3,7 +3,6 @@ import {
     OnInit,
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { ToasterService } from 'angular2-toaster';
 
 import { Organization } from 'jslib-common/models/domain/organization';
 import { OrganizationSubscriptionResponse } from 'jslib-common/models/response/organizationSubscriptionResponse';
@@ -12,8 +11,8 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { PlanType } from 'jslib-common/enums/planType';
 
@@ -43,9 +42,9 @@ export class OrganizationSubscriptionComponent implements OnInit {
     reinstatePromise: Promise<any>;
 
     constructor(private apiService: ApiService, private platformUtilsService: PlatformUtilsService,
-        private i18nService: I18nService, private toasterService: ToasterService,
+        private i18nService: I18nService,
         private messagingService: MessagingService, private route: ActivatedRoute,
-        private userService: UserService, private logService: LogService) {
+        private organizationService: OrganizationService, private logService: LogService) {
         this.selfHosted = platformUtilsService.isSelfHost();
     }
 
@@ -63,7 +62,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         }
 
         this.loading = true;
-        this.userOrg = await this.userService.getOrganization(this.organizationId);
+        this.userOrg = await this.organizationService.get(this.organizationId);
         this.sub = await this.apiService.getOrganizationSubscription(this.organizationId);
         this.loading = false;
     }
@@ -82,7 +81,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.reinstatePromise = this.apiService.postOrganizationReinstate(this.organizationId);
             await this.reinstatePromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('reinstated'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('reinstated'));
             this.load();
         } catch (e) {
             this.logService.error(e);
@@ -103,7 +102,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.cancelPromise = this.apiService.postOrganizationCancel(this.organizationId);
             await this.cancelPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('canceledSubscription'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('canceledSubscription'));
             this.load();
         } catch (e) {
             this.logService.error(e);
@@ -170,7 +169,7 @@ export class OrganizationSubscriptionComponent implements OnInit {
         try {
             this.removeSponsorshipPromise = this.apiService.deleteRemoveSponsorship(this.organizationId);
             await this.removeSponsorshipPromise;
-            this.toasterService.popAsync('success', null, this.i18nService.t('removeSponsorshipSuccess'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('removeSponsorshipSuccess'));
             await this.load();
         } catch (e) {
             this.logService.error(e);

src/app/organizations/settings/settings.component.ts

@@ -1,8 +1,8 @@
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 @Component({
     selector: 'app-org-settings',
@@ -12,13 +12,13 @@ export class SettingsComponent {
     access2fa = false;
     selfHosted: boolean;
 
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(private route: ActivatedRoute, private organizationService: OrganizationService,
         private platformUtilsService: PlatformUtilsService) { }
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
             this.selfHosted = await this.platformUtilsService.isSelfHost();
-            const organization = await this.userService.getOrganization(params.organizationId);
+            const organization = await this.organizationService.get(params.organizationId);
             this.access2fa = organization.use2fa;
         });
     }

src/app/organizations/settings/two-factor-setup.component.ts

@@ -4,7 +4,7 @@ import { ActivatedRoute } from '@angular/router';
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -18,10 +18,10 @@ import { TwoFactorSetupComponent as BaseTwoFactorSetupComponent } from '../../se
     templateUrl: '../../settings/two-factor-setup.component.html',
 })
 export class TwoFactorSetupComponent extends BaseTwoFactorSetupComponent {
-    constructor(apiService: ApiService, userService: UserService,
+    constructor(apiService: ApiService,
         modalService: ModalService, messagingService: MessagingService,
-        policyService: PolicyService, private route: ActivatedRoute) {
+        policyService: PolicyService, private route: ActivatedRoute, stateService: StateService) {
-        super(apiService, userService, modalService, messagingService, policyService);
+        super(apiService, modalService, messagingService, policyService, stateService);
     }
 
     async ngOnInit() {

src/app/organizations/sponsorships/families-for-enterprise-setup.component.ts

@@ -8,10 +8,6 @@ import {
     ActivatedRoute,
     Router,
 } from '@angular/router';
-import {
-    Toast,
-    ToasterService,
-} from 'angular2-toaster';
 
 import { first } from 'rxjs/operators';
 
@@ -20,8 +16,8 @@ import { ValidationService } from 'jslib-angular/services/validation.service';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { PlanSponsorshipType } from 'jslib-common/enums/planSponsorshipType';
 import { PlanType } from 'jslib-common/enums/planType';
@@ -33,6 +29,7 @@ import { OrganizationSponsorshipRedeemRequest } from 'jslib-common/models/reques
 
 import { DeleteOrganizationComponent } from 'src/app/organizations/settings/delete-organization.component';
 
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { OrganizationPlansComponent } from 'src/app/settings/organization-plans.component';
 
 @Component({
@@ -65,10 +62,10 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
     _organizationPlansComponent: OrganizationPlansComponent;
     _selectedFamilyOrganizationId: string = '';
 
-    constructor(private router: Router, private toasterService: ToasterService,
+    constructor(private router: Router, private platformUtilsService: PlatformUtilsService,
         private i18nService: I18nService, private route: ActivatedRoute,
         private apiService: ApiService, private syncService: SyncService,
-        private validationService: ValidationService, private userService: UserService,
+        private validationService: ValidationService, private organizationService: OrganizationService,
         private modalService: ModalService) { }
 
     async ngOnInit() {
@@ -76,13 +73,8 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
         this.route.queryParams.pipe(first()).subscribe(async qParams => {
             const error = qParams.token == null;
             if (error) {
-                const toast: Toast = {
+                this.platformUtilsService.showToast('error', null, this.i18nService.t('sponsoredFamiliesAcceptFailed'),
-                    type: 'error',
+                    { timeout: 10000 });
-                    title: null,
-                    body: this.i18nService.t('sponsoredFamiliesAcceptFailed'),
-                    timeout: 10000,
-                };
-                this.toasterService.popAsync(toast);
                 this.router.navigate(['/']);
                 return;
             }
@@ -93,7 +85,7 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
             this.badToken = !await this.apiService.postPreValidateSponsorshipToken(this.token);
             this.loading = false;
 
-            this.existingFamilyOrganizations = (await this.userService.getAllOrganizations())
+            this.existingFamilyOrganizations = (await this.organizationService.getAll())
                 .filter(o => o.planProductType === ProductType.Families);
 
             if (this.existingFamilyOrganizations.length === 0) {
@@ -124,7 +116,7 @@ export class FamiliesForEnterpriseSetupComponent implements OnInit {
             request.sponsoredOrganizationId = organizationId;
 
             await this.apiService.postRedeemSponsorship(this.token, request);
-            this.toasterService.popAsync('success', null, this.i18nService.t('sponsoredFamiliesOfferRedeemed'));
+            this.platformUtilsService.showToast('success', null, this.i18nService.t('sponsoredFamiliesOfferRedeemed'));
             await this.syncService.fullSync(true);
 
             this.router.navigate(['/']);

src/app/organizations/tools/exposed-passwords-report.component.ts

@@ -4,8 +4,9 @@ import { ActivatedRoute } from '@angular/router';
 import { AuditService } from 'jslib-common/abstractions/audit.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -16,6 +17,7 @@ import {
 import { Cipher } from 'jslib-common/models/domain/cipher';
 import { CipherView } from 'jslib-common/models/view/cipherView';
 
+
 @Component({
     selector: 'app-exposed-passwords-report',
     templateUrl: '../../tools/exposed-passwords-report.component.html',
@@ -24,16 +26,19 @@ export class ExposedPasswordsReportComponent extends BaseExposedPasswordsReportC
     manageableCiphers: Cipher[];
 
     constructor(cipherService: CipherService, auditService: AuditService,
-        modalService: ModalService, messagingService: MessagingService,
+        modalService: ModalService, messagingService: MessagingService, stateService: StateService,
-        userService: UserService, passwordRepromptService: PasswordRepromptService, private route: ActivatedRoute) {
+        private organizationService: OrganizationService, private route: ActivatedRoute,
-        super(cipherService, auditService, modalService, messagingService, userService, passwordRepromptService);
+        passwordRepromptService: PasswordRepromptService) {
+        super(cipherService, auditService, modalService, messagingService, stateService, passwordRepromptService);
     }
 
     ngOnInit() {
+        const dynamicSuper = Object.getPrototypeOf(this.constructor.prototype);
         this.route.parent.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             this.manageableCiphers = await this.cipherService.getAll();
-            super.ngOnInit();
+            // TODO: We should do something about this, calling super in an async function is bad
+            dynamicSuper.ngOnInit();
         });
     }
 

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

@@ -4,14 +4,12 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { ImportService } from 'jslib-common/abstractions/import.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { ImportComponent as BaseImportComponent } from '../../tools/import.component';
 
@@ -22,11 +20,24 @@ import { ImportComponent as BaseImportComponent } from '../../tools/import.compo
 export class ImportComponent extends BaseImportComponent {
     organizationName: string;
 
-    constructor(i18nService: I18nService, toasterService: ToasterService,
+    constructor(
-        importService: ImportService, router: Router, private route: ActivatedRoute,
+        i18nService: I18nService,
-        platformUtilsService: PlatformUtilsService, policyService: PolicyService,
+        importService: ImportService,
-        private userService: UserService, logService: LogService) {
+        router: Router,
-        super(i18nService, toasterService, importService, router, platformUtilsService, policyService, logService);
+        private route: ActivatedRoute,
+        platformUtilsService: PlatformUtilsService,
+        policyService: PolicyService,
+        private organizationService: OrganizationService,
+        logService: LogService
+    ) {
+        super(
+            i18nService,
+            importService,
+            router,
+            platformUtilsService,
+            policyService,
+            logService
+        );
     }
 
     async ngOnInit() {
@@ -36,7 +47,7 @@ export class ImportComponent extends BaseImportComponent {
             await super.ngOnInit();
             this.importBlockedByPolicy = false;
         });
-        const organization = await this.userService.getOrganization(this.organizationId);
+        const organization = await this.organizationService.get(this.organizationId);
         this.organizationName = organization.name;
     }
 

src/app/organizations/tools/inactive-two-factor-report.component.ts

@@ -4,8 +4,9 @@ import { ActivatedRoute } from '@angular/router';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -15,20 +16,22 @@ import {
 
 import { CipherView } from 'jslib-common/models/view/cipherView';
 
+
 @Component({
     selector: 'app-inactive-two-factor-report',
     templateUrl: '../../tools/inactive-two-factor-report.component.html',
 })
 export class InactiveTwoFactorReportComponent extends BaseInactiveTwoFactorReportComponent {
     constructor(cipherService: CipherService, modalService: ModalService,
-        messagingService: MessagingService, userService: UserService,
+        messagingService: MessagingService, stateService: StateService,
-        private route: ActivatedRoute, logService: LogService, passwordRepromptService: PasswordRepromptService) {
+        private route: ActivatedRoute, logService: LogService, passwordRepromptService: PasswordRepromptService,
-        super(cipherService, modalService, messagingService, userService, logService, passwordRepromptService);
+        private organizationService: OrganizationService) {
+        super(cipherService, modalService, messagingService, stateService, logService, passwordRepromptService);
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             await super.ngOnInit();
         });
     }

src/app/organizations/tools/reused-passwords-report.component.ts

@@ -3,8 +3,9 @@ import { ActivatedRoute } from '@angular/router';
 
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -24,14 +25,15 @@ export class ReusedPasswordsReportComponent extends BaseReusedPasswordsReportCom
     manageableCiphers: Cipher[];
 
     constructor(cipherService: CipherService, modalService: ModalService,
-        messagingService: MessagingService, userService: UserService, passwordRepromptService: PasswordRepromptService,
+        messagingService: MessagingService, stateService: StateService,
-        private route: ActivatedRoute) {
+        private route: ActivatedRoute, private organizationService: OrganizationService,
-        super(cipherService, modalService, messagingService, userService, passwordRepromptService);
+        passwordRepromptService: PasswordRepromptService) {
+        super(cipherService, modalService, messagingService, stateService, passwordRepromptService);
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             this.manageableCiphers = await this.cipherService.getAll();
             await super.ngOnInit();
         });

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

@@ -4,7 +4,7 @@ import { ActivatedRoute } from '@angular/router';
 import { Organization } from 'jslib-common/models/domain/organization';
 
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 @Component({
     selector: 'app-org-tools',
@@ -15,12 +15,12 @@ export class ToolsComponent {
     accessReports = false;
     loading = true;
 
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(private route: ActivatedRoute, private organizationService: OrganizationService,
         private messagingService: MessagingService) { }
 
     ngOnInit() {
         this.route.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             // TODO: Maybe we want to just make sure they are not on a free plan? Just compare useTotp for now
             // since all paid plans include useTotp
             this.accessReports = this.organization.useTotp;

src/app/organizations/tools/unsecured-websites-report.component.ts

@@ -3,8 +3,9 @@ import { ActivatedRoute } from '@angular/router';
 
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -20,14 +21,15 @@ import { CipherView } from 'jslib-common/models/view/cipherView';
 })
 export class UnsecuredWebsitesReportComponent extends BaseUnsecuredWebsitesReportComponent {
     constructor(cipherService: CipherService, modalService: ModalService,
-        messagingService: MessagingService, userService: UserService, passwordRepromptService: PasswordRepromptService,
+        messagingService: MessagingService, stateService: StateService,
-        private route: ActivatedRoute) {
+        private route: ActivatedRoute, private organizationService: OrganizationService,
-        super(cipherService, modalService, messagingService, userService, passwordRepromptService);
+        passwordRepromptService: PasswordRepromptService) {
+        super(cipherService, modalService, messagingService, stateService, passwordRepromptService);
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             await super.ngOnInit();
         });
     }

src/app/organizations/tools/weak-passwords-report.component.ts

@@ -3,9 +3,10 @@ import { ActivatedRoute } from '@angular/router';
 
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -26,14 +27,14 @@ export class WeakPasswordsReportComponent extends BaseWeakPasswordsReportCompone
 
     constructor(cipherService: CipherService, passwordGenerationService: PasswordGenerationService,
         modalService: ModalService, messagingService: MessagingService,
-        userService: UserService, passwordRepromptService: PasswordRepromptService, private route: ActivatedRoute) {
+        stateService: StateService, private route: ActivatedRoute,
-        super(cipherService, passwordGenerationService, modalService, messagingService, userService,
+        private organizationService: OrganizationService, passwordRepromptService: PasswordRepromptService) {
-            passwordRepromptService);
+        super(cipherService, passwordGenerationService, modalService, messagingService, stateService, passwordRepromptService);
     }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             this.manageableCiphers = await this.cipherService.getAll();
             await super.ngOnInit();
         });

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

@@ -9,13 +9,13 @@ import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { StateService } from 'jslib-common/abstractions/state.service';
 import { TotpService } from 'jslib-common/abstractions/totp.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { CipherData } from 'jslib-common/models/data/cipherData';
 import { Cipher } from 'jslib-common/models/domain/cipher';
@@ -36,14 +36,14 @@ export class AddEditComponent extends BaseAddEditComponent {
     constructor(cipherService: CipherService, folderService: FolderService,
         i18nService: I18nService, platformUtilsService: PlatformUtilsService,
         auditService: AuditService, stateService: StateService,
-        userService: UserService, collectionService: CollectionService,
+        collectionService: CollectionService, totpService: TotpService,
-        totpService: TotpService, passwordGenerationService: PasswordGenerationService,
+        passwordGenerationService: PasswordGenerationService, private apiService: ApiService,
-        private apiService: ApiService, messagingService: MessagingService,
+        messagingService: MessagingService, eventService: EventService,
-        eventService: EventService, policyService: PolicyService, logService: LogService,
+        policyService: PolicyService, logService: LogService,
-        passwordRepromptService: PasswordRepromptService) {
+        passwordRepromptService: PasswordRepromptService, organizationService: OrganizationService) {
         super(cipherService, folderService, i18nService, platformUtilsService, auditService, stateService,
-            userService, collectionService, totpService, passwordGenerationService, messagingService,
+            collectionService, totpService, passwordGenerationService, messagingService,
-            eventService, policyService, passwordRepromptService, logService);
+            eventService, policyService, organizationService, logService, passwordRepromptService);
     }
 
     protected allowOwnershipAssignment() {

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

@@ -6,7 +6,7 @@ import { CryptoService } from 'jslib-common/abstractions/crypto.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { CipherData } from 'jslib-common/models/data/cipherData';
 import { Cipher } from 'jslib-common/models/domain/cipher';
@@ -25,11 +25,9 @@ export class AttachmentsComponent extends BaseAttachmentsComponent {
     organization: Organization;
 
     constructor(cipherService: CipherService, i18nService: I18nService,
-        cryptoService: CryptoService, userService: UserService,
+        cryptoService: CryptoService, stateService: StateService,
-        platformUtilsService: PlatformUtilsService, apiService: ApiService,
+        platformUtilsService: PlatformUtilsService, apiService: ApiService, logService: LogService) {
-        logService: LogService) {
+        super(cipherService, i18nService, cryptoService, stateService, platformUtilsService, apiService, logService);
-        super(cipherService, i18nService, cryptoService, userService, platformUtilsService, apiService,
-            logService);
     }
 
     protected async reupload(attachment: AttachmentView) {

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

@@ -4,8 +4,6 @@ import {
     Output,
 } from '@angular/core';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { EventService } from 'jslib-common/abstractions/event.service';
@@ -14,10 +12,11 @@ import { LogService } from 'jslib-common/abstractions/log.service';
 import { PasswordRepromptService } from 'jslib-common/abstractions/passwordReprompt.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 import { TotpService } from 'jslib-common/abstractions/totp.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
+
 import { CipherView } from 'jslib-common/models/view/cipherView';
 
 import { CiphersComponent as BaseCiphersComponent } from '../../vault/ciphers.component';
@@ -34,13 +33,29 @@ export class CiphersComponent extends BaseCiphersComponent {
 
     protected allCiphers: CipherView[] = [];
 
-    constructor(searchService: SearchService, toasterService: ToasterService, i18nService: I18nService,
+    constructor(
-        platformUtilsService: PlatformUtilsService, cipherService: CipherService,
+        searchService: SearchService,
-        private apiService: ApiService, eventService: EventService, totpService: TotpService,
+        i18nService: I18nService,
-        userService: UserService, passwordRepromptService: PasswordRepromptService,
+        platformUtilsService: PlatformUtilsService,
-        logService: LogService) {
+        cipherService: CipherService,
-        super(searchService, toasterService, i18nService, platformUtilsService, cipherService,
+        private apiService: ApiService,
-            eventService, totpService, userService, passwordRepromptService, logService);
+        eventService: EventService,
+        totpService: TotpService,
+        passwordRepromptService: PasswordRepromptService,
+        logService: LogService,
+        stateService: StateService,
+    ) {
+        super(
+            searchService,
+            i18nService,
+            platformUtilsService,
+            cipherService,
+            eventService,
+            totpService,
+            stateService,
+            passwordRepromptService,
+            logService
+        );
     }
 
     async load(filter: (cipher: CipherView) => boolean = null) {

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

@@ -4,8 +4,7 @@ import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
-import { StorageService } from 'jslib-common/abstractions/storage.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
 import { CollectionData } from 'jslib-common/models/data/collectionData';
 import { Collection } from 'jslib-common/models/domain/collection';
@@ -23,9 +22,9 @@ export class GroupingsComponent extends BaseGroupingsComponent {
     organization: Organization;
 
     constructor(collectionService: CollectionService, folderService: FolderService,
-        storageService: StorageService, userService: UserService,
+        stateService: StateService, private apiService: ApiService,
-        private apiService: ApiService, private i18nService: I18nService) {
+        private i18nService: I18nService) {
-        super(collectionService, folderService, storageService, userService);
+        super(collectionService, folderService, stateService);
     }
 
     async loadCollections() {
@@ -52,8 +51,8 @@ export class GroupingsComponent extends BaseGroupingsComponent {
         this.nestedCollections = await this.collectionService.getAllNested(this.collections);
     }
 
-    collapse(grouping: CollectionView) {
+    async collapse(grouping: CollectionView) {
-        super.collapse(grouping, 'org_');
+        await super.collapse(grouping, 'org_');
     }
 
     isCollapsed(grouping: CollectionView) {

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

@@ -14,13 +14,13 @@ import {
 
 import { first } from 'rxjs/operators';
 
+import { BroadcasterService } from 'jslib-common/abstractions/broadcaster.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { SyncService } from 'jslib-common/abstractions/sync.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
-import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';
 import { ModalService } from 'jslib-angular/services/modal.service';
 
 import { Organization } from 'jslib-common/models/domain/organization';
@@ -55,7 +55,7 @@ export class VaultComponent implements OnInit, OnDestroy {
     deleted: boolean = false;
     trashCleanupWarning: string = null;
 
-    constructor(private route: ActivatedRoute, private userService: UserService,
+    constructor(private route: ActivatedRoute, private organizationService: OrganizationService,
         private router: Router, private changeDetectorRef: ChangeDetectorRef,
         private syncService: SyncService, private i18nService: I18nService,
         private modalService: ModalService, private messagingService: MessagingService,
@@ -66,9 +66,8 @@ export class VaultComponent implements OnInit, OnDestroy {
         this.trashCleanupWarning = this.i18nService.t(
             this.platformUtilsService.isSelfHost() ? 'trashCleanupWarningSelfHosted' : 'trashCleanupWarning'
         );
-
         this.route.parent.params.pipe(first()).subscribe(async params => {
-            this.organization = await this.userService.getOrganization(params.organizationId);
+            this.organization = await this.organizationService.get(params.organizationId);
             this.groupingsComponent.organization = this.organization;
             this.ciphersComponent.organization = this.organization;
 

src/app/oss.module.ts

@@ -7,9 +7,8 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
-
-import { ToasterModule } from 'angular2-toaster';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
+import { ToastrModule } from 'ngx-toastr';
 
 import { NestedCheckboxComponent } from './components/nested-checkbox.component';
 import { PasswordRepromptComponent } from './components/password-reprompt.component';
@@ -181,6 +180,7 @@ import { ProvidersComponent } from './providers/providers.component';
 import { AvatarComponent } from 'jslib-angular/components/avatar.component';
 import { CalloutComponent } from 'jslib-angular/components/callout.component';
 import { IconComponent } from 'jslib-angular/components/icon.component';
+import { BitwardenToast } from 'jslib-angular/components/toastr.component';
 import { VerifyMasterPasswordComponent } from 'jslib-angular/components/verify-master-password.component';
 
 import { A11yTitleDirective } from 'jslib-angular/directives/a11y-title.directive';
@@ -295,7 +295,7 @@ registerLocaleData(localeZhTw, 'zh-TW');
         FormsModule,
         InfiniteScrollModule,
         DragDropModule,
-        ToasterModule.forChild(),
+        ToastrModule,
         ReactiveFormsModule,
         RouterModule,
     ],

src/app/providers/providers.component.ts

@@ -5,7 +5,7 @@ import {
 } from '@angular/core';
 
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { ProviderService } from 'jslib-common/abstractions/provider.service';
 
 import { Provider } from 'jslib-common/models/domain/provider';
 
@@ -22,7 +22,7 @@ export class ProvidersComponent implements OnInit {
     loaded: boolean = false;
     actionPromise: Promise<any>;
 
-    constructor(private userService: UserService, private i18nService: I18nService) { }
+    constructor(private providerService: ProviderService, private i18nService: I18nService) { }
 
     async ngOnInit() {
         document.body.classList.remove('layout_frontend');
@@ -30,7 +30,7 @@ export class ProvidersComponent implements OnInit {
     }
 
     async load() {
-        const providers = await this.userService.getAllProviders();
+        const providers = await this.providerService.getAll();
         providers.sort(Utils.getSortFunction(this.i18nService, 'name'));
         this.providers = providers;
         this.loaded = true;

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

@@ -4,14 +4,14 @@ import { Component } from '@angular/core';
 
 import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
+import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { SendService } from 'jslib-common/abstractions/send.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { AddEditComponent as BaseAddEditComponent } from 'jslib-angular/components/send/add-edit.component';
-import { LogService } from 'jslib-common/abstractions/log.service';
 
 @Component({
     selector: 'app-send-add-edit',
@@ -20,11 +20,11 @@ import { LogService } from 'jslib-common/abstractions/log.service';
 export class AddEditComponent extends BaseAddEditComponent {
     constructor(i18nService: I18nService, platformUtilsService: PlatformUtilsService,
         environmentService: EnvironmentService, datePipe: DatePipe,
-        sendService: SendService, userService: UserService,
+        sendService: SendService, stateService: StateService,
         messagingService: MessagingService, policyService: PolicyService,
         logService: LogService) {
-        super(i18nService, platformUtilsService, environmentService, datePipe, sendService, userService,
+        super(i18nService, platformUtilsService, environmentService, datePipe, sendService,
-            messagingService, policyService, logService);
+            messagingService, policyService, logService, stateService);
     }
 
     async copyLinkToClipboard(link: string): Promise<void | boolean> {

src/app/send/send.component.ts

@@ -11,6 +11,7 @@ import { SendComponent as BaseSendComponent } from 'jslib-angular/components/sen
 
 import { AddEditComponent } from './add-edit.component';
 
+import { BroadcasterService } from 'jslib-common/abstractions/broadcaster.service';
 import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
@@ -18,9 +19,7 @@ import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.se
 import { PolicyService } from 'jslib-common/abstractions/policy.service';
 import { SearchService } from 'jslib-common/abstractions/search.service';
 import { SendService } from 'jslib-common/abstractions/send.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
 
-import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';
 import { ModalService } from 'jslib-angular/services/modal.service';
 
 const BroadcasterSubscriptionId = 'SendComponent';
@@ -34,11 +33,11 @@ export class SendComponent extends BaseSendComponent {
 
     constructor(sendService: SendService, i18nService: I18nService,
         platformUtilsService: PlatformUtilsService, environmentService: EnvironmentService,
-        ngZone: NgZone, searchService: SearchService, policyService: PolicyService, userService: UserService,
+        ngZone: NgZone, searchService: SearchService,
-        private modalService: ModalService, private broadcasterService: BroadcasterService,
+        policyService: PolicyService, private modalService: ModalService,
-        logService: LogService) {
+        private broadcasterService: BroadcasterService, logService: LogService) {
         super(sendService, i18nService, platformUtilsService, environmentService, ngZone, searchService,
-            policyService, userService, logService);
+            policyService, logService);
     }
 
     async ngOnInit() {

src/app/services/organization-guard.service.ts

@@ -5,24 +5,27 @@ import {
     Router,
 } from '@angular/router';
 
-import { ToasterService } from 'angular2-toaster';
-
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
+import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
 
 @Injectable()
 export class OrganizationGuardService implements CanActivate {
-    constructor(private userService: UserService, private router: Router,
+    constructor(
-        private toasterService: ToasterService, private i18nService: I18nService) { }
+        private router: Router,
+        private platformUtilsService: PlatformUtilsService,
+        private i18nService: I18nService,
+        private organizationService: OrganizationService,
+    ) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
-        const org = await this.userService.getOrganization(route.params.organizationId);
+        const org = await this.organizationService.get(route.params.organizationId);
         if (org == null) {
             this.router.navigate(['/']);
             return false;
         }
         if (!org.isOwner && !org.enabled) {
-            this.toasterService.popAsync('error', null, this.i18nService.t('organizationIsDisabled'));
+            this.platformUtilsService.showToast('error', null, this.i18nService.t('organizationIsDisabled'));
             this.router.navigate(['/']);
             return false;
         }

src/app/services/organization-type-guard.service.ts

@@ -5,16 +5,16 @@ import {
     Router,
 } from '@angular/router';
 
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { OrganizationService } from 'jslib-common/abstractions/organization.service';
 
 import { Permissions } from 'jslib-common/enums/permissions';
 
 @Injectable()
 export class OrganizationTypeGuardService implements CanActivate {
-    constructor(private userService: UserService, private router: Router) { }
+    constructor(private organizationService: OrganizationService, private router: Router) { }
 
     async canActivate(route: ActivatedRouteSnapshot) {
-        const org = await this.userService.getOrganization(route.params.organizationId);
+        const org = await this.organizationService.get(route.params.organizationId);
         const permissions = route.data == null ? null : route.data.permissions as Permissions[];
 
         if (

src/app/services/services.module.ts

@@ -1,65 +1,34 @@
 import {
     APP_INITIALIZER,
-    LOCALE_ID,
+    Injector,
     NgModule,
 } from '@angular/core';
-
+import { ToastrModule } from 'ngx-toastr';
-import { ToasterModule } from 'angular2-toaster';
 
 import { BroadcasterMessagingService } from '../../services/broadcasterMessaging.service';
 import { HtmlStorageService } from '../../services/htmlStorage.service';
 import { I18nService } from '../../services/i18n.service';
 import { MemoryStorageService } from '../../services/memoryStorage.service';
-import { PasswordRepromptService } from '../../services/passwordReprompt.service';
 import { WebPlatformUtilsService } from '../../services/webPlatformUtils.service';
 
 import { EventService } from './event.service';
+import { ModalService } from './modal.service';
 import { OrganizationGuardService } from './organization-guard.service';
 import { OrganizationTypeGuardService } from './organization-type-guard.service';
 import { PolicyListService } from './policy-list.service';
 import { RouterService } from './router.service';
 
-import { AuthGuardService } from 'jslib-angular/services/auth-guard.service';
+import { JslibServicesModule } from 'jslib-angular/services/jslib-services.module';
-import { BroadcasterService } from 'jslib-angular/services/broadcaster.service';
-import { LockGuardService } from 'jslib-angular/services/lock-guard.service';
 import { ModalService as ModalServiceAbstraction } from 'jslib-angular/services/modal.service';
-import { UnauthGuardService } from 'jslib-angular/services/unauth-guard.service';
-import { ValidationService } from 'jslib-angular/services/validation.service';
 
-import { ApiService } from 'jslib-common/services/api.service';
-import { AppIdService } from 'jslib-common/services/appId.service';
-import { AuditService } from 'jslib-common/services/audit.service';
 import { AuthService } from 'jslib-common/services/auth.service';
-import { CipherService } from 'jslib-common/services/cipher.service';
-import { CollectionService } from 'jslib-common/services/collection.service';
-import { ConsoleLogService } from 'jslib-common/services/consoleLog.service';
-import { ConstantsService } from 'jslib-common/services/constants.service';
 import { ContainerService } from 'jslib-common/services/container.service';
 import { CryptoService } from 'jslib-common/services/crypto.service';
-import { EnvironmentService } from 'jslib-common/services/environment.service';
 import { EventService as EventLoggingService } from 'jslib-common/services/event.service';
-import { ExportService } from 'jslib-common/services/export.service';
-import { FileUploadService } from 'jslib-common/services/fileUpload.service';
-import { FolderService } from 'jslib-common/services/folder.service';
 import { ImportService } from 'jslib-common/services/import.service';
-import { KeyConnectorService } from 'jslib-common/services/keyConnector.service';
-import { NotificationsService } from 'jslib-common/services/notifications.service';
-import { PasswordGenerationService } from 'jslib-common/services/passwordGeneration.service';
-import { PolicyService } from 'jslib-common/services/policy.service';
-import { SearchService } from 'jslib-common/services/search.service';
-import { SendService } from 'jslib-common/services/send.service';
-import { SettingsService } from 'jslib-common/services/settings.service';
-import { StateService } from 'jslib-common/services/state.service';
-import { SyncService } from 'jslib-common/services/sync.service';
-import { TokenService } from 'jslib-common/services/token.service';
-import { TotpService } from 'jslib-common/services/totp.service';
-import { UserService } from 'jslib-common/services/user.service';
-import { UserVerificationService } from 'jslib-common/services/userVerification.service';
 import { VaultTimeoutService } from 'jslib-common/services/vaultTimeout.service';
-import { WebCryptoFunctionService } from 'jslib-common/services/webCryptoFunction.service';
 
 import { ApiService as ApiServiceAbstraction } from 'jslib-common/abstractions/api.service';
-import { AuditService as AuditServiceAbstraction } from 'jslib-common/abstractions/audit.service';
 import { AuthService as AuthServiceAbstraction } from 'jslib-common/abstractions/auth.service';
 import { CipherService as CipherServiceAbstraction } from 'jslib-common/abstractions/cipher.service';
 import { CollectionService as CollectionServiceAbstraction } from 'jslib-common/abstractions/collection.service';
@@ -67,96 +36,27 @@ import { CryptoService as CryptoServiceAbstraction } from 'jslib-common/abstract
 import { CryptoFunctionService as CryptoFunctionServiceAbstraction } from 'jslib-common/abstractions/cryptoFunction.service';
 import { EnvironmentService as EnvironmentServiceAbstraction, Urls } from 'jslib-common/abstractions/environment.service';
 import { EventService as EventLoggingServiceAbstraction } from 'jslib-common/abstractions/event.service';
-import { ExportService as ExportServiceAbstraction } from 'jslib-common/abstractions/export.service';
-import { FileUploadService as FileUploadServiceAbstraction }  from 'jslib-common/abstractions/fileUpload.service';
 import { FolderService as FolderServiceAbstraction } from 'jslib-common/abstractions/folder.service';
 import { I18nService as I18nServiceAbstraction } from 'jslib-common/abstractions/i18n.service';
 import { ImportService as ImportServiceAbstraction } from 'jslib-common/abstractions/import.service';
-import { KeyConnectorService as KeyConnectorServiceAbstraction } from 'jslib-common/abstractions/keyConnector.service';
 import { LogService } from 'jslib-common/abstractions/log.service';
 import { MessagingService as MessagingServiceAbstraction } from 'jslib-common/abstractions/messaging.service';
 import { NotificationsService as NotificationsServiceAbstraction } from 'jslib-common/abstractions/notifications.service';
-import {
-    PasswordGenerationService as PasswordGenerationServiceAbstraction,
-} from 'jslib-common/abstractions/passwordGeneration.service';
-import { PasswordRepromptService as PasswordRepromptServiceAbstraction } from 'jslib-common/abstractions/passwordReprompt.service';
 import { PlatformUtilsService as PlatformUtilsServiceAbstraction } from 'jslib-common/abstractions/platformUtils.service';
-import { PolicyService as PolicyServiceAbstraction } from 'jslib-common/abstractions/policy.service';
-import { SearchService as SearchServiceAbstraction } from 'jslib-common/abstractions/search.service';
-import { SendService as SendServiceAbstraction } from 'jslib-common/abstractions/send.service';
-import { SettingsService as SettingsServiceAbstraction } from 'jslib-common/abstractions/settings.service';
 import { StateService as StateServiceAbstraction } from 'jslib-common/abstractions/state.service';
 import { StorageService as StorageServiceAbstraction } from 'jslib-common/abstractions/storage.service';
-import { SyncService as SyncServiceAbstraction } from 'jslib-common/abstractions/sync.service';
-import { TokenService as TokenServiceAbstraction } from 'jslib-common/abstractions/token.service';
-import { TotpService as TotpServiceAbstraction } from 'jslib-common/abstractions/totp.service';
-import { UserService as UserServiceAbstraction } from 'jslib-common/abstractions/user.service';
-import { UserVerificationService as UserVerificationServiceAbstraction } from 'jslib-common/abstractions/userVerification.service';
 import { VaultTimeoutService as VaultTimeoutServiceAbstraction } from 'jslib-common/abstractions/vaultTimeout.service';
-import { ModalService } from './modal.service';
 
 import { ThemeType } from 'jslib-common/enums/themeType';
 
-const i18nService = new I18nService(window.navigator.language, 'locales');
+export function initFactory(window: Window, storageService: StorageServiceAbstraction,
-const stateService = new StateService();
+    environmentService: EnvironmentServiceAbstraction, notificationsService: NotificationsServiceAbstraction,
-const broadcasterService = new BroadcasterService();
+    vaultTimeoutService: VaultTimeoutService, i18nService: I18nService, eventLoggingService: EventLoggingService,
-const messagingService = new BroadcasterMessagingService(broadcasterService);
+    authService: AuthService, stateService: StateServiceAbstraction,
-const consoleLogService = new ConsoleLogService(false);
+    platformUtilsService: PlatformUtilsServiceAbstraction, cryptoService: CryptoServiceAbstraction): Function {
-const platformUtilsService = new WebPlatformUtilsService(i18nService, messagingService, consoleLogService, () => storageService);
-const storageService: StorageServiceAbstraction = new HtmlStorageService(platformUtilsService);
-const secureStorageService: StorageServiceAbstraction = new MemoryStorageService();
-const cryptoFunctionService: CryptoFunctionServiceAbstraction = new WebCryptoFunctionService(window,
-    platformUtilsService);
-const cryptoService = new CryptoService(storageService,
-    platformUtilsService.isDev() ? storageService : secureStorageService, cryptoFunctionService, platformUtilsService,
-    consoleLogService);
-const tokenService = new TokenService(storageService);
-const appIdService = new AppIdService(storageService);
-const environmentService = new EnvironmentService(storageService);
-const apiService = new ApiService(tokenService, platformUtilsService, environmentService,
-    async (expired: boolean) => messagingService.send('logout', { expired: expired }));
-const userService = new UserService(tokenService, storageService);
-const settingsService = new SettingsService(userService, storageService);
-export let searchService: SearchService = null;
-const fileUploadService = new FileUploadService(consoleLogService, apiService);
-const cipherService = new CipherService(cryptoService, userService, settingsService,
-    apiService, fileUploadService, storageService, i18nService, () => searchService, consoleLogService);
-const folderService = new FolderService(cryptoService, userService, apiService, storageService,
-    i18nService, cipherService);
-const collectionService = new CollectionService(cryptoService, userService, storageService, i18nService);
-searchService = new SearchService(cipherService, consoleLogService, i18nService);
-const policyService = new PolicyService(userService, storageService, apiService);
-const sendService = new SendService(cryptoService, userService, apiService, fileUploadService, storageService,
-    i18nService, cryptoFunctionService);
-const keyConnectorService = new KeyConnectorService(storageService, userService, cryptoService, apiService,
-    tokenService, consoleLogService);
-const vaultTimeoutService = new VaultTimeoutService(cipherService, folderService, collectionService,
-    cryptoService, platformUtilsService, storageService, messagingService, searchService, userService, tokenService,
-    policyService, keyConnectorService, null, async () => messagingService.send('logout', { expired: false }));
-const syncService = new SyncService(userService, apiService, settingsService,
-    folderService, cipherService, cryptoService, collectionService, storageService, messagingService, policyService,
-    sendService, consoleLogService, tokenService, keyConnectorService,
-    async (expired: boolean) => messagingService.send('logout', { expired: expired }));
-const passwordGenerationService = new PasswordGenerationService(cryptoService, storageService, policyService);
-const totpService = new TotpService(storageService, cryptoFunctionService, consoleLogService);
-const containerService = new ContainerService(cryptoService);
-const authService = new AuthService(cryptoService, apiService,
-    userService, tokenService, appIdService, i18nService, platformUtilsService, messagingService, vaultTimeoutService,
-    consoleLogService, cryptoFunctionService, environmentService, keyConnectorService);
-const exportService = new ExportService(folderService, cipherService, apiService, cryptoService);
-const importService = new ImportService(cipherService, folderService, apiService, i18nService, collectionService,
-    platformUtilsService, cryptoService);
-const notificationsService = new NotificationsService(userService, syncService, appIdService, apiService, vaultTimeoutService,
-    environmentService, async () => messagingService.send('logout', { expired: true }), consoleLogService);
-const auditService = new AuditService(cryptoFunctionService, apiService);
-const eventLoggingService = new EventLoggingService(storageService, apiService, userService, cipherService, consoleLogService);
-const userVerificationService = new UserVerificationService(cryptoService, i18nService, apiService);
-
-containerService.attachToWindow(window);
-
-export function initFactory(): Function {
     return async () => {
         await (storageService as HtmlStorageService).init();
+        await stateService.init();
 
         const urls = process.env.URLS as Urls;
         urls.base ??= window.location.origin;
@@ -165,7 +65,7 @@ export function initFactory(): Function {
         setTimeout(() => notificationsService.init(), 3000);
 
         vaultTimeoutService.init(true);
-        const locale = await storageService.get<string>(ConstantsService.localeKey);
+        const locale = await stateService.getLocale();
         await i18nService.init(locale);
         eventLoggingService.init(true);
         authService.init();
@@ -174,80 +74,91 @@ export function initFactory(): Function {
 
         // Initial theme is set in index.html which must be updated if there are any changes to theming logic
         platformUtilsService.onDefaultSystemThemeChange(async sysTheme => {
-            const bwTheme = await storageService.get<ThemeType>(ConstantsService.themeKey);
+            const bwTheme = await stateService.getTheme();
             if (bwTheme === ThemeType.System) {
                 htmlEl.classList.remove('theme_' + ThemeType.Light, 'theme_' + ThemeType.Dark);
                 htmlEl.classList.add('theme_' + sysTheme);
             }
         });
 
-        stateService.save(ConstantsService.disableFaviconKey,
+        const containerService = new ContainerService(cryptoService);
-            await storageService.get<boolean>(ConstantsService.disableFaviconKey));
+        containerService.attachToWindow(window);
-        stateService.save('enableGravatars', await storageService.get<boolean>('enableGravatars'));
     };
 }
 
 @NgModule({
     imports: [
-        ToasterModule,
+        ToastrModule,
+        JslibServicesModule,
     ],
     declarations: [],
     providers: [
-        ValidationService,
-        AuthGuardService,
-        OrganizationGuardService,
-        OrganizationTypeGuardService,
-        UnauthGuardService,
-        RouterService,
-        EventService,
-        LockGuardService,
-        PolicyListService,
-        { provide: ModalServiceAbstraction, useClass: ModalService },
-        { provide: AuditServiceAbstraction, useValue: auditService },
-        { provide: AuthServiceAbstraction, useValue: authService },
-        { provide: CipherServiceAbstraction, useValue: cipherService },
-        { provide: FolderServiceAbstraction, useValue: folderService },
-        { provide: LogService, useValue: consoleLogService },
-        { provide: CollectionServiceAbstraction, useValue: collectionService },
-        { provide: EnvironmentServiceAbstraction, useValue: environmentService },
-        { provide: TotpServiceAbstraction, useValue: totpService },
-        { provide: TokenServiceAbstraction, useValue: tokenService },
-        { provide: I18nServiceAbstraction, useValue: i18nService },
-        { provide: CryptoServiceAbstraction, useValue: cryptoService },
-        { provide: PlatformUtilsServiceAbstraction, useValue: platformUtilsService },
-        { provide: PasswordGenerationServiceAbstraction, useValue: passwordGenerationService },
-        { provide: ApiServiceAbstraction, useValue: apiService },
-        { provide: FileUploadServiceAbstraction, useValue: fileUploadService },
-        { provide: SyncServiceAbstraction, useValue: syncService },
-        { provide: UserServiceAbstraction, useValue: userService },
-        { provide: MessagingServiceAbstraction, useValue: messagingService },
-        { provide: BroadcasterService, useValue: broadcasterService },
-        { provide: SettingsServiceAbstraction, useValue: settingsService },
-        { provide: VaultTimeoutServiceAbstraction, useValue: vaultTimeoutService },
-        { provide: StorageServiceAbstraction, useValue: storageService },
-        { provide: StateServiceAbstraction, useValue: stateService },
-        { provide: ExportServiceAbstraction, useValue: exportService },
-        { provide: SearchServiceAbstraction, useValue: searchService },
-        { provide: ImportServiceAbstraction, useValue: importService },
-        { provide: NotificationsServiceAbstraction, useValue: notificationsService },
-        { provide: CryptoFunctionServiceAbstraction, useValue: cryptoFunctionService },
-        { provide: EventLoggingServiceAbstraction, useValue: eventLoggingService },
-        { provide: PolicyServiceAbstraction, useValue: policyService },
-        { provide: SendServiceAbstraction, useValue: sendService },
-        { provide: KeyConnectorServiceAbstraction, useValue: keyConnectorService },
-        { provide: UserVerificationServiceAbstraction, useValue: userVerificationService },
-        { provide: PasswordRepromptServiceAbstraction, useClass: PasswordRepromptService },
-        { provide: LogService, useValue: consoleLogService },
         {
             provide: APP_INITIALIZER,
             useFactory: initFactory,
-            deps: [],
+            deps: [
+                'WINDOW',
+                StorageServiceAbstraction,
+                EnvironmentServiceAbstraction,
+                NotificationsServiceAbstraction,
+                VaultTimeoutServiceAbstraction,
+                I18nServiceAbstraction,
+                EventLoggingServiceAbstraction,
+                AuthServiceAbstraction,
+                StateServiceAbstraction,
+                PlatformUtilsServiceAbstraction,
+                CryptoServiceAbstraction,
+            ],
             multi: true,
         },
+        OrganizationGuardService,
+        OrganizationTypeGuardService,
+        RouterService,
+        EventService,
+        PolicyListService,
         {
-            provide: LOCALE_ID,
+            provide: I18nServiceAbstraction,
-            useFactory: () => i18nService.translationLocale,
+            useFactory: (window: Window) => new I18nService(window.navigator.language, 'locales'),
-            deps: [],
+            deps: [ 'WINDOW' ],
+        },
+        { provide: StorageServiceAbstraction, useClass: HtmlStorageService },
+        { provide: 'SECURE_STORAGE', useClass: MemoryStorageService },
+        {
+            provide: PlatformUtilsServiceAbstraction,
+            useFactory: (i18nService: I18nServiceAbstraction, messagingService: MessagingServiceAbstraction,
+                logService: LogService, stateService: StateServiceAbstraction) => new WebPlatformUtilsService(i18nService,
+                    messagingService, logService, stateService),
+            deps: [
+                I18nServiceAbstraction,
+                MessagingServiceAbstraction,
+                LogService,
+                StateServiceAbstraction,
+            ],
+        },
+        { provide: MessagingServiceAbstraction, useClass: BroadcasterMessagingService },
+        { provide: ModalServiceAbstraction, useClass: ModalService },
+        {
+            provide: ImportServiceAbstraction,
+            useClass: ImportService,
+            deps: [
+                CipherServiceAbstraction,
+                FolderServiceAbstraction,
+                ApiServiceAbstraction,
+                I18nServiceAbstraction,
+                CollectionServiceAbstraction,
+                PlatformUtilsServiceAbstraction,
+                CryptoServiceAbstraction,
+            ],
+        },
+        {
+            provide: CryptoServiceAbstraction,
+            useClass: CryptoService,
+            deps: [
+                CryptoFunctionServiceAbstraction,
+                PlatformUtilsServiceAbstraction,
+                LogService,
+                StateServiceAbstraction,
+            ],
         },
     ],
 })

src/app/settings/account.component.ts

@@ -11,7 +11,7 @@ import { PurgeVaultComponent } from './purge-vault.component';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { KeyConnectorService } from 'jslib-common/abstractions/keyConnector.service';
-import { UserService } from 'jslib-common/abstractions/user.service';
+import { StateService } from 'jslib-common/abstractions/state.service';
 
 import { ModalService } from 'jslib-angular/services/modal.service';
 
@@ -31,7 +31,7 @@ export class AccountComponent {
     showChangeEmail = true;
 
     constructor(private modalService: ModalService, private apiService: ApiService,
-        private userService: UserService, private keyConnectorService: KeyConnectorService) { }
+        private keyConnectorService: KeyConnectorService, private stateService: StateService) { }
 
     async ngOnInit() {
         this.showChangeEmail = this.showChangeKdf = this.showChangePassword =
@@ -51,7 +51,7 @@ export class AccountComponent {
     }
 
     async viewUserApiKey() {
-        const entityId = await this.userService.getUserId();
+        const entityId = await this.stateService.getUserId();
         await this.modalService.openViewRef(ApiKeyComponent, this.viewUserApiKeyModalRef, comp => {
             comp.keyType = 'user';
             comp.entityId = entityId;
@@ -65,7 +65,7 @@ export class AccountComponent {
     }
 
     async rotateUserApiKey() {
-        const entityId = await this.userService.getUserId();
+        const entityId = await this.stateService.getUserId();
         await this.modalService.openViewRef(ApiKeyComponent, this.rotateUserApiKeyModalRef, comp => {
             comp.keyType = 'user';
             comp.isRotation = true;