From 9c7d7fe703ec3eaca6d4500685cbac6bde389ba8 Mon Sep 17 00:00:00 2001
From: Shane Melton <smelton@bitwarden.com>
Date: Tue, 12 Jul 2022 17:05:51 -0700
Subject: [PATCH] Use correct report label/layout by product type

---
 .../layouts/organization-layout.component.html              | 2 +-
 .../organizations/layouts/organization-layout.component.ts  | 6 +++++-
 .../app/organizations/reporting/reporting.component.html    | 4 ++--
 .../src/app/organizations/reporting/reporting.component.ts  | 3 ++-
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/apps/web/src/app/organizations/layouts/organization-layout.component.html b/apps/web/src/app/organizations/layouts/organization-layout.component.html
index 2b9458df92..7ace39b7fc 100644
--- a/apps/web/src/app/organizations/layouts/organization-layout.component.html
+++ b/apps/web/src/app/organizations/layouts/organization-layout.component.html
@@ -15,7 +15,7 @@
           "groups" | i18n
         }}</bit-tab-item>
         <bit-tab-item *ngIf="showReportsTab" [route]="['reporting']">{{
-          "reporting" | i18n
+          reportTabLabel | i18n
         }}</bit-tab-item>
         <bit-tab-item *ngIf="showBillingTab" [route]="['billing']">{{
           "billing" | i18n
diff --git a/apps/web/src/app/organizations/layouts/organization-layout.component.ts b/apps/web/src/app/organizations/layouts/organization-layout.component.ts
index fc0275184a..04d9f36f0e 100644
--- a/apps/web/src/app/organizations/layouts/organization-layout.component.ts
+++ b/apps/web/src/app/organizations/layouts/organization-layout.component.ts
@@ -67,7 +67,7 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
   }
 
   get showGroupsTab(): boolean {
-    return this.organization.canManageGroups;
+    return this.organization.useGroups && this.organization.canManageGroups;
   }
 
   get showReportsTab(): boolean {
@@ -78,6 +78,10 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
     return this.organization.canManageBilling;
   }
 
+  get reportTabLabel(): string {
+    return this.organization.useEvents ? "reporting" : "reports";
+  }
+
   get toolsRoute(): string {
     return this.organization.canAccessImportExport
       ? "tools/import"
diff --git a/apps/web/src/app/organizations/reporting/reporting.component.html b/apps/web/src/app/organizations/reporting/reporting.component.html
index 8f5bac5fc8..975d34e76f 100644
--- a/apps/web/src/app/organizations/reporting/reporting.component.html
+++ b/apps/web/src/app/organizations/reporting/reporting.component.html
@@ -1,6 +1,6 @@
 <div class="container page-content">
   <div class="row">
-    <div class="col-3">
+    <div class="col-3" *ngIf="showLeftNav">
       <div class="card" *ngIf="organization">
         <div class="card-header">{{ "reporting" | i18n }}</div>
         <div class="list-group list-group-flush">
@@ -23,7 +23,7 @@
         </div>
       </div>
     </div>
-    <div class="col-9">
+    <div class="col-9" [ngClass]="showLeftNav ? 'col-9' : 'col-12'">
       <router-outlet></router-outlet>
     </div>
   </div>
diff --git a/apps/web/src/app/organizations/reporting/reporting.component.ts b/apps/web/src/app/organizations/reporting/reporting.component.ts
index 29ae5fe723..4173833b61 100644
--- a/apps/web/src/app/organizations/reporting/reporting.component.ts
+++ b/apps/web/src/app/organizations/reporting/reporting.component.ts
@@ -11,13 +11,14 @@ import { Organization } from "@bitwarden/common/models/domain/organization";
 export class ReportingComponent implements OnInit {
   organization: Organization;
   accessEvents = false;
+  showLeftNav = true;
 
   constructor(private route: ActivatedRoute, private organizationService: OrganizationService) {}
 
   ngOnInit() {
     this.route.parent.params.subscribe(async (params) => {
       this.organization = await this.organizationService.get(params.organizationId);
-      this.accessEvents = this.organization.useEvents;
+      this.accessEvents = this.showLeftNav = this.organization.useEvents;
     });
   }
 }