diff --git a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.html b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.html index 23235a429265916fb31be6b37854dfce40d9fc8e..1fdfd0788a193255ebee0f606a6e3e99d8e6e601 100644 --- a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.html +++ b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.html @@ -56,6 +56,7 @@ aria-labelledby="time_settings" *ngIf="!searchBox.value && comments && comments.length > 0 && !search" [matMenuTriggerFor]="timeMenu" + [ngClass]="{'active-filter': period !== 'time-all'}" matTooltip="{{ 'comment-list.select-time' | translate }}"> <mat-icon class="searchBarIcon">history</mat-icon> </button> @@ -126,7 +127,7 @@ </app-comment> </div> -<div *ngIf="comments && commentsFilteredByTime.length < 1 && !isLoading" +<div *ngIf="comments && commentsFilteredByTime.length < 1 && period === 'time-all' && !isLoading" fxLayout="row" fxLayoutAlign="center center" class="no-comments"> @@ -134,6 +135,14 @@ <p class="oldtypo-p">{{ 'comment-page.no-comments' | translate }}</p> </div> +<div *ngIf="(filteredComments && filteredComments.length === 0 && hideCommentsList) + || (comments && commentsFilteredByTime.length === 0 && period !== 'time-all') && !isLoading" + fxLayout="row" + fxLayoutAlign="center center" + class="no-comments"> + <p class="oldtypo-p">{{ (search ? 'comment-page.no-comments-with-search' : 'comment-page.no-comments-with-filter') | translate }}</p> +</div> + <div class="visually-hidden"> <div id="search-box-input-description"> {{ 'comment-page.search-box-input-description' | translate }} diff --git a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.scss b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.scss index ed8ea0f7b63d53c4d5aca906071db29c85278640..4bcbccdf64c00c235709a5e449a65c11b7467012 100644 --- a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.scss +++ b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.scss @@ -129,3 +129,6 @@ h3 { font-weight: bold; } +.active-filter .mat-icon { + color: var(--red); +} diff --git a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.ts b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.ts index a8a8e4b7bff0d49452c480ff6f6d904ba85a42fb..704bbf6a270c5891d1fe168d20c19a5474a97762 100644 --- a/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.ts +++ b/src/app/components/moderator/moderator-comment-list/moderator-comment-list.component.ts @@ -109,6 +109,7 @@ export class ModeratorCommentListComponent implements OnInit { } searchComments(): void { + this.search = true; if (this.searchInput && this.searchInput.length > 2) { this.hideCommentsList = true; this.filteredComments = this.commentsFilteredByTime.filter(c => c.body.toLowerCase().includes(this.searchInput.toLowerCase())); diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html index acaaa1df2a4974ea1b02bb5192ae960c8b4283c5..3d57721046c6cfc925d11eaf47b899b25bea0069 100644 --- a/src/app/components/shared/comment-list/comment-list.component.html +++ b/src/app/components/shared/comment-list/comment-list.component.html @@ -65,7 +65,7 @@ class="searchBarButton" aria-labelledby="filter_list" *ngIf="!searchBox.value && comments && comments.length > 0 && !search" - [matMenuTriggerFor]="filterMenu" + [matMenuTriggerFor]="filterMenu" [ngClass]="{'active-filter': hideCommentsList}" matTooltip="{{ 'comment-list.filter-comments' | translate }}"> <mat-icon class="searchBarIcon">filter_list</mat-icon> </button> @@ -76,6 +76,7 @@ aria-labelledby="time_settings" *ngIf="!searchBox.value && comments && comments.length > 0 && !search" [matMenuTriggerFor]="timeMenu" + [ngClass]="{'active-filter': period !== 'time-all'}" matTooltip="{{ 'comment-list.select-time' | translate }}"> <mat-icon class="searchBarIcon">history</mat-icon> </button> @@ -226,13 +227,21 @@ </div> <!-- No Questions Present --> -<div *ngIf="comments && commentsFilteredByTime.length < 1 && !isLoading" +<div *ngIf="comments && commentsFilteredByTime.length < 1 && period === 'time-all' && !isLoading" fxLayout="row" fxLayoutAlign="center center" class="no-comments"> <p class="oldtypo-p">{{ 'comment-page.no-comments' | translate }}</p> </div> +<div *ngIf="(filteredComments && filteredComments.length === 0 && hideCommentsList) + || (comments && commentsFilteredByTime.length === 0 && period !== 'time-all') && !isLoading" + fxLayout="row" + fxLayoutAlign="center center" + class="no-comments"> + <p class="oldtypo-p">{{ (search ? 'comment-page.no-comments-with-search' : 'comment-page.no-comments-with-filter') | translate }}</p> +</div> + <!--Hidden Div's for a11y-Descriptions--> <div class="visually-hidden"> <div id="search-box-input-description"> diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss index 744339a81109b4a8cf9334515a976d85c9fa7c0f..387df1437ee64035edfe0a740eee9305bd63b829 100644 --- a/src/app/components/shared/comment-list/comment-list.component.scss +++ b/src/app/components/shared/comment-list/comment-list.component.scss @@ -210,3 +210,7 @@ h3 { .selected { font-weight: bold; } + +.active-filter .mat-icon { + color: var(--red); +} diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts index 830f149ccae6c7e3235875b34e9ba2956b368a42..e2a62142ac9c583286f3129e288d60fe5f264123 100644 --- a/src/app/components/shared/comment-list/comment-list.component.ts +++ b/src/app/components/shared/comment-list/comment-list.component.ts @@ -173,6 +173,7 @@ export class CommentListComponent implements OnInit, OnDestroy { } searchComments(): void { + this.search = true; if (this.searchInput) { if (this.searchInput.length > 1) { this.hideCommentsList = true; diff --git a/src/assets/i18n/creator/de.json b/src/assets/i18n/creator/de.json index 0e25e30e269bd793a43bb3c61f8fd7d9f73159ca..6c2c9a052f3579245665f1223c0ec5f3e8de4b26 100644 --- a/src/assets/i18n/creator/de.json +++ b/src/assets/i18n/creator/de.json @@ -126,6 +126,8 @@ "mark-wrong": "Frage verneinen", "new-comment": "Eine neue Frage mit dem Inhalt, {{ comment }}, wurde soeben gestellt.", "no-comments": "Keine Fragen zurzeit", + "no-comments-with-filter": "Keine Fragen mit den ausgewählten Filtereinstellungen", + "no-comments-with-search": "Keine Fragen mit deiner Suche", "reject": "Frage auf den Index setzen", "search-box-input-description": "Hier kannst du nach Fragen suchen.", "semicolon": "CSV-Format (.csv)", diff --git a/src/assets/i18n/creator/en.json b/src/assets/i18n/creator/en.json index 20ddb71db1af29561803f3ebc985dc22e0db1106..5a70e57d84b12dbec78ce9ee12d56afb7416182b 100644 --- a/src/assets/i18n/creator/en.json +++ b/src/assets/i18n/creator/en.json @@ -127,6 +127,8 @@ "mark-wrong": "Mark as wrong", "new-comment": "A new question with the content, {{ comment }}, has been asked.", "no-comments": "No questions at present", + "no-comments-with-filter": "No questions with selected filter settings", + "no-comments-with-search": "No questions with your search", "reject": "Put the question on the index", "search-box-input-description": "Search for questions", "semicolon": "CSV format (.csv)", diff --git a/src/assets/i18n/participant/de.json b/src/assets/i18n/participant/de.json index 6e42c12270336a5dc2fd96fa70ea815b97fbde31..385e2bf47a38545c50b4aaf289b627adac1de288 100644 --- a/src/assets/i18n/participant/de.json +++ b/src/assets/i18n/participant/de.json @@ -104,6 +104,8 @@ "mark-read": "Die Frage wurde öffentlich besprochen.", "new-comment": "Eine neue Frage mit dem Inhalt, {{ comment }}, wurde soeben gestellt.", "no-comments": "Keine Fragen zurzeit", + "no-comments-with-filter": "Keine Fragen mit den ausgewählten Filtereinstellungen", + "no-comments-with-search": "Keine Fragen mit deiner Suche", "search-box-input-description": "Hier kannst du nach Fragen suchen.", "send": "Senden", "send-description": "Frage abschicken", diff --git a/src/assets/i18n/participant/en.json b/src/assets/i18n/participant/en.json index 1ca9ef9a05bc91e0170fb7c08045d6a1b917e1ac..0c55e64bb5a28bceb553f6f6c211c83d2279cb7a 100644 --- a/src/assets/i18n/participant/en.json +++ b/src/assets/i18n/participant/en.json @@ -114,6 +114,8 @@ "mark-read": "Already discussed by the presenter", "new-comment": "A new question with the content, {{ comment }}, has been asked.", "no-comments": "No questions at present", + "no-comments-with-filter": "No questions with selected filter settings", + "no-comments-with-search": "No questions with your search", "search-box-input-description": "Here you can search for questions.", "send": "Send", "send-description": "Send question",