[EC-526] Default to Event Logs page for Reporting Tab (#3470)

* [EC-526] Default to the Events Logs page when navigating to the Reporting tab

* [EC-526] Undo default routing redirect when the child path is missing. Avoids defaulting to "/events" in case a user/org doesn't have access to event logs.

apps/web/src/app/organizations/layouts/organization-layout.component.html

@@ -14,7 +14,7 @@
         <bit-tab-item *ngIf="showGroupsTab" [route]="['groups']">{{
           "groups" | i18n
         }}</bit-tab-item>
-        <bit-tab-item *ngIf="showReportsTab" [route]="['reporting']">{{
+        <bit-tab-item *ngIf="showReportsTab" [route]="[reportRoute]">{{
           reportTabLabel | i18n
         }}</bit-tab-item>
         <bit-tab-item *ngIf="showBillingTab" [route]="['billing']">{{

apps/web/src/app/organizations/layouts/organization-layout.component.ts

@@ -1,5 +1,6 @@
 import { Component, NgZone, OnDestroy, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
+import { concatMap, Subject, takeUntil } from "rxjs";
 
 import { BroadcasterService } from "@bitwarden/common/abstractions/broadcaster.service";
 import { OrganizationService } from "@bitwarden/common/abstractions/organization.service";
@@ -20,9 +21,10 @@ const BroadcasterSubscriptionId = "OrganizationLayoutComponent";
   templateUrl: "organization-layout.component.html",
 })
 export class OrganizationLayoutComponent implements OnInit, OnDestroy {
-  organization: Organization;
-  businessTokenPromise: Promise<any>;
   private organizationId: string;
+  private destroy$ = new Subject<void>();
+
+  organization: Organization;
 
   constructor(
     private route: ActivatedRoute,
@@ -33,11 +35,16 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
 
   ngOnInit() {
     document.body.classList.remove("layout_frontend");
-    // eslint-disable-next-line rxjs-angular/prefer-takeuntil, rxjs/no-async-subscribe
+    this.route.params
-    this.route.params.subscribe(async (params: any) => {
+      .pipe(
-      this.organizationId = params.organizationId;
+        concatMap(async (params: any) => {
-      await this.load();
+          this.organizationId = params.organizationId;
-    });
+          await this.load();
+        }),
+        takeUntil(this.destroy$)
+      )
+      .subscribe();
+
     this.broadcasterService.subscribe(BroadcasterSubscriptionId, (message: any) => {
       this.ngZone.run(async () => {
         switch (message.command) {
@@ -51,6 +58,8 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
 
   ngOnDestroy() {
     this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
+    this.destroy$.next();
+    this.destroy$.complete();
   }
 
   async load() {
@@ -80,4 +89,8 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
   get reportTabLabel(): string {
     return this.organization.useEvents ? "reporting" : "reports";
   }
+
+  get reportRoute(): string {
+    return this.organization.useEvents ? "reporting/events" : "reporting/reports";
+  }
 }