[Refactor] Use rxjs first instead of unsubscribe from queryParams (#2112)

* Use rxjs first instead of unsubscribe

* Update jslib

jslib

@@ -1 +1 @@
-Subproject commit 764dc40b36e0000807e59b8d6feea5ac4577270d
+Subproject commit a20e935268c986538ff68f72016bb8c772ea3a1b

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

@@ -9,6 +9,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { TwoFactorProviderType } from 'jslib-common/enums/twoFactorProviderType';
 
 import { ApiService } from 'jslib-common/abstractions/api.service';
@@ -89,7 +91,7 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
             }
         }
 
-        const queryParamsSub = this.route.queryParams.subscribe(async qParams => {
+        this.route.queryParams.pipe(first()).subscribe(async qParams => {
             if (qParams.sso === 'true') {
                 super.onSuccessfulLogin = () => {
                     BrowserApi.reloadOpenWindows();
@@ -97,9 +99,6 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
                     thisWindow.close();
                     return this.syncService.fullSync(true);
                 };
-                if (queryParamsSub != null) {
-                    queryParamsSub.unsubscribe();
-                }
             }
         });
     }

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

@@ -10,6 +10,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { MessagingService } from 'jslib-common/abstractions/messaging.service';
@@ -79,7 +81,7 @@ export class SendAddEditComponent extends BaseAddEditComponent {
         this.isLinux = window?.navigator?.userAgent.indexOf('Linux') !== -1;
         this.isUnsupportedMac = this.platformUtilsService.isChrome() && window?.navigator?.appVersion.includes('Mac OS X 11');
 
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (params.sendId) {
                 this.sendId = params.sendId;
             }
@@ -88,10 +90,6 @@ export class SendAddEditComponent extends BaseAddEditComponent {
                 this.type = type;
             }
             await this.load();
-
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
 
         window.setTimeout(() => {

src/popup/send/send-type.component.ts

@@ -9,6 +9,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { Location } from '@angular/common';
 
 import { SendView } from 'jslib-common/models/view/sendView';
@@ -61,7 +63,7 @@ export class SendTypeComponent extends BaseSendComponent {
     async ngOnInit() {
         // Let super class finish
         await super.ngOnInit();
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (this.applySavedState) {
                 this.state = (await this.stateService.get<any>(ComponentId)) || {};
                 if (this.state.searchText != null) {
@@ -89,11 +91,6 @@ export class SendTypeComponent extends BaseSendComponent {
                 window.setTimeout(() => this.popupUtils.setContentScrollY(window, this.state.scrollY), 0);
             }
             this.stateService.remove(ComponentId);
-
-            // Unsubscribe
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
 
         // Refresh Send list if sync completed in background

src/popup/settings/folder-add-edit.component.ts

@@ -4,6 +4,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { FolderService } from 'jslib-common/abstractions/folder.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
@@ -24,14 +26,11 @@ export class FolderAddEditComponent extends BaseFolderAddEditComponent {
     }
 
     async ngOnInit() {
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (params.folderId) {
                 this.folderId = params.folderId;
             }
             await this.init();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
     }
 

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

@@ -5,6 +5,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { BrowserApi } from '../../browser/browserApi';
 
 import { AuditService } from 'jslib-common/abstractions/audit.service';
@@ -54,7 +56,7 @@ export class AddEditComponent extends BaseAddEditComponent {
     async ngOnInit() {
         await super.ngOnInit();
 
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (params.cipherId) {
                 this.cipherId = params.cipherId;
             }
@@ -89,9 +91,6 @@ export class AddEditComponent extends BaseAddEditComponent {
                     this.cipher.login.uris[0].uri = params.uri;
                 }
             }
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
 
             this.openAttachmentsInPopup = this.popupUtilsService.inPopup(window);
         });

src/popup/vault/attachments.component.ts

@@ -2,6 +2,8 @@ import { Location } from '@angular/common';
 import { Component } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CryptoService } from 'jslib-common/abstractions/crypto.service';
@@ -26,12 +28,9 @@ export class AttachmentsComponent extends BaseAttachmentsComponent {
     }
 
     async ngOnInit() {
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             this.cipherId = params.cipherId;
             await this.init();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
 
         this.openedAttachmentsInPopup = history.length === 1;

src/popup/vault/ciphers.component.ts

@@ -11,6 +11,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { BrowserApi } from '../../browser/browserApi';
 
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
@@ -70,7 +72,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On
 
     async ngOnInit() {
         this.searchTypeSearch = !this.platformUtilsService.isSafari();
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (this.applySavedState) {
                 this.state = (await this.stateService.get<any>(ComponentId)) || {};
                 if (this.state.searchText) {
@@ -136,9 +138,6 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On
                     this.scrollingContainer), 0);
             }
             this.stateService.remove(ComponentId);
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
 
         this.broadcasterService.subscribe(ComponentId, (message: any) => {

src/popup/vault/collections.component.ts

@@ -2,6 +2,8 @@ import { Location } from '@angular/common';
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -24,12 +26,9 @@ export class CollectionsComponent extends BaseCollectionsComponent {
         this.onSavedCollections.subscribe(() => {
             this.back();
         });
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             this.cipherId = params.cipherId;
             await this.load();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
     }
 

src/popup/vault/groupings.component.ts

@@ -11,6 +11,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { BrowserApi } from '../../browser/browserApi';
 
 import { CipherType } from 'jslib-common/enums/cipherType';
@@ -109,7 +111,7 @@ export class GroupingsComponent extends BaseGroupingsComponent implements OnInit
         });
 
         const restoredScopeState = await this.restoreState();
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             this.state = (await this.stateService.get<any>(ComponentId)) || {};
             if (this.state.searchText) {
                 this.searchText = this.state.searchText;
@@ -131,9 +133,6 @@ export class GroupingsComponent extends BaseGroupingsComponent implements OnInit
             if (!this.syncService.syncInProgress || restoredScopeState) {
                 window.setTimeout(() => this.popupUtils.setContentScrollY(window, this.state.scrollY), 0);
             }
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
     }
 

src/popup/vault/password-history.component.ts

@@ -2,6 +2,8 @@ import { Location } from '@angular/common';
 import { Component } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
 import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
@@ -22,16 +24,13 @@ export class PasswordHistoryComponent extends BasePasswordHistoryComponent {
     }
 
     async ngOnInit() {
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (params.cipherId) {
                 this.cipherId = params.cipherId;
             } else {
                 this.close();
             }
             await this.init();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
     }
 

src/popup/vault/share.component.ts

@@ -5,6 +5,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
 import { CollectionService } from 'jslib-common/abstractions/collection.service';
 import { I18nService } from 'jslib-common/abstractions/i18n.service';
@@ -29,12 +31,9 @@ export class ShareComponent extends BaseShareComponent {
         this.onSharedCipher.subscribe(() => {
             this.router.navigate(['view-cipher', { cipherId: this.cipherId }]);
         });
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             this.cipherId = params.cipherId;
             await this.load();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
     }
 

src/popup/vault/view.component.ts

@@ -9,6 +9,8 @@ import {
     Router,
 } from '@angular/router';
 
+import { first } from 'rxjs/operators';
+
 import { ApiService } from 'jslib-common/abstractions/api.service';
 import { AuditService } from 'jslib-common/abstractions/audit.service';
 import { CipherService } from 'jslib-common/abstractions/cipher.service';
@@ -65,7 +67,7 @@ export class ViewComponent extends BaseViewComponent {
 
     ngOnInit() {
         this.inPopout = this.popupUtilsService.inPopout(window);
-        const queryParamsSub = this.route.queryParams.subscribe(async params => {
+        this.route.queryParams.pipe(first()).subscribe(async params => {
             if (params.cipherId) {
                 this.cipherId = params.cipherId;
             } else {
@@ -73,9 +75,6 @@ export class ViewComponent extends BaseViewComponent {
             }
 
             await this.load();
-            if (queryParamsSub != null) {
-                queryParamsSub.unsubscribe();
-            }
         });
 
         super.ngOnInit();