From 375f2a1e027c7fb7e9a5e547ec02bd1e5c2fe8c2 Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Fri, 26 Jan 2018 23:32:03 -0500 Subject: [PATCH] group filtering --- src/app/vault/ciphers.component.ts | 20 ++++++--- src/app/vault/groupings.component.html | 62 ++++++++++++++++++++------ src/app/vault/groupings.component.ts | 36 ++++++++++++++- src/app/vault/vault.component.html | 7 ++- src/app/vault/vault.component.ts | 24 ++++++++++ 5 files changed, 127 insertions(+), 22 deletions(-) diff --git a/src/app/vault/ciphers.component.ts b/src/app/vault/ciphers.component.ts index 24bfeb75..61e480c6 100644 --- a/src/app/vault/ciphers.component.ts +++ b/src/app/vault/ciphers.component.ts @@ -21,16 +21,28 @@ export class CiphersComponent implements OnInit { @Output() onAddCipher = new EventEmitter(); ciphers: CipherView[] = []; + private filter: (cipher: CipherView) => boolean = null; constructor(private cipherService: CipherService) { } async ngOnInit() { - await this.loadCiphers(); + await this.load(); + } + + async load(filter: (cipher: CipherView) => boolean = null) { + this.filter = filter; + let ciphers = await this.cipherService.getAllDecrypted(); + + if (this.filter == null) { + this.ciphers = ciphers; + } else { + this.ciphers = ciphers.filter(this.filter); + } } async refresh() { - await this.loadCiphers(); + await this.load(this.filter); } updateCipher(cipher: CipherView) { @@ -54,8 +66,4 @@ export class CiphersComponent implements OnInit { addCipher() { this.onAddCipher.emit(); } - - private async loadCiphers() { - this.ciphers = await this.cipherService.getAllDecrypted(); - } } diff --git a/src/app/vault/groupings.component.html b/src/app/vault/groupings.component.html index fee3b9fe..815e4fbe 100644 --- a/src/app/vault/groupings.component.html +++ b/src/app/vault/groupings.component.html @@ -1,27 +1,61 @@

{{'types' | i18n}}

{{'folders' | i18n}}

-

{{'collections' | i18n}}

- +
+

{{'collections' | i18n}}

+ +
diff --git a/src/app/vault/groupings.component.ts b/src/app/vault/groupings.component.ts index b15c4db4..d6baace8 100644 --- a/src/app/vault/groupings.component.ts +++ b/src/app/vault/groupings.component.ts @@ -2,10 +2,17 @@ import * as template from './groupings.component.html'; import { Component, + EventEmitter, Input, OnInit, + Output, } from '@angular/core'; +import { CipherType } from 'jslib/enums/cipherType'; + +import { FolderView } from 'jslib/models/view/folderView'; +import { CollectionView } from 'jslib/models/view/collectionView'; + import { CollectionService } from 'jslib/abstractions/collection.service'; import { FolderService } from 'jslib/abstractions/folder.service'; @@ -14,15 +21,42 @@ import { FolderService } from 'jslib/abstractions/folder.service'; template: template, }) export class GroupingsComponent implements OnInit { + @Output() onAllClicked = new EventEmitter(); + @Output() onFavoritesClicked = new EventEmitter(); + @Output() onCipherTypeClicked = new EventEmitter(); + @Output() onFolderClicked = new EventEmitter(); + @Output() onCollectionClicked = new EventEmitter(); + folders: any[]; collections: any[]; + cipherType = CipherType; constructor(private collectionService: CollectionService, private folderService: FolderService) { - + // ctor } async ngOnInit() { this.folders = await this.folderService.getAllDecrypted(); this.collections = await this.collectionService.getAllDecrypted(); } + + all() { + this.onAllClicked.emit(); + } + + favorites() { + this.onFavoritesClicked.emit(); + } + + type(type: CipherType) { + this.onCipherTypeClicked.emit(type); + } + + folder(folder: FolderView) { + this.onFolderClicked.emit(folder); + } + + collection(collection: CollectionView) { + this.onCollectionClicked.emit(collection); + } } diff --git a/src/app/vault/vault.component.html b/src/app/vault/vault.component.html index 4e78ab63..7cfa82ea 100644 --- a/src/app/vault/vault.component.html +++ b/src/app/vault/vault.component.html @@ -1,5 +1,10 @@
- + c.favorite); + } + + async filterCipherType(type: CipherType) { + await this.ciphersComponent.load((c) => c.type === type); + } + + async filterFolder(folder: FolderView) { + await this.ciphersComponent.load((c) => c.folderId === folder.id); + } + + async filterCollection(collection: CollectionView) { + await this.ciphersComponent.load((c) => c.collectionIds.indexOf(collection.id) > -1); + } + private go(queryParams: any) { const url = this.router.createUrlTree(['vault'], { queryParams: queryParams }).toString(); this.location.go(url);