mgr/dashboard : update telemetry notification for simple mode

fixes : https://tracker.ceph.com/issues/75157
Signed-off-by: Abhishek Desai <abhishek.desai1@ibm.com>
(cherry picked from commit ca33149372fde85da64b9817316485ed161f66a6)

 Conflicts:
	src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/dashboard/dashboard.component.html
	src/pybind/mgr/dashboard/frontend/src/app/core/layouts/workbench-layout/workbench-layout.component.ts

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/dashboard/dashboard.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/dashboard/dashboard.component.html
index 482280560cd74331f626bd1fe5a37a082acb02f1..b55baf32f1dde415f83a984cce8ffa80ec2667e8 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/dashboard/dashboard.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/dashboard/dashboard.component.html
@@ -10,6 +10,6 @@
   </ng-container>
 
   <ng-template #dashboardV3>
-    <cd-overview></cd-overview>
+    <cd-dashboard-v3></cd-dashboard-v3>
   </ng-template>
 </main>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/layouts/workbench-layout/workbench-layout.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/layouts/workbench-layout/workbench-layout.component.ts
index 230e6e7ae44599880ec6d9cebf9d9f345a864bdf..d7983d6247f7958204eafcf70f25db63de15aff5 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/core/layouts/workbench-layout/workbench-layout.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/core/layouts/workbench-layout/workbench-layout.component.ts
@@ -1,7 +1,8 @@
 import { Component, HostBinding, OnDestroy, OnInit } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRouteSnapshot, NavigationEnd, Router } from '@angular/router';
 
-import { Subscription } from 'rxjs';
+import { Observable, Subscription } from 'rxjs';
+import { filter } from 'rxjs/operators';
 import { MultiClusterService } from '~/app/shared/api/multi-cluster.service';
 import { Permissions } from '~/app/shared/models/permissions';
 import { AuthStorageService } from '~/app/shared/services/auth-storage.service';
@@ -11,18 +12,27 @@ import { SummaryService } from '~/app/shared/services/summary.service';
 import { TaskManagerService } from '~/app/shared/services/task-manager.service';
 import { TelemetryNotificationService } from '../../../shared/services/telemetry-notification.service';
 import { MotdNotificationService } from '~/app/shared/services/motd-notification.service';
+import {
+  FeatureTogglesMap,
+  FeatureTogglesService
+} from '~/app/shared/services/feature-toggles.service';
 import _ from 'lodash';
 
 @Component({
   selector: 'cd-workbench-layout',
   templateUrl: './workbench-layout.component.html',
   styleUrls: ['./workbench-layout.component.scss'],
-  providers: [FaviconService]
+  providers: [FaviconService],
+  standalone: false
 })
 export class WorkbenchLayoutComponent implements OnInit, OnDestroy {
   notifications: string[] = [];
   private subs = new Subscription();
   permissions: Permissions;
+  pageHeaderTitle: string | null = null;
+  pageHeaderDescription: string | null = null;
+  enabledFeature$: Observable<FeatureTogglesMap>;
+
   @HostBinding('class') get class(): string {
     return 'top-notification-' + this.notifications.length;
   }
@@ -35,9 +45,11 @@ export class WorkbenchLayoutComponent implements OnInit, OnDestroy {
     private faviconService: FaviconService,
     private authStorageService: AuthStorageService,
     private telemetryNotificationService: TelemetryNotificationService,
-    private motdNotificationService: MotdNotificationService
+    private motdNotificationService: MotdNotificationService,
+    private featureTogglesService: FeatureTogglesService
   ) {
     this.permissions = this.authStorageService.getPermissions();
+    this.enabledFeature$ = this.featureTogglesService.get();
   }
 
   ngOnInit() {
@@ -64,7 +76,27 @@ export class WorkbenchLayoutComponent implements OnInit, OnDestroy {
       })
     );
     this.faviconService.init();
+
+    this.updatePageHeaderFromRoute();
+    this.subs.add(
+      this.router.events
+        .pipe(filter((e) => e instanceof NavigationEnd))
+        .subscribe(() => this.updatePageHeaderFromRoute())
+    );
   }
+
+  private updatePageHeaderFromRoute(): void {
+    let route: ActivatedRouteSnapshot | null = this.router.routerState.snapshot.root;
+    while (route?.firstChild) {
+      route = route.firstChild;
+    }
+    const pageHeader = route?.routeConfig?.data?.['pageHeader'] as
+      | { title?: string; description?: string }
+      | undefined;
+    this.pageHeaderTitle = pageHeader?.title ?? null;
+    this.pageHeaderDescription = pageHeader?.description ?? null;
+  }
+
   showTopNotification(name: string, isDisplayed: boolean) {
     if (isDisplayed) {
       if (!this.notifications.includes(name)) {

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.html
index 9af7958370a79d6f167dc362b1720b8f7bcd06f0..444724d67235b2f74a69893e9646230fdcc1205f 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.html
@@ -4,9 +4,13 @@
                 size="slim"
                 [type]="notificationSeverity"
                 [dismissible]="notificationSeverity !== 'danger'"
+                [actionName]="'Configure Telemetry'"
+                (action)="onConfigure()"
                 (dismissed)="onDismissed()">
-  <div i18n>The Ceph community needs your help to continue improving: please
-    <a routerLink="/telemetry"
-       class="btn activate-button alert-link activate-text">Activate</a> the
-  <a href="https://docs.ceph.com/en/latest/mgr/telemetry/">Telemetry</a> module.</div>
+  <span i18n>Activate
+    <a href="https://docs.ceph.com/en/latest/mgr/telemetry/"
+       target="_blank"
+       rel="noopener"> Telemetry
+    </a>: The Ceph community welcomes your support in enhancing our efforts. Please activate the telemetry module.
+  </span>
 </cd-alert-panel>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.ts
index 33174ce11d2c61263aeb9ab74f955f1e81f3899c..0b61d9593ab68230ef1b352f71cea969ff8757ce 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/telemetry-notification/telemetry-notification.component.ts
@@ -1,4 +1,5 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
 
 import _ from 'lodash';
 
@@ -15,13 +16,14 @@ import { TelemetryNotificationService } from '~/app/shared/services/telemetry-no
 })
 export class TelemetryNotificationComponent implements OnInit, OnDestroy {
   displayNotification = false;
-  notificationSeverity = 'warning';
+  notificationSeverity = 'info';
 
   constructor(
     private mgrModuleService: MgrModuleService,
     private authStorageService: AuthStorageService,
     private notificationService: NotificationService,
-    private telemetryNotificationService: TelemetryNotificationService
+    private telemetryNotificationService: TelemetryNotificationService,
+    private router: Router
   ) {}
 
   ngOnInit() {
@@ -59,4 +61,8 @@ export class TelemetryNotificationComponent implements OnInit, OnDestroy {
 page (<b>Dashboard Settings</b> -> <b>Telemetry configuration</b>) at any time.`
     );
   }
+
+  onConfigure(): void {
+    this.router.navigate(['/telemetry']);
+  }
 }