mirror of
https://github.com/bitwarden/browser
synced 2025-12-16 16:23:44 +00:00
migrate components in reports
This commit is contained in:
@@ -11,7 +11,6 @@ import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
|
|||||||
import { PasswordRepromptService } from "@bitwarden/vault";
|
import { PasswordRepromptService } from "@bitwarden/vault";
|
||||||
|
|
||||||
import { CipherReportComponent } from "./cipher-report.component";
|
import { CipherReportComponent } from "./cipher-report.component";
|
||||||
import { cipherData } from "./reports-ciphers.mock";
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: "app-exposed-passwords-report",
|
selector: "app-exposed-passwords-report",
|
||||||
@@ -45,8 +44,7 @@ export class ExposedPasswordsReportComponent extends CipherReportComponent imple
|
|||||||
}
|
}
|
||||||
|
|
||||||
async setCiphers() {
|
async setCiphers() {
|
||||||
const allCiphers = cipherData;
|
const allCiphers = await this.getAllCiphers();
|
||||||
// const allCiphers = await this.getAllCiphers();
|
|
||||||
this.dataSource.data = allCiphers;
|
this.dataSource.data = allCiphers;
|
||||||
const exposedPasswordCiphers: CipherView[] = [];
|
const exposedPasswordCiphers: CipherView[] = [];
|
||||||
const promises: Promise<void>[] = [];
|
const promises: Promise<void>[] = [];
|
||||||
|
|||||||
@@ -11,13 +11,13 @@
|
|||||||
<span class="sr-only">{{ "loading" | i18n }}</span>
|
<span class="sr-only">{{ "loading" | i18n }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-4" *ngIf="hasLoaded">
|
<div class="mt-4" *ngIf="hasLoaded">
|
||||||
<app-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
<bit-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
||||||
{{ "noInactive2fa" | i18n }}
|
{{ "noInactive2fa" | i18n }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
<ng-container *ngIf="ciphers.length">
|
<ng-container *ngIf="ciphers.length">
|
||||||
<app-callout type="danger" title="{{ 'inactive2faFound' | i18n }}">
|
<bit-callout type="danger" title="{{ 'inactive2faFound' | i18n }}">
|
||||||
{{ "inactive2faFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
{{ "inactive2faFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
<bit-toggle-group
|
<bit-toggle-group
|
||||||
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
||||||
[selected]="filterOrgStatus$ | async"
|
[selected]="filterOrgStatus$ | async"
|
||||||
@@ -31,27 +31,29 @@
|
|||||||
</bit-toggle>
|
</bit-toggle>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</bit-toggle-group>
|
</bit-toggle-group>
|
||||||
<table class="table table-hover table-list table-ciphers">
|
<bit-table [dataSource]="dataSource">
|
||||||
<thead
|
<ng-container header *ngIf="!isAdminConsoleActive">
|
||||||
class="tw-border-0 tw-border-b-2 tw-border-solid tw-border-secondary-300 tw-font-bold tw-text-muted"
|
|
||||||
*ngIf="!isAdminConsoleActive"
|
|
||||||
>
|
|
||||||
<tr>
|
<tr>
|
||||||
<th></th>
|
<th></th>
|
||||||
<th>{{ "name" | i18n }}</th>
|
<th>{{ "name" | i18n }}</th>
|
||||||
<th>{{ "owner" | i18n }}</th>
|
<th>{{ "owner" | i18n }}</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</ng-container>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr *ngFor="let c of ciphers">
|
<ng-template body let-rows$>
|
||||||
<td class="table-list-icon">
|
<tr bitRow *ngFor="let r of rows$ | async">
|
||||||
<app-vault-icon [cipher]="c"></app-vault-icon>
|
<td bitCell>
|
||||||
|
<app-vault-icon [cipher]="r"></app-vault-icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="reduced-lh wrap">
|
<td class="reduced-lh wrap">
|
||||||
<a href="#" appStopClick (click)="selectCipher(c)" title="{{ 'editItem' | i18n }}">{{
|
<a
|
||||||
c.name
|
href="#"
|
||||||
}}</a>
|
appStopClick
|
||||||
<ng-container *ngIf="!organization && c.organizationId">
|
(click)="selectCipher(r)"
|
||||||
|
title="{{ 'editItem' | i18n }}"
|
||||||
|
>{{ r.name }}</a
|
||||||
|
>
|
||||||
|
<ng-container *ngIf="!organization && r.organizationId">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-collection"
|
class="bwi bwi-collection"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -60,7 +62,7 @@
|
|||||||
></i>
|
></i>
|
||||||
<span class="sr-only">{{ "shared" | i18n }}</span>
|
<span class="sr-only">{{ "shared" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="c.hasAttachments">
|
<ng-container *ngIf="r.hasAttachments">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-paperclip"
|
class="bwi bwi-paperclip"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -70,14 +72,14 @@
|
|||||||
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<br />
|
<br />
|
||||||
<small>{{ c.subTitle }}</small>
|
<small>{{ r.subTitle }}</small>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<app-org-badge
|
<app-org-badge
|
||||||
*ngIf="!organization"
|
*ngIf="!organization"
|
||||||
[disabled]="disabled"
|
[disabled]="disabled"
|
||||||
[organizationId]="c.organizationId"
|
[organizationId]="r.organizationId"
|
||||||
[organizationName]="c.organizationId | orgNameFromId: (organizations$ | async)"
|
[organizationName]="r.organizationId | orgNameFromId: (organizations$ | async)"
|
||||||
appStopProp
|
appStopProp
|
||||||
>
|
>
|
||||||
</app-org-badge>
|
</app-org-badge>
|
||||||
@@ -85,17 +87,18 @@
|
|||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
<a
|
<a
|
||||||
bitBadge
|
bitBadge
|
||||||
href="{{ cipherDocs.get(c.id) }}"
|
href="{{ cipherDocs.get(r.id) }}"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noreferrer"
|
rel="noreferrer"
|
||||||
*ngIf="cipherDocs.has(c.id)"
|
*ngIf="cipherDocs.has(r.id)"
|
||||||
>
|
>
|
||||||
{{ "instructions" | i18n }}</a
|
{{ "instructions" | i18n }}</a
|
||||||
>
|
>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</ng-template>
|
||||||
</table>
|
</tbody></bit-table
|
||||||
|
>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<ng-template #cipherAddEdit></ng-template>
|
<ng-template #cipherAddEdit></ng-template>
|
||||||
|
|||||||
@@ -11,13 +11,13 @@
|
|||||||
<span class="sr-only">{{ "loading" | i18n }}</span>
|
<span class="sr-only">{{ "loading" | i18n }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-4" *ngIf="hasLoaded">
|
<div class="mt-4" *ngIf="hasLoaded">
|
||||||
<app-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
<bit-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
||||||
{{ "noReusedPasswords" | i18n }}
|
{{ "noReusedPasswords" | i18n }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
<ng-container *ngIf="ciphers.length">
|
<ng-container *ngIf="ciphers.length">
|
||||||
<app-callout type="danger" title="{{ 'reusedPasswordsFound' | i18n }}">
|
<bit-callout type="danger" title="{{ 'reusedPasswordsFound' | i18n }}">
|
||||||
{{ "reusedPasswordsFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
{{ "reusedPasswordsFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
|
|
||||||
<bit-toggle-group
|
<bit-toggle-group
|
||||||
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
||||||
@@ -33,36 +33,33 @@
|
|||||||
</ng-container>
|
</ng-container>
|
||||||
</bit-toggle-group>
|
</bit-toggle-group>
|
||||||
|
|
||||||
<table class="table table-hover table-list table-ciphers">
|
<bit-table [dataSource]="dataSource">
|
||||||
<thead
|
<ng-container header *ngIf="!isAdminConsoleActive">
|
||||||
class="tw-border-0 tw-border-b-2 tw-border-solid tw-border-secondary-300 tw-font-bold tw-text-muted"
|
|
||||||
*ngIf="!isAdminConsoleActive"
|
|
||||||
>
|
|
||||||
<tr>
|
<tr>
|
||||||
<th></th>
|
<th></th>
|
||||||
<th>{{ "name" | i18n }}</th>
|
<th>{{ "name" | i18n }}</th>
|
||||||
<th>{{ "owner" | i18n }}</th>
|
<th>{{ "owner" | i18n }}</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</ng-container>
|
||||||
<tbody>
|
<ng-template body let-rows$>
|
||||||
<tr *ngFor="let c of ciphers">
|
<tr bitRow *ngFor="let r of rows$ | async">
|
||||||
<td class="table-list-icon">
|
<td bitCell>
|
||||||
<app-vault-icon [cipher]="c"></app-vault-icon>
|
<app-vault-icon [cipher]="r"></app-vault-icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="reduced-lh wrap">
|
<td>
|
||||||
<ng-container *ngIf="!organization || canManageCipher(c); else cantManage">
|
<ng-container *ngIf="!organization || canManageCipher(r); else cantManage">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
appStopClick
|
appStopClick
|
||||||
(click)="selectCipher(c)"
|
(click)="selectCipher(r)"
|
||||||
title="{{ 'editItem' | i18n }}"
|
title="{{ 'editItem' | i18n }}"
|
||||||
>{{ c.name }}</a
|
>{{ r.name }}</a
|
||||||
>
|
>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-template #cantManage>
|
<ng-template #cantManage>
|
||||||
<span>{{ c.name }}</span>
|
<span>{{ r.name }}</span>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-container *ngIf="!organization && c.organizationId">
|
<ng-container *ngIf="!organization && r.organizationId">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-collection"
|
class="bwi bwi-collection"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -71,7 +68,7 @@
|
|||||||
></i>
|
></i>
|
||||||
<span class="sr-only">{{ "shared" | i18n }}</span>
|
<span class="sr-only">{{ "shared" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="c.hasAttachments">
|
<ng-container *ngIf="r.hasAttachments">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-paperclip"
|
class="bwi bwi-paperclip"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -81,26 +78,26 @@
|
|||||||
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<br />
|
<br />
|
||||||
<small>{{ c.subTitle }}</small>
|
<small>{{ r.subTitle }}</small>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<app-org-badge
|
<app-org-badge
|
||||||
*ngIf="!organization"
|
*ngIf="!organization"
|
||||||
[disabled]="disabled"
|
[disabled]="disabled"
|
||||||
[organizationId]="c.organizationId"
|
[organizationId]="r.organizationId"
|
||||||
[organizationName]="c.organizationId | orgNameFromId: (organizations$ | async)"
|
[organizationName]="r.organizationId | orgNameFromId: (organizations$ | async)"
|
||||||
appStopProp
|
appStopProp
|
||||||
>
|
>
|
||||||
</app-org-badge>
|
</app-org-badge>
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
<span bitBadge variant="warning">
|
<span bitBadge variant="warning">
|
||||||
{{ "reusedXTimes" | i18n: passwordUseMap.get(c.login.password) }}
|
{{ "reusedXTimes" | i18n: passwordUseMap.get(r.login.password) }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</ng-template>
|
||||||
</table>
|
</bit-table>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<ng-template #cipherAddEdit></ng-template>
|
<ng-template #cipherAddEdit></ng-template>
|
||||||
|
|||||||
@@ -43,6 +43,7 @@ export class ReusedPasswordsReportComponent extends CipherReportComponent implem
|
|||||||
|
|
||||||
async setCiphers() {
|
async setCiphers() {
|
||||||
const allCiphers = await this.getAllCiphers();
|
const allCiphers = await this.getAllCiphers();
|
||||||
|
|
||||||
const ciphersWithPasswords: CipherView[] = [];
|
const ciphersWithPasswords: CipherView[] = [];
|
||||||
this.passwordUseMap = new Map<string, number>();
|
this.passwordUseMap = new Map<string, number>();
|
||||||
this.filterStatus = [0];
|
this.filterStatus = [0];
|
||||||
|
|||||||
@@ -11,13 +11,13 @@
|
|||||||
<span class="sr-only">{{ "loading" | i18n }}</span>
|
<span class="sr-only">{{ "loading" | i18n }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-4" *ngIf="hasLoaded">
|
<div class="mt-4" *ngIf="hasLoaded">
|
||||||
<app-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
<bit-callout type="success" title="{{ 'goodNews' | i18n }}" *ngIf="!ciphers.length">
|
||||||
{{ "noWeakPasswords" | i18n }}
|
{{ "noWeakPasswords" | i18n }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
<ng-container *ngIf="ciphers.length">
|
<ng-container *ngIf="ciphers.length">
|
||||||
<app-callout type="danger" title="{{ 'weakPasswordsFound' | i18n }}">
|
<bit-callout type="danger" title="{{ 'weakPasswordsFound' | i18n }}">
|
||||||
{{ "weakPasswordsFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
{{ "weakPasswordsFoundReportDesc" | i18n: (ciphers.length | number) : vaultMsg }}
|
||||||
</app-callout>
|
</bit-callout>
|
||||||
<bit-toggle-group
|
<bit-toggle-group
|
||||||
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
*ngIf="showFilterToggle && !isAdminConsoleActive"
|
||||||
[selected]="filterOrgStatus$ | async"
|
[selected]="filterOrgStatus$ | async"
|
||||||
@@ -31,36 +31,33 @@
|
|||||||
</bit-toggle>
|
</bit-toggle>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</bit-toggle-group>
|
</bit-toggle-group>
|
||||||
<table class="table table-hover table-list table-ciphers">
|
<bit-table [dataSource]="dataSource">
|
||||||
<thead
|
<ng-container header *ngIf="!isAdminConsoleActive">
|
||||||
class="tw-border-0 tw-border-b-2 tw-border-solid tw-border-secondary-300 tw-font-bold tw-text-muted"
|
|
||||||
*ngIf="!isAdminConsoleActive"
|
|
||||||
>
|
|
||||||
<tr>
|
<tr>
|
||||||
<th></th>
|
<th></th>
|
||||||
<th>{{ "name" | i18n }}</th>
|
<th>{{ "name" | i18n }}</th>
|
||||||
<th>{{ "owner" | i18n }}</th>
|
<th>{{ "owner" | i18n }}</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</ng-container>
|
||||||
<tbody>
|
<ng-template body let-rows$>
|
||||||
<tr *ngFor="let c of ciphers">
|
<tr bitRow *ngFor="let r of rows$ | async">
|
||||||
<td class="table-list-icon">
|
<td bitCell>
|
||||||
<app-vault-icon [cipher]="c"></app-vault-icon>
|
<app-vault-icon [cipher]="r"></app-vault-icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="reduced-lh wrap">
|
<td class="reduced-lh wrap">
|
||||||
<ng-container *ngIf="!organization || canManageCipher(c); else cantManage">
|
<ng-container *ngIf="!organization || canManageCipher(r); else cantManage">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="#"
|
||||||
appStopClick
|
appStopClick
|
||||||
(click)="selectCipher(c)"
|
(click)="selectCipher(r)"
|
||||||
title="{{ 'editItem' | i18n }}"
|
title="{{ 'editItem' | i18n }}"
|
||||||
>{{ c.name }}</a
|
>{{ r.name }}</a
|
||||||
>
|
>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-template #cantManage>
|
<ng-template #cantManage>
|
||||||
<span>{{ c.name }}</span>
|
<span>{{ r.name }}</span>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-container *ngIf="!organization && c.organizationId">
|
<ng-container *ngIf="!organization && r.organizationId">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-collection"
|
class="bwi bwi-collection"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -69,7 +66,7 @@
|
|||||||
></i>
|
></i>
|
||||||
<span class="sr-only">{{ "shared" | i18n }}</span>
|
<span class="sr-only">{{ "shared" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="c.hasAttachments">
|
<ng-container *ngIf="r.hasAttachments">
|
||||||
<i
|
<i
|
||||||
class="bwi bwi-paperclip"
|
class="bwi bwi-paperclip"
|
||||||
appStopProp
|
appStopProp
|
||||||
@@ -79,26 +76,26 @@
|
|||||||
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
<span class="sr-only">{{ "attachments" | i18n }}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<br />
|
<br />
|
||||||
<small>{{ c.subTitle }}</small>
|
<small>{{ r.subTitle }}</small>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<app-org-badge
|
<app-org-badge
|
||||||
*ngIf="!organization"
|
*ngIf="!organization"
|
||||||
[disabled]="disabled"
|
[disabled]="disabled"
|
||||||
[organizationId]="c.organizationId"
|
[organizationId]="r.organizationId"
|
||||||
[organizationName]="c.organizationId | orgNameFromId: (organizations$ | async)"
|
[organizationName]="r.organizationId | orgNameFromId: (organizations$ | async)"
|
||||||
appStopProp
|
appStopProp
|
||||||
>
|
>
|
||||||
</app-org-badge>
|
</app-org-badge>
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
<span bitBadge [variant]="passwordStrengthMap.get(c.id)[1]">
|
<span bitBadge [variant]="passwordStrengthMap.get(r.id)[1]">
|
||||||
{{ passwordStrengthMap.get(c.id)[0] | i18n }}
|
{{ passwordStrengthMap.get(r.id)[0] | i18n }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</ng-template>
|
||||||
</table>
|
</bit-table>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<ng-template #cipherAddEdit></ng-template>
|
<ng-template #cipherAddEdit></ng-template>
|
||||||
|
|||||||
@@ -49,7 +49,7 @@ export class WeakPasswordsReportComponent extends CipherReportComponent implemen
|
|||||||
}
|
}
|
||||||
|
|
||||||
async setCiphers() {
|
async setCiphers() {
|
||||||
const allCiphers: any = await this.getAllCiphers();
|
const allCiphers = await this.getAllCiphers();
|
||||||
this.passwordStrengthCache = new Map<string, number>();
|
this.passwordStrengthCache = new Map<string, number>();
|
||||||
this.weakPasswordCiphers = [];
|
this.weakPasswordCiphers = [];
|
||||||
this.filterStatus = [0];
|
this.filterStatus = [0];
|
||||||
|
|||||||
Reference in New Issue
Block a user