diff --git a/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.ts b/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.ts index 7b262b41f0..6c35641348 100644 --- a/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.ts +++ b/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.ts @@ -92,7 +92,7 @@ export class NotificationBellComponent implements OnDestroy { }, {maxHeight: '90vh', height: '100%', padding: '10px'}, {width: '400px', minWidth: '100%', maxWidth: '100%'}, - {height: '100%', flexDirection: 'column', boxSizing: 'border-box', display: 'flex'}, false); + {height: '100%', flexDirection: 'column', boxSizing: 'border-box', display: 'flex', margin: '0 -16px'}, false); showNotificationPopover.tbComponentRef.instance.popoverComponent = showNotificationPopover; } } diff --git a/ui-ngx/src/app/modules/home/components/notification/show-notification-popover.component.html b/ui-ngx/src/app/modules/home/components/notification/show-notification-popover.component.html index 57288cc5a7..096cecd91a 100644 --- a/ui-ngx/src/app/modules/home/components/notification/show-notification-popover.component.html +++ b/ui-ngx/src/app/modules/home/components/notification/show-notification-popover.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
notification.notification
-
- {{ notification.createdTime ?? currentDate | dateAgo }} - -
+ {{ notification.createdTime ?? currentDate | dateAgo }} +
diff --git a/ui-ngx/src/app/shared/components/notification/notification.component.scss b/ui-ngx/src/app/shared/components/notification/notification.component.scss index ec72e21b12..f73b3cc137 100644 --- a/ui-ngx/src/app/shared/components/notification/notification.component.scss +++ b/ui-ngx/src/app/shared/components/notification/notification.component.scss @@ -16,7 +16,7 @@ :host { .notification { - padding: 10px; + padding: 10px 0 10px 10px; display: block; border: 1px solid; border-radius: 4px; @@ -51,14 +51,11 @@ min-width: 70px; color: rgba(0, 0, 0, 0.54); - .mark-read { - margin-bottom: 6px; - } - .time { font-size: 12px; letter-spacing: 0.25px; - margin: 0 4px; + margin-right: 12px; + margin-top: 4px; } .alarm-severity { diff --git a/ui-ngx/src/app/shared/components/notification/notification.component.ts b/ui-ngx/src/app/shared/components/notification/notification.component.ts index 4a5dd20a85..e002cdb395 100644 --- a/ui-ngx/src/app/shared/components/notification/notification.component.ts +++ b/ui-ngx/src/app/shared/components/notification/notification.component.ts @@ -109,7 +109,7 @@ export class NotificationComponent implements OnInit { stateObject.id = this.notification.additionalConfig.actionButtonConfig.dashboardState; state = objToBase64URI([ stateObject ]); } - link = `/dashboards/${this.notification.additionalConfig.actionButtonConfig.dashboardId}` + link = `/dashboards/${this.notification.additionalConfig.actionButtonConfig.dashboardId}`; if (state) { link += `?state=${state}`; } diff --git a/ui-ngx/src/app/shared/components/slack-conversation-autocomplete.component.ts b/ui-ngx/src/app/shared/components/slack-conversation-autocomplete.component.ts index fcd573ec69..6d314fdf12 100644 --- a/ui-ngx/src/app/shared/components/slack-conversation-autocomplete.component.ts +++ b/ui-ngx/src/app/shared/components/slack-conversation-autocomplete.component.ts @@ -17,7 +17,7 @@ import { Component, ElementRef, forwardRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core'; import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms'; import { Observable, of, ReplaySubject } from 'rxjs'; -import { debounceTime, map, share, switchMap, tap } from 'rxjs/operators'; +import { catchError, debounceTime, map, share, switchMap, tap } from 'rxjs/operators'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { TranslateService } from '@ngx-translate/core'; @@ -201,6 +201,7 @@ export class SlackConversationAutocompleteComponent implements ControlValueAcces fetchObservable = of([]); } this.slackConversetionFetchObservable$ = fetchObservable.pipe( + catchError(() => of([])), share({ connector: () => new ReplaySubject(1), resetOnError: false,