]>
Commit | Line | Data |
---|---|---|
1911f103 TL |
1 | import { Component, HostBinding, OnDestroy, OnInit } from '@angular/core'; |
2 | ||
3 | import { Subscription } from 'rxjs'; | |
11fdf7f2 | 4 | |
f67539c2 TL |
5 | import { Icons } from '~/app/shared/enum/icons.enum'; |
6 | import { Permissions } from '~/app/shared/models/permissions'; | |
7 | import { AuthStorageService } from '~/app/shared/services/auth-storage.service'; | |
11fdf7f2 TL |
8 | import { |
9 | FeatureTogglesMap$, | |
10 | FeatureTogglesService | |
f67539c2 TL |
11 | } from '~/app/shared/services/feature-toggles.service'; |
12 | import { PrometheusAlertService } from '~/app/shared/services/prometheus-alert.service'; | |
13 | import { SummaryService } from '~/app/shared/services/summary.service'; | |
14 | import { TelemetryNotificationService } from '~/app/shared/services/telemetry-notification.service'; | |
11fdf7f2 TL |
15 | |
16 | @Component({ | |
17 | selector: 'cd-navigation', | |
18 | templateUrl: './navigation.component.html', | |
19 | styleUrls: ['./navigation.component.scss'] | |
20 | }) | |
1911f103 | 21 | export class NavigationComponent implements OnInit, OnDestroy { |
f6b5b4d7 TL |
22 | notifications: string[] = []; |
23 | @HostBinding('class') get class(): string { | |
24 | return 'top-notification-' + this.notifications.length; | |
25 | } | |
9f95a23c | 26 | |
11fdf7f2 | 27 | permissions: Permissions; |
9f95a23c | 28 | enabledFeature$: FeatureTogglesMap$; |
11fdf7f2 | 29 | summaryData: any; |
9f95a23c | 30 | icons = Icons; |
11fdf7f2 | 31 | |
b3b6e05e | 32 | rightSidebarOpen = false; // rightSidebar only opens when width is less than 768px |
9f95a23c TL |
33 | showMenuSidebar = true; |
34 | displayedSubMenu = ''; | |
35 | ||
36 | simplebar = { | |
37 | autoHide: false | |
38 | }; | |
1911f103 | 39 | private subs = new Subscription(); |
11fdf7f2 TL |
40 | |
41 | constructor( | |
42 | private authStorageService: AuthStorageService, | |
11fdf7f2 | 43 | private summaryService: SummaryService, |
e306af50 | 44 | private featureToggles: FeatureTogglesService, |
f6b5b4d7 | 45 | private telemetryNotificationService: TelemetryNotificationService, |
e306af50 | 46 | public prometheusAlertService: PrometheusAlertService |
11fdf7f2 TL |
47 | ) { |
48 | this.permissions = this.authStorageService.getPermissions(); | |
49 | this.enabledFeature$ = this.featureToggles.get(); | |
50 | } | |
51 | ||
52 | ngOnInit() { | |
1911f103 | 53 | this.subs.add( |
f6b5b4d7 TL |
54 | this.summaryService.subscribe((summary) => { |
55 | this.summaryData = summary; | |
1911f103 TL |
56 | }) |
57 | ); | |
f6b5b4d7 TL |
58 | /* |
59 | Note: If you're going to add more top notifications please do not forget to increase | |
60 | the number of generated css-classes in section topNotification settings in the scss | |
61 | file. | |
62 | */ | |
1911f103 TL |
63 | this.subs.add( |
64 | this.authStorageService.isPwdDisplayed$.subscribe((isDisplayed) => { | |
f6b5b4d7 TL |
65 | this.showTopNotification('isPwdDisplayed', isDisplayed); |
66 | }) | |
67 | ); | |
68 | this.subs.add( | |
69 | this.telemetryNotificationService.update.subscribe((visible: boolean) => { | |
70 | this.showTopNotification('telemetryNotificationEnabled', visible); | |
1911f103 TL |
71 | }) |
72 | ); | |
73 | } | |
74 | ||
75 | ngOnDestroy(): void { | |
76 | this.subs.unsubscribe(); | |
11fdf7f2 TL |
77 | } |
78 | ||
79 | blockHealthColor() { | |
80 | if (this.summaryData && this.summaryData.rbd_mirroring) { | |
81 | if (this.summaryData.rbd_mirroring.errors > 0) { | |
82 | return { color: '#d9534f' }; | |
83 | } else if (this.summaryData.rbd_mirroring.warnings > 0) { | |
84 | return { color: '#f0ad4e' }; | |
85 | } | |
86 | } | |
9f95a23c TL |
87 | |
88 | return undefined; | |
89 | } | |
90 | ||
91 | toggleSubMenu(menu: string) { | |
92 | if (this.displayedSubMenu === menu) { | |
93 | this.displayedSubMenu = ''; | |
94 | } else { | |
95 | this.displayedSubMenu = menu; | |
96 | } | |
11fdf7f2 | 97 | } |
f6b5b4d7 | 98 | |
b3b6e05e TL |
99 | toggleRightSidebar() { |
100 | this.rightSidebarOpen = !this.rightSidebarOpen; | |
101 | } | |
102 | ||
f6b5b4d7 TL |
103 | showTopNotification(name: string, isDisplayed: boolean) { |
104 | if (isDisplayed) { | |
105 | if (!this.notifications.includes(name)) { | |
106 | this.notifications.push(name); | |
107 | } | |
108 | } else { | |
109 | const index = this.notifications.indexOf(name); | |
110 | if (index >= 0) { | |
111 | this.notifications.splice(index, 1); | |
112 | } | |
113 | } | |
114 | } | |
11fdf7f2 | 115 | } |