[AC-1192] Create new device approvals component for TDE (#5548)

* Add feature flag route guard and tests

* Add additional test for not showing error toast

* Strengthen error toast test with message check

* Cleanup leaking test state in platformService mock

* Negate if statement to reduce nesting

* Update return type to CanActivateFn

* Use null check instead of undefined

* Introduce interface to support different feature flag types

- Switch to observable pattern to access serverConfig$ subject
- Add catchError handler to allow navigation in case of unexpected exception
- Add additional tests

* Add additional test for missing feature flag

* Remove subscription to the serverConfig observable

Introduce type checking logic to determine the appropriately typed flag getter to use in configService

* [AC-1192] Create initial device approvals component and route

* [AC-1192] Introduce appIfFeature directive for conditionally rendering content based on feature flags

* [AC-1192] Add DeviceApprovals link in Settings navigation

* Remove align middle from bitCell directive

The bitRow directive supports alignment for the entire row and should be used instead

* [AC-1192] Add initial device approvals page template

* [AC-1192] Introduce fingerprint pipe

* [AC-1192] Create core organization module in bitwarden_license directory

* [AC-1192] Add support for new Devices icon to no items component

- Add new Devices svg
- Make icon property of bit-no-items an Input property

* [AC-1192] Introduce organization-auth-request.service.ts with related views/responses

* [AC-1192] Display pending requests on device approvals page

- Add support for loading spinner and no items component

* [AC-1192] Add method to bulk deny auth requests

* [AC-1192] Add functionality to deny requests from device approvals page

* [AC-1192] Add organizationUserId to pending-auth-request.view.ts

* [AC-1192] Add approvePendingRequest method to organization-auth-request.service.ts

* [AC-1192] Add logic to approve a device approval request

* [AC-1192] Change bitMenuItem directive into a component and implement ButtonLikeAbstraction

Update the bitMenuItem to be a component and implement the ButtonLikeAbstraction to support the bitAction directive.

* [AC-1192] Update menu items to use bitActions

* [AC-1192] Update device approvals description copy

* [AC-1192] Revert changes to bitMenuItem directive

* [AC-1192] Rework menus to use click handlers

- Wrap async actions to catch/log any exceptions, set an in-progress state, and refresh after completion
- Show a loading spinner in the header when an action is in progress
- Disable all menu items when an action is in progress

* [AC-1192] Move Devices icon into admin-console web directory

* [AC-1192] bit-no-items formatting

* [AC-1192] Update appIfFeature directive to hide content on error

* [AC-1192] Remove deprecated providedIn for OrganizationAuthRequestService

* [AC-1192] Rename key to encryptedUserKey to be more descriptive

* [AC-1192] Cleanup loading/spinner logic on data refresh

* [AC-1192] Set middle as the default bitRow.alignContent

* [AC-1192] Change default alignRowContent for table story

* [AC-1192] Rename userId to fingerprintMaterial to be more general

The fingerprint material is not always the userId so this name is more general

* [AC-1192] Remove redundant alignContent attribute

* [AC-1192] Move fingerprint pipe to platform

libs/components/src/table/cell.directive.ts

@@ -1,10 +1,10 @@
-import { HostBinding, Directive } from "@angular/core";
+import { Directive, HostBinding } from "@angular/core";
 
 @Directive({
   selector: "th[bitCell], td[bitCell]",
 })
 export class CellDirective {
   @HostBinding("class") get classList() {
-    return ["tw-p-3", "tw-align-middle"];
+    return ["tw-p-3"];
   }
 }

libs/components/src/table/row.directive.ts

@@ -4,7 +4,7 @@ import { Directive, HostBinding, Input } from "@angular/core";
   selector: "tr[bitRow]",
 })
 export class RowDirective {
-  @Input() alignContent: "top" | "middle" | "bottom" | "baseline" = "baseline";
+  @Input() alignContent: "top" | "middle" | "bottom" | "baseline" = "middle";
 
   get alignmentClass(): string {
     switch (this.alignContent) {

libs/components/src/table/table.stories.ts

@@ -1,5 +1,5 @@
 import { ScrollingModule } from "@angular/cdk/scrolling";
-import { Meta, StoryObj, moduleMetadata } from "@storybook/angular";
+import { Meta, moduleMetadata, StoryObj } from "@storybook/angular";
 
 import { countries } from "../form/countries";
 
@@ -62,7 +62,7 @@ export const Default: Story = {
     `,
   }),
   args: {
-    alignRowContent: "baseline",
+    alignRowContent: "middle",
   },
 };