diff --git a/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html b/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html index 520dd039d1..738b343389 100644 --- a/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html +++ b/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html @@ -16,6 +16,16 @@ + + + + + + + {{ "criticalApplicationsWithCount" | i18n: criticalApps.length }} + + + @@ -25,19 +35,7 @@ - - - - {{ "application" | i18n }} - {{ "atRiskPasswords" | i18n }} - {{ "totalPasswords" | i18n }} - {{ "atRiskMembers" | i18n }} - {{ "totalMembers" | i18n }} - - - diff --git a/apps/web/src/app/tools/access-intelligence/application-table.component.ts b/apps/web/src/app/tools/access-intelligence/application-table.component.ts deleted file mode 100644 index 79b8500b8c..0000000000 --- a/apps/web/src/app/tools/access-intelligence/application-table.component.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { CommonModule } from "@angular/common"; -import { Component } from "@angular/core"; - -import { JslibModule } from "@bitwarden/angular/jslib.module"; -import { TableDataSource, TableModule } from "@bitwarden/components"; - -@Component({ - standalone: true, - selector: "tools-application-table", - templateUrl: "./application-table.component.html", - imports: [CommonModule, JslibModule, TableModule], -}) -export class ApplicationTableComponent { - protected dataSource = new TableDataSource(); - - constructor() { - this.dataSource.data = []; - } -} diff --git a/apps/web/src/app/tools/access-intelligence/application-table.mock.ts b/apps/web/src/app/tools/access-intelligence/application-table.mock.ts new file mode 100644 index 0000000000..4df363ab2c --- /dev/null +++ b/apps/web/src/app/tools/access-intelligence/application-table.mock.ts @@ -0,0 +1,50 @@ +export const applicationTableMockData = [ + { + id: 1, + name: "google.com", + atRiskPasswords: 4, + totalPasswords: 10, + atRiskMembers: 2, + totalMembers: 5, + }, + { + id: 2, + name: "facebook.com", + atRiskPasswords: 3, + totalPasswords: 8, + atRiskMembers: 1, + totalMembers: 3, + }, + { + id: 3, + name: "twitter.com", + atRiskPasswords: 2, + totalPasswords: 6, + atRiskMembers: 0, + totalMembers: 2, + }, + { + id: 4, + name: "linkedin.com", + atRiskPasswords: 1, + totalPasswords: 4, + atRiskMembers: 0, + totalMembers: 1, + }, + { + id: 5, + name: "instagram.com", + atRiskPasswords: 0, + totalPasswords: 2, + atRiskMembers: 0, + totalMembers: 0, + }, + { + id: 6, + name: "tiktok.com", + atRiskPasswords: 0, + totalPasswords: 1, + atRiskMembers: 0, + totalMembers: 0, + }, +]; diff --git a/apps/web/src/app/tools/access-intelligence/critical-applications.component.html b/apps/web/src/app/tools/access-intelligence/critical-applications.component.html new file mode 100644 index 0000000000..e03988fbf9 --- /dev/null +++ b/apps/web/src/app/tools/access-intelligence/critical-applications.component.html @@ -0,0 +1,97 @@ +
+ + {{ "loading" | i18n }} +
+
+ + +

+ {{ "noCriticalAppsTitle" | i18n }} +

+
+ +

+ {{ "noCriticalAppsDescription" | i18n }} +

+
+ + + +
+
+
+
+

{{ "criticalApplications" | i18n }}

+ +
+
+ + + + +
+
+ +
+ + + + + {{ "application" | i18n }} + {{ "atRiskPasswords" | i18n }} + {{ "totalPasswords" | i18n }} + {{ "atRiskMembers" | i18n }} + {{ "totalMembers" | i18n }} + + + + + + + + + {{ r.name }} + + + + {{ r.atRiskPasswords }} + + + + + {{ r.totalPasswords }} + + + + + {{ r.atRiskMembers }} + + + + {{ r.totalMembers }} + + + + +
diff --git a/apps/web/src/app/tools/access-intelligence/critical-applications.component.ts b/apps/web/src/app/tools/access-intelligence/critical-applications.component.ts new file mode 100644 index 0000000000..545ba14d21 --- /dev/null +++ b/apps/web/src/app/tools/access-intelligence/critical-applications.component.ts @@ -0,0 +1,57 @@ +import { Component, DestroyRef, inject, OnInit } from "@angular/core"; +import { takeUntilDestroyed } from "@angular/core/rxjs-interop"; +import { FormControl } from "@angular/forms"; +import { ActivatedRoute } from "@angular/router"; +import { debounceTime, map } from "rxjs"; + +import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; +import { SearchModule, TableDataSource, NoItemsModule, Icons } from "@bitwarden/components"; +import { CardComponent } from "@bitwarden/tools-card"; + +import { HeaderModule } from "../../layouts/header/header.module"; +import { SharedModule } from "../../shared"; +import { PipesModule } from "../../vault/individual-vault/pipes/pipes.module"; + +import { applicationTableMockData } from "./application-table.mock"; + +@Component({ + standalone: true, + selector: "tools-critical-applications", + templateUrl: "./critical-applications.component.html", + imports: [CardComponent, HeaderModule, SearchModule, NoItemsModule, PipesModule, SharedModule], +}) +export class CriticalApplicationsComponent implements OnInit { + protected dataSource = new TableDataSource(); + protected selectedIds: Set = new Set(); + protected searchControl = new FormControl("", { nonNullable: true }); + private destroyRef = inject(DestroyRef); + protected loading = false; + noItemsIcon = Icons.Security; + // MOCK DATA + protected mockAtRiskMembersCount = 0; + protected mockAtRiskAppsCount = 0; + protected mockTotalMembersCount = 0; + protected mockTotalAppsCount = 0; + + ngOnInit() { + this.activatedRoute.paramMap + .pipe( + takeUntilDestroyed(this.destroyRef), + map(async (params) => { + // const organizationId = params.get("organizationId"); + // TODO: use organizationId to fetch data + }), + ) + .subscribe(); + } + + constructor( + protected i18nService: I18nService, + protected activatedRoute: ActivatedRoute, + ) { + this.dataSource.data = applicationTableMockData; + this.searchControl.valueChanges + .pipe(debounceTime(200), takeUntilDestroyed()) + .subscribe((v) => (this.dataSource.filter = v)); + } +} diff --git a/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.html b/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.html deleted file mode 100644 index 9c3b4f4891..0000000000 --- a/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.html +++ /dev/null @@ -1,15 +0,0 @@ - - -

- {{ "noPriorityApplicationsTitle" | i18n }} -

-
- -

- {{ "noPriorityApplicationsDescription" | i18n }} -

-
- - - -
diff --git a/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.ts b/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.ts deleted file mode 100644 index d0f53d0942..0000000000 --- a/apps/web/src/app/tools/access-intelligence/no-priority-apps.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { CommonModule } from "@angular/common"; -import { Component } from "@angular/core"; - -import { JslibModule } from "@bitwarden/angular/jslib.module"; -import { ButtonModule, NoItemsModule, Icons } from "@bitwarden/components"; - -@Component({ - standalone: true, - selector: "tools-no-priority-apps", - templateUrl: "no-priority-apps.component.html", - imports: [ButtonModule, CommonModule, JslibModule, NoItemsModule], -}) -export class NoPriorityAppsComponent { - noItemsIcon = Icons.Security; -} diff --git a/apps/web/src/app/tools/access-intelligence/password-health-members.component.html b/apps/web/src/app/tools/access-intelligence/password-health-members.component.html index ca2936b282..611443c993 100644 --- a/apps/web/src/app/tools/access-intelligence/password-health-members.component.html +++ b/apps/web/src/app/tools/access-intelligence/password-health-members.component.html @@ -7,9 +7,6 @@ > {{ "loading" | i18n }} -
- -