mirror of
https://github.com/bitwarden/browser
synced 2025-12-17 16:53:34 +00:00
page ciphers list for better performance
This commit is contained in:
@@ -4,6 +4,7 @@ import 'zone.js/dist/zone';
|
||||
import { ToasterModule } from 'angular2-toaster';
|
||||
import { Angulartics2Module } from 'angulartics2';
|
||||
import { Angulartics2GoogleAnalytics } from 'angulartics2/ga';
|
||||
import { InfiniteScrollModule } from 'ngx-infinite-scroll';
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { ServicesModule } from './services.module';
|
||||
@@ -136,6 +137,7 @@ registerLocaleData(localeZhTw, 'zh-TW');
|
||||
},
|
||||
}),
|
||||
ToasterModule.forRoot(),
|
||||
InfiniteScrollModule,
|
||||
],
|
||||
declarations: [
|
||||
AddEditComponent,
|
||||
|
||||
@@ -6,10 +6,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<ng-container *ngIf="ciphers">
|
||||
<div class="list" *ngIf="ciphers.length > 0">
|
||||
<a *ngFor="let c of ciphers" appStopClick (click)="selectCipher(c)" (contextmenu)="rightClickCipher(c)"
|
||||
href="#" title="{{'viewItem' | i18n}}" [ngClass]="{'active': c.id === activeCipherId}">
|
||||
<ng-container *ngIf="(isPaging() ? pagedCiphers : ciphers) as filteredCiphers">
|
||||
<div class="list" *ngIf="filteredCiphers.length" infiniteScroll [infiniteScrollDistance]="1"
|
||||
[infiniteScrollContainer]="'#items .content'" [fromRoot]="true" [infiniteScrollDisabled]="!isPaging()"
|
||||
(scrolled)="loadMore()">
|
||||
<a *ngFor="let c of filteredCiphers" appStopClick (click)="selectCipher(c)"
|
||||
(contextmenu)="rightClickCipher(c)" href="#" title="{{'viewItem' | i18n}}"
|
||||
[ngClass]="{'active': c.id === activeCipherId}">
|
||||
<app-vault-icon [cipher]="c"></app-vault-icon>
|
||||
<span class="text">
|
||||
{{c.name}}
|
||||
@@ -19,7 +22,7 @@
|
||||
<span class="detail">{{c.subTitle}}</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="no-items" *ngIf="ciphers.length === 0">
|
||||
<div class="no-items" *ngIf="!filteredCiphers.length">
|
||||
<i class="fa fa-spinner fa-spin fa-3x" *ngIf="!loaded"></i>
|
||||
<ng-container *ngIf="loaded">
|
||||
<i class="fa fa-frown-o fa-4x"></i>
|
||||
|
||||
@@ -11,5 +11,6 @@ import { CiphersComponent as BaseCiphersComponent } from 'jslib/angular/componen
|
||||
export class CiphersComponent extends BaseCiphersComponent {
|
||||
constructor(searchService: SearchService) {
|
||||
super(searchService);
|
||||
this.pageSize = 250;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,7 +7,9 @@
|
||||
{{'share' | i18n}}
|
||||
</div>
|
||||
<div class="box-content" *ngIf="!organizations || !organizations.length">
|
||||
{{'noOrganizationsList' | i18n}}
|
||||
<div class="box-content-row">
|
||||
{{'noOrganizationsList' | i18n}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-content" *ngIf="organizations && organizations.length">
|
||||
<div class="box-content-row" appBoxRow>
|
||||
|
||||
@@ -168,7 +168,7 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
|
||||
if (params == null) {
|
||||
this.groupingsComponent.selectedAll = true;
|
||||
await this.ciphersComponent.load();
|
||||
await this.ciphersComponent.reload();
|
||||
} else {
|
||||
if (params.cipherId) {
|
||||
const cipherView = new CipherView();
|
||||
@@ -198,7 +198,7 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
await this.filterCollection(params.collectionId);
|
||||
} else {
|
||||
this.groupingsComponent.selectedAll = true;
|
||||
await this.ciphersComponent.load();
|
||||
await this.ciphersComponent.reload();
|
||||
}
|
||||
}
|
||||
if (queryParamsSub != null) {
|
||||
@@ -422,14 +422,14 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
|
||||
async clearGroupingFilters() {
|
||||
this.ciphersComponent.searchPlaceholder = this.i18nService.t('searchVault');
|
||||
await this.ciphersComponent.load();
|
||||
await this.ciphersComponent.reload();
|
||||
this.clearFilters();
|
||||
this.go();
|
||||
}
|
||||
|
||||
async filterFavorites() {
|
||||
this.ciphersComponent.searchPlaceholder = this.i18nService.t('searchFavorites');
|
||||
await this.ciphersComponent.load((c) => c.favorite);
|
||||
await this.ciphersComponent.reload((c) => c.favorite);
|
||||
this.clearFilters();
|
||||
this.favorites = true;
|
||||
this.go();
|
||||
@@ -437,7 +437,7 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
|
||||
async filterCipherType(type: CipherType) {
|
||||
this.ciphersComponent.searchPlaceholder = this.i18nService.t('searchType');
|
||||
await this.ciphersComponent.load((c) => c.type === type);
|
||||
await this.ciphersComponent.reload((c) => c.type === type);
|
||||
this.clearFilters();
|
||||
this.type = type;
|
||||
this.go();
|
||||
@@ -446,7 +446,7 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
async filterFolder(folderId: string) {
|
||||
folderId = folderId === 'none' ? null : folderId;
|
||||
this.ciphersComponent.searchPlaceholder = this.i18nService.t('searchFolder');
|
||||
await this.ciphersComponent.load((c) => c.folderId === folderId);
|
||||
await this.ciphersComponent.reload((c) => c.folderId === folderId);
|
||||
this.clearFilters();
|
||||
this.folderId = folderId == null ? 'none' : folderId;
|
||||
this.go();
|
||||
@@ -454,7 +454,8 @@ export class VaultComponent implements OnInit, OnDestroy {
|
||||
|
||||
async filterCollection(collectionId: string) {
|
||||
this.ciphersComponent.searchPlaceholder = this.i18nService.t('searchCollection');
|
||||
await this.ciphersComponent.load((c) => c.collectionIds != null && c.collectionIds.indexOf(collectionId) > -1);
|
||||
await this.ciphersComponent.reload((c) => c.collectionIds != null &&
|
||||
c.collectionIds.indexOf(collectionId) > -1);
|
||||
this.clearFilters();
|
||||
this.collectionId = collectionId;
|
||||
this.updateCollectionProperties();
|
||||
|
||||
Reference in New Issue
Block a user