From 16467b8918b3a4a74c9bfc78cf374627fbde635f Mon Sep 17 00:00:00 2001 From: Henriette Darge Date: Tue, 19 Oct 2021 09:32:55 +0200 Subject: [PATCH] Use no_results component for notification center page. Therefore the HTML of the no-results box was a bit harmonised throughout the system. --- config/locales/js-en.yml | 8 ++++++-- .../in-app-notification-center.component.html | 14 ++++++------- .../in-app-notification-center.component.ts | 20 +++++++++++++------ .../no-results/no-results.component.html | 8 ++++++-- .../no-results/no-results.component.ts | 2 ++ frontend/src/global_styles/content/_table.lsg | 4 ++-- .../src/global_styles/content/_table.sass | 12 ++++++----- .../content/work_packages/_table_content.lsg | 4 ++-- modules/reporting/lib/widget/table.rb | 2 +- 9 files changed, 46 insertions(+), 28 deletions(-) diff --git a/config/locales/js-en.yml b/config/locales/js-en.yml index e2af859f8d..a659b376ee 100644 --- a/config/locales/js-en.yml +++ b/config/locales/js-en.yml @@ -572,6 +572,9 @@ en: and_more_users: one: 'and 1 other' other: 'and %{count} others' + no_results: + at_all: 'New notifications will appear here when there is activity that concerns you' + with_current_filter: 'There are no notifications in this view at the moment' mark_all_read: 'Mark all as read' mark_as_read: 'Mark as read' text_update_date: "%{date} by" @@ -589,10 +592,11 @@ en: mentioned: '@mentioned' watching: 'Watching' settings: + change_notification_settings: 'To view and change your notification settings, click here' title: "Notification settings" notify_me: "Notify me" - reasons: - mentioned: + reasons: + mentioned: title: 'I am @mentioned' description: 'Receive a notification every time someone mentions me anywhere' involved: diff --git a/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.html b/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.html index 44fc0b4dbe..e71d2210db 100644 --- a/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.html +++ b/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.html @@ -24,14 +24,12 @@ -
- - - {{ noResultText$ | async }} - -
+ +
diff --git a/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.ts b/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.ts index 5b7a6b5698..fb90ed3e70 100644 --- a/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.ts +++ b/frontend/src/app/features/in-app-notifications/center/in-app-notification-center.component.ts @@ -22,6 +22,8 @@ import { } from 'core-app/core/state/in-app-notifications/in-app-notification.model'; import { UntilDestroyedMixin } from 'core-app/shared/helpers/angular/until-destroyed.mixin'; import { APIV3Service } from 'core-app/core/apiv3/api-v3.service'; +import { PathHelperService } from 'core-app/core/path-helper/path-helper.service'; +import { IanBellService } from 'core-app/features/in-app-notifications/bell/state/ian-bell.service'; @Component({ selector: 'op-in-app-notification-center', @@ -40,12 +42,12 @@ export class InAppNotificationCenterComponent extends UntilDestroyedMixin implem loading$ = this.storeService.query.selectLoading(); + private totalCount$ = this.bellService.unread$; + noResultText$ = this - .storeService - .query - .activeFacet$ + .totalCount$ .pipe( - map((facet:'unread'|'all') => this.text.no_results[facet] || this.text.no_results.unread), + map((count:number) => (count > 0 ? this.text.no_results.with_current_filter : this.text.no_results.at_all)), ); totalCountWarning$ = this @@ -75,11 +77,15 @@ export class InAppNotificationCenterComponent extends UntilDestroyedMixin implem .join(','); text = { + change_notification_settings: this.I18n.t( + 'js.notifications.settings.change_notification_settings', + { url: this.pathService.myNotificationsSettingsPath() }, + ), title: this.I18n.t('js.notifications.title'), button_close: this.I18n.t('js.button_close'), no_results: { - unread: this.I18n.t('js.notifications.no_unread'), - all: this.I18n.t('js.notice_no_results_to_display'), + at_all: this.I18n.t('js.notifications.center.no_results.at_all'), + with_current_filter: this.I18n.t('js.notifications.center.no_results.with_current_filter'), }, }; @@ -90,9 +96,11 @@ export class InAppNotificationCenterComponent extends UntilDestroyedMixin implem readonly elementRef:ElementRef, readonly I18n:I18nService, readonly storeService:IanCenterService, + readonly bellService:IanBellService, readonly uiRouterGlobals:UIRouterGlobals, readonly state:StateService, readonly apiV3:APIV3Service, + readonly pathService:PathHelperService, ) { super(); } diff --git a/frontend/src/app/shared/components/no-results/no-results.component.html b/frontend/src/app/shared/components/no-results/no-results.component.html index e23d0c2a5f..3e383c24f8 100644 --- a/frontend/src/app/shared/components/no-results/no-results.component.html +++ b/frontend/src/app/shared/components/no-results/no-results.component.html @@ -1,5 +1,9 @@ - + {{ title }} - +
diff --git a/frontend/src/app/shared/components/no-results/no-results.component.ts b/frontend/src/app/shared/components/no-results/no-results.component.ts index a184bde179..2f85898030 100644 --- a/frontend/src/app/shared/components/no-results/no-results.component.ts +++ b/frontend/src/app/shared/components/no-results/no-results.component.ts @@ -38,5 +38,7 @@ export class NoResultsComponent { @Input() description:string; + @Input() showIcon = true; + @HostBinding('class.generic-table--no-results-container') setHostClass = true; } diff --git a/frontend/src/global_styles/content/_table.lsg b/frontend/src/global_styles/content/_table.lsg index 9c59f3615f..0ec9c0e7f1 100644 --- a/frontend/src/global_styles/content/_table.lsg +++ b/frontend/src/global_styles/content/_table.lsg @@ -394,9 +394,9 @@ Use `-no-ellipse` class to a TD element to disable the text-overflow applied usu
-

+ Nothing to display -

+

Either nothing have been created or everything is filtered out.

diff --git a/frontend/src/global_styles/content/_table.sass b/frontend/src/global_styles/content/_table.sass index e2e48cb8f1..c8f3833887 100644 --- a/frontend/src/global_styles/content/_table.sass +++ b/frontend/src/global_styles/content/_table.sass @@ -50,7 +50,7 @@ $toolbar-height--mobile: 100px display: contents .generic-table position: relative - + .generic-table--container position: relative height: 100% @@ -124,7 +124,7 @@ table.generic-table content: '*' color: var(--primary-color-dark) padding: 0 0.2rem - + &.-max .generic-table--sort-header max-width: none @@ -280,7 +280,7 @@ thead.-sticky th @include text-shortener &.-inactive color: var(--button--active-font-color) - + & > op-icon flex: 0 0 0 padding-left: 15px @@ -309,7 +309,8 @@ thead.-sticky th > i, .generic-table--no-results-title display: inline-block - font-size: rem-calc(17) + font-size: 1rem + font-weight: bold line-height: 1.4 vertical-align: top @@ -325,7 +326,8 @@ thead.-sticky th width: 99% .generic-table--no-results-description - font-size: rem-calc(15) + font-size: rem-calc(14) + font-weight: normal line-height: 1.4 margin-top: 4px diff --git a/frontend/src/global_styles/content/work_packages/_table_content.lsg b/frontend/src/global_styles/content/work_packages/_table_content.lsg index 77e9465502..ef12703a16 100644 --- a/frontend/src/global_styles/content/work_packages/_table_content.lsg +++ b/frontend/src/global_styles/content/work_packages/_table_content.lsg @@ -160,9 +160,9 @@
-

+ No work packages to display -

+

Either none have been created or all work packages are filtered out.

diff --git a/modules/reporting/lib/widget/table.rb b/modules/reporting/lib/widget/table.rb index 96e989d0d0..b9e6ffd345 100644 --- a/modules/reporting/lib/widget/table.rb +++ b/modules/reporting/lib/widget/table.rb @@ -69,7 +69,7 @@ class Widget::Table < Widget::Base if @subject.result.count <= 0 write(content_tag(:div, '', class: 'generic-table--no-results-container') do content_tag(:i, '', class: 'icon-info1') + - content_tag(:h2, I18n.t(:no_results_title_text), class: 'generic-table--no-results-title') + content_tag(:span, I18n.t(:no_results_title_text), class: 'generic-table--no-results-title') end) else str = render_widget(resolve_table, @subject, @options.reverse_merge(to: @output))