[PM-14266] - access intelligence - application table (#11801)

* add application table

* add critical applications tab

* add button. update copy

apps/web/src/app/tools/access-intelligence/all-applications.component.ts

@@ -0,0 +1,106 @@
+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, firstValueFrom, map } from "rxjs";
+
+import { AuditService } from "@bitwarden/common/abstractions/audit.service";
+import { OrganizationService } from "@bitwarden/common/admin-console/abstractions/organization/organization.service.abstraction";
+import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { PasswordStrengthServiceAbstraction } from "@bitwarden/common/tools/password-strength";
+import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.service";
+import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
+import {
+  Icons,
+  NoItemsModule,
+  SearchModule,
+  TableDataSource,
+  ToastService,
+} 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-all-applications",
+  templateUrl: "./all-applications.component.html",
+  imports: [HeaderModule, CardComponent, SearchModule, PipesModule, NoItemsModule, SharedModule],
+})
+export class AllApplicationsComponent implements OnInit {
+  protected dataSource = new TableDataSource<any>();
+  protected selectedIds: Set<number> = new Set<number>();
+  protected searchControl = new FormControl("", { nonNullable: true });
+  private destroyRef = inject(DestroyRef);
+  protected loading = false;
+  protected organization: Organization;
+  noItemsIcon = Icons.Security;
+
+  // MOCK DATA
+  protected mockData = applicationTableMockData;
+  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");
+          this.organization = await firstValueFrom(this.organizationService.get$(organizationId));
+          // TODO: use organizationId to fetch data
+        }),
+      )
+      .subscribe();
+  }
+
+  constructor(
+    protected cipherService: CipherService,
+    protected passwordStrengthService: PasswordStrengthServiceAbstraction,
+    protected auditService: AuditService,
+    protected i18nService: I18nService,
+    protected activatedRoute: ActivatedRoute,
+    protected toastService: ToastService,
+    protected organizationService: OrganizationService,
+  ) {
+    this.dataSource.data = applicationTableMockData;
+    this.searchControl.valueChanges
+      .pipe(debounceTime(200), takeUntilDestroyed())
+      .subscribe((v) => (this.dataSource.filter = v));
+  }
+
+  markAppsAsCritical = async () => {
+    // TODO: Send to API once implemented
+    return new Promise((resolve) => {
+      setTimeout(() => {
+        this.selectedIds.clear();
+        this.toastService.showToast({
+          variant: "success",
+          title: null,
+          message: this.i18nService.t("appsMarkedAsCritical"),
+        });
+        resolve(true);
+      }, 1000);
+    });
+  };
+
+  trackByFunction(_: number, item: CipherView) {
+    return item.id;
+  }
+
+  onCheckboxChange(id: number, event: Event) {
+    const isChecked = (event.target as HTMLInputElement).checked;
+    if (isChecked) {
+      this.selectedIds.add(id);
+    } else {
+      this.selectedIds.delete(id);
+    }
+  }
+}