Fix CryptoFunctionService and implement syncLoading (#1371)

* Fix things and implement syncLoading

* feedback

jslib

@@ -1 +1 @@
-Subproject commit e55528e61737635e7f8970b913bcc3f10bede85d
+Subproject commit 700e945008edb38543d619e9dd4543908c057f5c

src/popup/accounts/set-password.component.html

@@ -14,6 +14,10 @@
         </div>
     </header>
     <content>
+        <div class="full-loading-spinner" *ngIf="syncLoading">
+            <i class="fa fa-spinner fa-spin fa-3x" aria-hidden="true"></i>
+        </div>
+        <div *ngIf="!syncLoading">
             <div class="box">
                 <app-callout type="tip">{{'ssoCompleteRegistration' | i18n}}</app-callout>
                 <app-callout type="info" *ngIf="enforcedPolicyOptions">
@@ -28,7 +32,8 @@
                         <li *ngIf="enforcedPolicyOptions?.requireUpper">{{'policyInEffectUppercase' | i18n}}</li>
                         <li *ngIf="enforcedPolicyOptions?.requireLower">{{'policyInEffectLowercase' | i18n}}</li>
                         <li *ngIf="enforcedPolicyOptions?.requireNumbers">{{'policyInEffectNumbers' | i18n}}</li>
-                    <li *ngIf="enforcedPolicyOptions?.requireSpecial">{{'policyInEffectSpecial' | i18n : '!@#$%^&*'}}
+                        <li *ngIf="enforcedPolicyOptions?.requireSpecial">
+                            {{'policyInEffectSpecial' | i18n : '!@#$%^&*'}}
                         </li>
                     </ul>
                 </app-callout>
@@ -101,5 +106,6 @@
                     {{'masterPassHintDesc' | i18n}}
                 </div>
             </div>
+        </div>
     </content>
 </form>

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

@@ -9,6 +9,7 @@ import { MessagingService } from 'jslib/abstractions/messaging.service';
 import { PasswordGenerationService } from 'jslib/abstractions/passwordGeneration.service';
 import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
 import { PolicyService } from 'jslib/abstractions/policy.service';
+import { SyncService } from 'jslib/abstractions/sync.service';
 import { UserService } from 'jslib/abstractions/user.service';
 
 import {
@@ -23,9 +24,10 @@ export class SetPasswordComponent extends BaseSetPasswordComponent {
     constructor(apiService: ApiService, i18nService: I18nService,
         cryptoService: CryptoService, messagingService: MessagingService,
         userService: UserService, passwordGenerationService: PasswordGenerationService,
-        platformUtilsService: PlatformUtilsService, policyService: PolicyService, router: Router) {
+        platformUtilsService: PlatformUtilsService, policyService: PolicyService, router: Router,
+        syncService: SyncService) {
         super(i18nService, cryptoService, messagingService, userService, passwordGenerationService,
-            platformUtilsService, policyService, router, apiService);
+            platformUtilsService, policyService, router, apiService, syncService);
     }
 
     get masterPasswordScoreWidth() {

src/popup/scss/base.scss

@@ -368,7 +368,7 @@ content {
     }
 }
 
-.center-content, .no-items {
+.center-content, .no-items, .full-loading-spinner {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -377,7 +377,7 @@ content {
     flex-grow: 1;
 }
 
-.no-items {
+.no-items, .full-loading-spinner {
     text-align: center;
 
     .fa {

src/popup/services/services.module.ts

@@ -20,6 +20,7 @@ import { AuditService } from 'jslib/abstractions/audit.service';
 import { AuthService as AuthServiceAbstraction } from 'jslib/abstractions/auth.service';
 import { CipherService } from 'jslib/abstractions/cipher.service';
 import { CollectionService } from 'jslib/abstractions/collection.service';
+import { CryptoFunctionService } from 'jslib/abstractions/cryptoFunction.service';
 import { CryptoService } from 'jslib/abstractions/crypto.service';
 import { EnvironmentService } from 'jslib/abstractions/environment.service';
 import { EventService } from 'jslib/abstractions/event.service';
@@ -123,6 +124,11 @@ export function initFactory(i18nService: I18nService, storageService: StorageSer
         { provide: SearchServiceAbstraction, useValue: searchService },
         { provide: AuditService, useFactory: getBgService<AuditService>('auditService'), deps: [] },
         { provide: CipherService, useFactory: getBgService<CipherService>('cipherService'), deps: [] },
+        {
+            provide: CryptoFunctionService,
+            useFactory: getBgService<CryptoFunctionService>('cryptoFunctionService'),
+            deps: [],
+        },
         { provide: FolderService, useFactory: getBgService<FolderService>('folderService'), deps: [] },
         { provide: CollectionService, useFactory: getBgService<CollectionService>('collectionService'), deps: [] },
         { provide: EnvironmentService, useFactory: getBgService<EnvironmentService>('environmentService'), deps: [] },