From 9e5869773db6b7c6bcd206683a2bd5f132176653 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Thu, 20 May 2021 12:35:23 +1000 Subject: [PATCH 01/11] Basic proof of concept for cdk-virtual-scroll --- src/popup/app.module.ts | 2 + .../components/ciphers-list.component.html | 46 +++++++++-------- .../components/ciphers-list.component.ts | 2 + src/popup/scss/misc.scss | 51 +++++++++++++++++++ src/popup/vault/ciphers.component.html | 12 ++--- 5 files changed, 84 insertions(+), 29 deletions(-) diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 4837f151f3f..884ddcd88be 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -1,4 +1,5 @@ import { DragDropModule } from '@angular/cdk/drag-drop'; +import { ScrollingModule } from '@angular/cdk/scrolling'; import { ToasterModule } from 'angular2-toaster'; import { InfiniteScrollModule } from 'ngx-infinite-scroll'; @@ -172,6 +173,7 @@ registerLocaleData(localeZhTw, 'zh-TW'); ToasterModule.forRoot(), InfiniteScrollModule, DragDropModule, + ScrollingModule, ], declarations: [ A11yTitleDirective, diff --git a/src/popup/components/ciphers-list.component.html b/src/popup/components/ciphers-list.component.html index 6c8c4a407b3..2d3e8d8641e 100644 --- a/src/popup/components/ciphers-list.component.html +++ b/src/popup/components/ciphers-list.component.html @@ -1,23 +1,25 @@ - -
- -
- - {{c.name}} - - - {{'shared' | i18n}} - - - - {{'attachments' | i18n}} - - - {{c.subTitle}} + + +
+ +
+ + {{c.name}} + + + {{'shared' | i18n}} + + + + {{'attachments' | i18n}} + + + {{c.subTitle}} +
-
- - - + + + + diff --git a/src/popup/components/ciphers-list.component.ts b/src/popup/components/ciphers-list.component.ts index 4c1101826c6..3696bfc056e 100644 --- a/src/popup/components/ciphers-list.component.ts +++ b/src/popup/components/ciphers-list.component.ts @@ -34,4 +34,6 @@ export class CiphersListComponent { viewCipher(c: CipherView) { this.onView.emit(c); } + + async resetPaging() { } } diff --git a/src/popup/scss/misc.scss b/src/popup/scss/misc.scss index 1d12bba3c7f..ae02ec6eab1 100644 --- a/src/popup/scss/misc.scss +++ b/src/popup/scss/misc.scss @@ -356,3 +356,54 @@ select option { background-color: darken(themed('inputBackgroundColor'), +1); } } + +// TODO: this but better +cdk-virtual-scroll-viewport { + height: 500px; + width: 375px; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + overflow-y: auto !important; + overflow-x: hidden !important; + + &.flex { + display: flex; + flex-flow: column; + + &.tab-page { + height: calc(100% - 99px); + } + } +} + +// cribbed directly from base.scss +cdk-virtual-scroll-viewport::-webkit-scrollbar, cdk-virtual-scroll-viewport::-webkit-scrollbar { + width: 10px; + height: 10px; +} + +cdk-virtual-scroll-viewport::-webkit-scrollbar-track, cdk-virtual-scroll-viewport::-webkit-scrollbar { + background-color: transparent; +} + +cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb, cdk-virtual-scroll-viewport::-webkit-scrollbar { + border-radius: 10px; + margin-right: 1px; + + @include themify($themes) { + background-color: themed('scrollbarColor'); + } + + &:hover { + @include themify($themes) { + background-color: themed('scrollbarHoverColor'); + } + } +} + +.cdk-virtual-scroll-content-wrapper { + width: 100%; +} diff --git a/src/popup/vault/ciphers.component.html b/src/popup/vault/ciphers.component.html index 3581afa21d1..b61aef58e97 100644 --- a/src/popup/vault/ciphers.component.html +++ b/src/popup/vault/ciphers.component.html @@ -53,8 +53,8 @@
- -
+ +

{{'noItemsInList' | i18n}}

@@ -63,15 +63,13 @@
-
+
{{groupingTitle}} - {{isSearching() ? filteredCiphers.length : ciphers.length}} + {{isSearching() ? ciphers.length : ciphers.length}}
-
From 6b954df58c2b91bd301ecf0a32ff57c06c41f009 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 12:42:56 +1000 Subject: [PATCH 02/11] Refactor to use virtual-scroll more selectively --- src/popup/app.module.ts | 2 ++ .../components/cipher-row.component.html | 24 ++++++++++++++ src/popup/components/cipher-row.component.ts | 33 +++++++++++++++++++ src/popup/scss/misc.scss | 24 ++++---------- src/popup/services/popup-utils.service.ts | 8 ++--- src/popup/vault/ciphers.component.html | 20 ++++++----- src/popup/vault/ciphers.component.ts | 6 ++-- 7 files changed, 84 insertions(+), 33 deletions(-) create mode 100644 src/popup/components/cipher-row.component.html create mode 100644 src/popup/components/cipher-row.component.ts diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 884ddcd88be..8862faf9bec 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -69,6 +69,7 @@ import { I18nPipe } from 'jslib/angular/pipes/i18n.pipe'; import { SearchCiphersPipe } from 'jslib/angular/pipes/search-ciphers.pipe'; import { ActionButtonsComponent } from './components/action-buttons.component'; +import { CipherRowComponent } from './components/cipher-row.component'; import { CiphersListComponent } from './components/ciphers-list.component'; import { PopOutComponent } from './components/pop-out.component'; import { SendListComponent } from './components/send-list.component'; @@ -186,6 +187,7 @@ registerLocaleData(localeZhTw, 'zh-TW'); BlurClickDirective, BoxRowDirective, CalloutComponent, + CipherRowComponent, CiphersComponent, CiphersListComponent, CollectionsComponent, diff --git a/src/popup/components/cipher-row.component.html b/src/popup/components/cipher-row.component.html new file mode 100644 index 00000000000..8d482fcae5a --- /dev/null +++ b/src/popup/components/cipher-row.component.html @@ -0,0 +1,24 @@ + + +
+ +
+ + {{cipher.name}} + + + {{'shared' | i18n}} + + + + {{'attachments' | i18n}} + + + {{cipher.subTitle}} +
+
+ + + diff --git a/src/popup/components/cipher-row.component.ts b/src/popup/components/cipher-row.component.ts new file mode 100644 index 00000000000..d5d59d1b514 --- /dev/null +++ b/src/popup/components/cipher-row.component.ts @@ -0,0 +1,33 @@ +import { + Component, + EventEmitter, + Input, + Output, +} from '@angular/core'; + +import { CipherView } from 'jslib/models/view/cipherView'; + +@Component({ + selector: 'app-cipher-row', + templateUrl: 'cipher-row.component.html', +}) +export class CipherRowComponent { + @Output() onSelected = new EventEmitter(); + @Output() launchEvent = new EventEmitter(); + @Output() onView = new EventEmitter(); + @Input() cipher: CipherView; + @Input() showView = false; + @Input() title: string; + + selectCipher(c: CipherView) { + this.onSelected.emit(c); + } + + launchCipher(c: CipherView) { + this.launchEvent.emit(c); + } + + viewCipher(c: CipherView) { + this.onView.emit(c); + } +} diff --git a/src/popup/scss/misc.scss b/src/popup/scss/misc.scss index ae02ec6eab1..05ec0c0d9fe 100644 --- a/src/popup/scss/misc.scss +++ b/src/popup/scss/misc.scss @@ -361,35 +361,23 @@ select option { cdk-virtual-scroll-viewport { height: 500px; width: 375px; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; overflow-y: auto !important; overflow-x: hidden !important; - - &.flex { - display: flex; - flex-flow: column; - - &.tab-page { - height: calc(100% - 99px); - } - } } // cribbed directly from base.scss -cdk-virtual-scroll-viewport::-webkit-scrollbar, cdk-virtual-scroll-viewport::-webkit-scrollbar { +cdk-virtual-scroll-viewport::-webkit-scrollbar { width: 10px; height: 10px; } -cdk-virtual-scroll-viewport::-webkit-scrollbar-track, cdk-virtual-scroll-viewport::-webkit-scrollbar { - background-color: transparent; +cdk-virtual-scroll-viewport::-webkit-scrollbar-track { + @include themify($themes) { + background-color: themed('backgroundColor'); + } } -cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb, cdk-virtual-scroll-viewport::-webkit-scrollbar { +cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb { border-radius: 10px; margin-right: 1px; diff --git a/src/popup/services/popup-utils.service.ts b/src/popup/services/popup-utils.service.ts index a02ba61c8ed..dcd06c2f531 100644 --- a/src/popup/services/popup-utils.service.ts +++ b/src/popup/services/popup-utils.service.ts @@ -25,14 +25,14 @@ export class PopupUtilsService { win.location.search.indexOf('uilocation=popup') > -1; } - getContentScrollY(win: Window): number { - const content = win.document.getElementsByTagName('content')[0]; + getContentScrollY(win: Window, scrollingContainer: string = 'content'): number { + const content = win.document.getElementsByTagName(scrollingContainer)[0]; return content.scrollTop; } - setContentScrollY(win: Window, scrollY: number): void { + setContentScrollY(win: Window, scrollY: number, scrollingContainer: string = 'content'): void { if (scrollY != null) { - const content = win.document.getElementsByTagName('content')[0]; + const content = win.document.getElementsByTagName(scrollingContainer)[0]; content.scrollTop = scrollY; } } diff --git a/src/popup/vault/ciphers.component.html b/src/popup/vault/ciphers.component.html index b61aef58e97..67cb8b398e9 100644 --- a/src/popup/vault/ciphers.component.html +++ b/src/popup/vault/ciphers.component.html @@ -63,15 +63,17 @@
-
-
- {{groupingTitle}} - {{isSearching() ? ciphers.length : ciphers.length}} + +
+
+ {{groupingTitle}} + {{isSearching() ? ciphers.length : ciphers.length}} +
+
+ +
-
- -
-
+ diff --git a/src/popup/vault/ciphers.component.ts b/src/popup/vault/ciphers.component.ts index 02a07e6467b..e9ee0a98949 100644 --- a/src/popup/vault/ciphers.component.ts +++ b/src/popup/vault/ciphers.component.ts @@ -54,6 +54,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On private selectedTimeout: number; private preventSelected = false; private applySavedState = true; + private scrollingContainer = 'cdk-virtual-scroll-viewport'; constructor(searchService: SearchService, private route: ActivatedRoute, private router: Router, private location: Location, @@ -132,7 +133,8 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On } if (this.applySavedState && this.state != null) { - window.setTimeout(() => this.popupUtils.setContentScrollY(window, this.state.scrollY), 0); + window.setTimeout(() => this.popupUtils.setContentScrollY(window, this.state.scrollY, + this.scrollingContainer), 0); } this.stateService.remove(ComponentId); if (queryParamsSub != null) { @@ -227,7 +229,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On private async saveState() { this.state = { - scrollY: this.popupUtils.getContentScrollY(window), + scrollY: this.popupUtils.getContentScrollY(window, this.scrollingContainer), searchText: this.searchText, }; await this.stateService.save(ComponentId, this.state); From 811e0072e1e4c26731e91e1fc6afdf08d6cb93f8 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 12:44:25 +1000 Subject: [PATCH 03/11] enable Ivy --- tsconfig.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/tsconfig.json b/tsconfig.json index a1991acf1a5..e271575e482 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -31,8 +31,7 @@ } }, "angularCompilerOptions": { - "preserveWhitespaces": true, - "enableIvy": false + "preserveWhitespaces": true }, "exclude": [ "node_modules", From 8151d5bcaca60e996918af6ca5717845259b6e9e Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 12:58:48 +1000 Subject: [PATCH 04/11] Revert changes to original ciphers-list.component --- .../components/ciphers-list.component.html | 46 +++++++++---------- .../components/ciphers-list.component.ts | 2 - 2 files changed, 22 insertions(+), 26 deletions(-) diff --git a/src/popup/components/ciphers-list.component.html b/src/popup/components/ciphers-list.component.html index 2d3e8d8641e..e167d43485c 100644 --- a/src/popup/components/ciphers-list.component.html +++ b/src/popup/components/ciphers-list.component.html @@ -1,25 +1,23 @@ - - -
- -
- - {{c.name}} - - - {{'shared' | i18n}} - - - - {{'attachments' | i18n}} - - - {{c.subTitle}} -
+ +
+ +
+ + {{c.name}} + + + {{'shared' | i18n}} + + + + {{'attachments' | i18n}} + + + {{c.subTitle}}
- - - - +
+ + + diff --git a/src/popup/components/ciphers-list.component.ts b/src/popup/components/ciphers-list.component.ts index 3696bfc056e..4c1101826c6 100644 --- a/src/popup/components/ciphers-list.component.ts +++ b/src/popup/components/ciphers-list.component.ts @@ -34,6 +34,4 @@ export class CiphersListComponent { viewCipher(c: CipherView) { this.onView.emit(c); } - - async resetPaging() { } } From 081bda255c964a94768c01ca6291237f32813b94 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 13:01:39 +1000 Subject: [PATCH 05/11] use virtual scroll for favorite ciphers --- src/popup/vault/groupings.component.html | 230 ++++++++++++----------- 1 file changed, 117 insertions(+), 113 deletions(-) diff --git a/src/popup/vault/groupings.component.html b/src/popup/vault/groupings.component.html index 0aa05632023..cdad0e9331c 100644 --- a/src/popup/vault/groupings.component.html +++ b/src/popup/vault/groupings.component.html @@ -23,131 +23,135 @@
-
-
- {{'favorites' | i18n}} - {{favoriteCiphers.length}} + +
+
+ {{'favorites' | i18n}} + {{favoriteCiphers.length}} +
+
+ +
-
- -
-
-
-
- {{'types' | i18n}} - 4 -
-
- -
-
- {{'typeLogin' | i18n}} -
- {{typeCounts.get(cipherType.Login) || 0}} - - - -
-
- {{'typeCard' | i18n}} -
- {{typeCounts.get(cipherType.Card) || 0}} - - - -
-
- {{'typeIdentity' | i18n}} -
- {{typeCounts.get(cipherType.Identity) || 0}} - - - -
-
- {{'typeSecureNote' | i18n}} -
- {{typeCounts.get(cipherType.SecureNote) || 0}} - - -
-
-
-
- {{'folders' | i18n}} - {{folderCount}} -
-
- -
-
- +
+
+ {{'types' | i18n}} + 4 +
+
+ +
+
+ {{'typeLogin' | i18n}}
- {{f.node.name}} -
- {{folderCounts.get(f.node.id) || 0}} - - + {{typeCounts.get(cipherType.Login) || 0}} + + + +
+
+ {{'typeCard' | i18n}} +
+ {{typeCounts.get(cipherType.Card) || 0}} + + + +
+
+ {{'typeIdentity' | i18n}} +
+ {{typeCounts.get(cipherType.Identity) || 0}} + + + +
+
+ {{'typeSecureNote' | i18n}} +
+ {{typeCounts.get(cipherType.SecureNote) || 0}} + + +
-
-
-
- {{'collections' | i18n}} - {{nestedCollections.length}} +
+
+ {{'folders' | i18n}} + {{folderCount}} +
+
+ +
+
+ +
+ {{f.node.name}} +
+ {{folderCounts.get(f.node.id) || 0}} + + +
-
- -
-
- {{c.node.name}} -
- {{collectionCounts.get(c.node.id) || 0}} - - +
+
+ {{'collections' | i18n}} + {{nestedCollections.length}} +
+
+ +
+
+ {{c.node.name}} +
+ {{collectionCounts.get(c.node.id) || 0}} + + +
-
-
-
- {{'noneFolder' | i18n}} -
{{noFolderCiphers.length}}
+
+
+ {{'noneFolder' | i18n}} +
{{noFolderCiphers.length}}
+
+
+ +
-
- +
+
+ {{'trash' | i18n}} + {{deletedCount}} +
+
+ +
+
+ {{'trash' | i18n}} +
+ {{deletedCount}} + + +
-
-
-
- {{'trash' | i18n}} - {{deletedCount}} -
-
- -
-
- {{'trash' | i18n}} -
- {{deletedCount}} - - -
-
+

{{'noItemsInList' | i18n}}

-
-
- + +
+
+ +
-
+ From 94ee6c1ab7f22b4fc04aa526733a6067a32959bb Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 13:03:05 +1000 Subject: [PATCH 06/11] fix linting and style --- src/popup/app.module.ts | 2 +- src/popup/components/cipher-row.component.html | 1 - src/popup/vault/ciphers.component.ts | 1 - 3 files changed, 1 insertion(+), 3 deletions(-) diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 8862faf9bec..995c0a34258 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -1,5 +1,5 @@ import { DragDropModule } from '@angular/cdk/drag-drop'; -import { ScrollingModule } from '@angular/cdk/scrolling'; +import { ScrollingModule } from '@angular/cdk/scrolling'; import { ToasterModule } from 'angular2-toaster'; import { InfiniteScrollModule } from 'ngx-infinite-scroll'; diff --git a/src/popup/components/cipher-row.component.html b/src/popup/components/cipher-row.component.html index 8d482fcae5a..19a9e87d7d7 100644 --- a/src/popup/components/cipher-row.component.html +++ b/src/popup/components/cipher-row.component.html @@ -1,4 +1,3 @@ -
diff --git a/src/popup/vault/ciphers.component.ts b/src/popup/vault/ciphers.component.ts index e9ee0a98949..525de65e5ee 100644 --- a/src/popup/vault/ciphers.component.ts +++ b/src/popup/vault/ciphers.component.ts @@ -64,7 +64,6 @@ export class CiphersComponent extends BaseCiphersComponent implements OnInit, On private folderService: FolderService, private collectionService: CollectionService, private platformUtilsService: PlatformUtilsService, private cipherService: CipherService) { super(searchService); - this.pageSize = 100; this.applySavedState = (window as any).previousPopupUrl != null && !(window as any).previousPopupUrl.startsWith('/ciphers'); } From 2b3ae50ed913e4a0aaa7041787d1d4b2a52583be Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 14:06:26 +1000 Subject: [PATCH 07/11] tidy up scss --- src/popup/scss/base.scss | 22 ++++++++++++++++++++-- src/popup/scss/misc.scss | 39 --------------------------------------- 2 files changed, 20 insertions(+), 41 deletions(-) diff --git a/src/popup/scss/base.scss b/src/popup/scss/base.scss index 54769ebdfaa..8dd54509f16 100644 --- a/src/popup/scss/base.scss +++ b/src/popup/scss/base.scss @@ -100,7 +100,7 @@ main { height: 100%; } -content::-webkit-scrollbar { +content::-webkit-scrollbar, cdk-virtual-scroll-viewport::-webkit-scrollbar { width: 10px; height: 10px; } @@ -109,7 +109,13 @@ content::-webkit-scrollbar-track { background-color: transparent; } -content::-webkit-scrollbar-thumb { +cdk-virtual-scroll-viewport::-webkit-scrollbar-track { + @include themify($themes) { + background-color: themed('backgroundColor'); + } +} + +content::-webkit-scrollbar-thumb, cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb { border-radius: 10px; margin-right: 1px; @@ -394,3 +400,15 @@ content { } } } + +// cdk-virtual-scroll +.cdk-virtual-scroll-viewport { + width: 100%; + height: 100%; + overflow-y: auto; + overflow-x: hidden; +} + +.cdk-virtual-scroll-content-wrapper { + width: 100%; +} diff --git a/src/popup/scss/misc.scss b/src/popup/scss/misc.scss index 05ec0c0d9fe..1d12bba3c7f 100644 --- a/src/popup/scss/misc.scss +++ b/src/popup/scss/misc.scss @@ -356,42 +356,3 @@ select option { background-color: darken(themed('inputBackgroundColor'), +1); } } - -// TODO: this but better -cdk-virtual-scroll-viewport { - height: 500px; - width: 375px; - overflow-y: auto !important; - overflow-x: hidden !important; -} - -// cribbed directly from base.scss -cdk-virtual-scroll-viewport::-webkit-scrollbar { - width: 10px; - height: 10px; -} - -cdk-virtual-scroll-viewport::-webkit-scrollbar-track { - @include themify($themes) { - background-color: themed('backgroundColor'); - } -} - -cdk-virtual-scroll-viewport::-webkit-scrollbar-thumb { - border-radius: 10px; - margin-right: 1px; - - @include themify($themes) { - background-color: themed('scrollbarColor'); - } - - &:hover { - @include themify($themes) { - background-color: themed('scrollbarHoverColor'); - } - } -} - -.cdk-virtual-scroll-content-wrapper { - width: 100%; -} From f2977aab0cfa9f8bbc74d9430b4501d9a8b79134 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 14:16:18 +1000 Subject: [PATCH 08/11] remove ciphers-list.component --- src/popup/app.module.ts | 2 - .../components/ciphers-list.component.html | 23 ------------ .../components/ciphers-list.component.ts | 37 ------------------- src/popup/vault/current-tab.component.html | 14 +++---- src/popup/vault/groupings.component.html | 4 +- 5 files changed, 9 insertions(+), 71 deletions(-) delete mode 100644 src/popup/components/ciphers-list.component.html delete mode 100644 src/popup/components/ciphers-list.component.ts diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 995c0a34258..9526f1db324 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -70,7 +70,6 @@ import { SearchCiphersPipe } from 'jslib/angular/pipes/search-ciphers.pipe'; import { ActionButtonsComponent } from './components/action-buttons.component'; import { CipherRowComponent } from './components/cipher-row.component'; -import { CiphersListComponent } from './components/ciphers-list.component'; import { PopOutComponent } from './components/pop-out.component'; import { SendListComponent } from './components/send-list.component'; @@ -189,7 +188,6 @@ registerLocaleData(localeZhTw, 'zh-TW'); CalloutComponent, CipherRowComponent, CiphersComponent, - CiphersListComponent, CollectionsComponent, ColorPasswordPipe, CurrentTabComponent, diff --git a/src/popup/components/ciphers-list.component.html b/src/popup/components/ciphers-list.component.html deleted file mode 100644 index e167d43485c..00000000000 --- a/src/popup/components/ciphers-list.component.html +++ /dev/null @@ -1,23 +0,0 @@ - -
- -
- - {{c.name}} - - - {{'shared' | i18n}} - - - - {{'attachments' | i18n}} - - - {{c.subTitle}} -
-
- - - diff --git a/src/popup/components/ciphers-list.component.ts b/src/popup/components/ciphers-list.component.ts deleted file mode 100644 index 4c1101826c6..00000000000 --- a/src/popup/components/ciphers-list.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { - Component, - EventEmitter, - Input, - Output, -} from '@angular/core'; - -import { CipherType } from 'jslib/enums/cipherType'; - -import { CipherView } from 'jslib/models/view/cipherView'; - -@Component({ - selector: 'app-ciphers-list', - templateUrl: 'ciphers-list.component.html', -}) -export class CiphersListComponent { - @Output() onSelected = new EventEmitter(); - @Output() launchEvent = new EventEmitter(); - @Output() onView = new EventEmitter(); - @Input() ciphers: CipherView[]; - @Input() showView = false; - @Input() title: string; - - cipherType = CipherType; - - selectCipher(c: CipherView) { - this.onSelected.emit(c); - } - - launchCipher(c: CipherView) { - this.launchEvent.emit(c); - } - - viewCipher(c: CipherView) { - this.onView.emit(c); - } -} diff --git a/src/popup/vault/current-tab.component.html b/src/popup/vault/current-tab.component.html index 5400c82cc09..a65ec9b6672 100644 --- a/src/popup/vault/current-tab.component.html +++ b/src/popup/vault/current-tab.component.html @@ -27,9 +27,9 @@ {{loginCiphers.length}}
- - + +

{{'autoFillInfo' | i18n}}

- +
@@ -54,8 +54,8 @@ {{identityCiphers.length}}
- +
diff --git a/src/popup/vault/groupings.component.html b/src/popup/vault/groupings.component.html index cdad0e9331c..a679c825547 100644 --- a/src/popup/vault/groupings.component.html +++ b/src/popup/vault/groupings.component.html @@ -118,8 +118,8 @@
{{noFolderCiphers.length}}
- +
From a2c278471b04c8ab5b3cbf7608283a8bb990f2fb Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Fri, 21 May 2021 15:03:08 +1000 Subject: [PATCH 09/11] remove ngx-infinite-scroll --- src/popup/app.module.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 9526f1db324..c41f5bb3c65 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -1,7 +1,6 @@ import { DragDropModule } from '@angular/cdk/drag-drop'; import { ScrollingModule } from '@angular/cdk/scrolling'; import { ToasterModule } from 'angular2-toaster'; -import { InfiniteScrollModule } from 'ngx-infinite-scroll'; import { AppRoutingModule } from './app-routing.module'; import { ServicesModule } from './services/services.module'; @@ -171,7 +170,6 @@ registerLocaleData(localeZhTw, 'zh-TW'); AppRoutingModule, ServicesModule, ToasterModule.forRoot(), - InfiniteScrollModule, DragDropModule, ScrollingModule, ], From c12ceb4877ac8d359948311ce4403f4df4a934e0 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Thu, 3 Jun 2021 08:47:02 +1000 Subject: [PATCH 10/11] style fixes, more descriptive naming --- src/popup/vault/current-tab.component.html | 9 ++++---- src/popup/vault/groupings.component.html | 25 ++++++++++++---------- 2 files changed, 19 insertions(+), 15 deletions(-) diff --git a/src/popup/vault/current-tab.component.html b/src/popup/vault/current-tab.component.html index a65ec9b6672..c4455992cdb 100644 --- a/src/popup/vault/current-tab.component.html +++ b/src/popup/vault/current-tab.component.html @@ -27,8 +27,9 @@ {{loginCiphers.length}}
- +

{{'autoFillInfo' | i18n}}

@@ -44,7 +45,7 @@ {{cardCiphers.length}}
-
@@ -54,7 +55,7 @@ {{identityCiphers.length}}
-
diff --git a/src/popup/vault/groupings.component.html b/src/popup/vault/groupings.component.html index a679c825547..d80377bbe58 100644 --- a/src/popup/vault/groupings.component.html +++ b/src/popup/vault/groupings.component.html @@ -30,8 +30,9 @@ {{favoriteCiphers.length}}
- +
@@ -75,7 +76,7 @@
-
+
{{'folders' | i18n}} {{folderCount}} @@ -101,13 +102,13 @@ {{nestedCollections.length}}
- +
- {{c.node.name}} + {{nestedCollection.node.name}}
- {{collectionCounts.get(c.node.id) || 0}} + {{collectionCounts.get(nestedCollection.node.id) || 0}}
@@ -118,8 +119,9 @@
{{noFolderCiphers.length}}
- +
@@ -148,8 +150,9 @@
- +
From d71219caa9a6c7598b18efd41041bbd6ce8b32b6 Mon Sep 17 00:00:00 2001 From: Thomas Rittson Date: Thu, 3 Jun 2021 08:50:36 +1000 Subject: [PATCH 11/11] Remove virtualScroll for favorites list --- src/popup/vault/groupings.component.html | 222 +++++++++++------------ 1 file changed, 110 insertions(+), 112 deletions(-) diff --git a/src/popup/vault/groupings.component.html b/src/popup/vault/groupings.component.html index d80377bbe58..ade7ba5593f 100644 --- a/src/popup/vault/groupings.component.html +++ b/src/popup/vault/groupings.component.html @@ -23,125 +23,123 @@
- -
-
- {{'favorites' | i18n}} - {{favoriteCiphers.length}} -
-
- -
+
+
+ {{'favorites' | i18n}} + {{favoriteCiphers.length}}
-
-
- {{'types' | i18n}} - 4 -
-
- -
-
- {{'typeLogin' | i18n}} -
- {{typeCounts.get(cipherType.Login) || 0}} - - - -
-
- {{'typeCard' | i18n}} -
- {{typeCounts.get(cipherType.Card) || 0}} - - - -
-
- {{'typeIdentity' | i18n}} -
- {{typeCounts.get(cipherType.Identity) || 0}} - - - -
-
- {{'typeSecureNote' | i18n}} -
- {{typeCounts.get(cipherType.SecureNote) || 0}} - - -
+
+
-
-
- {{'folders' | i18n}} - {{folderCount}} -
-
- -
-
- -
- {{f.node.name}} +
+
+
+ {{'types' | i18n}} + 4 +
+
+ +
+
+ {{'typeLogin' | i18n}} +
+ {{typeCounts.get(cipherType.Login) || 0}} + + + +
+
+ {{'typeCard' | i18n}} +
+ {{typeCounts.get(cipherType.Card) || 0}} + + + +
+
+ {{'typeIdentity' | i18n}} +
+ {{typeCounts.get(cipherType.Identity) || 0}} + + + +
+
+ {{'typeSecureNote' | i18n}} +
+ {{typeCounts.get(cipherType.SecureNote) || 0}} + + +
+
+
+
+ {{'folders' | i18n}} + {{folderCount}} +
+
+ +
+
+
- {{folderCounts.get(f.node.id) || 0}} - - -
+ {{f.node.name}} +
+ {{folderCounts.get(f.node.id) || 0}} + +
-
-
- {{'collections' | i18n}} - {{nestedCollections.length}} -
-
- -
-
- {{nestedCollection.node.name}} -
- {{collectionCounts.get(nestedCollection.node.id) || 0}} - - -
+
+
+
+ {{'collections' | i18n}} + {{nestedCollections.length}}
-
-
- {{'noneFolder' | i18n}} -
{{noFolderCiphers.length}}
-
-
- -
+
+ +
+
+ {{nestedCollection.node.name}} +
+ {{collectionCounts.get(nestedCollection.node.id) || 0}} + +
-
-
- {{'trash' | i18n}} - {{deletedCount}} -
-
- -
-
- {{'trash' | i18n}} -
- {{deletedCount}} - - -
+
+
+
+ {{'noneFolder' | i18n}} +
{{noFolderCiphers.length}}
- +
+ +
+
+
+
+ {{'trash' | i18n}} + {{deletedCount}} +
+
+ +
+
+ {{'trash' | i18n}} +
+ {{deletedCount}} + + +
+