From 6d9c169b3ec995cfe87de2b404f01a41d965b45a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Wed, 20 Jul 2022 19:16:57 +0300
Subject: [PATCH] Popup filter options

---
 src/assets/styles/common-autocomplete.scss                 | 2 ++
 src/lib/filtering/popup-filter/popup-filter.component.html | 6 +++---
 src/lib/filtering/popup-filter/popup-filter.component.ts   | 2 ++
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/assets/styles/common-autocomplete.scss b/src/assets/styles/common-autocomplete.scss
index ac9e3a8..5be01bc 100644
--- a/src/assets/styles/common-autocomplete.scss
+++ b/src/assets/styles/common-autocomplete.scss
@@ -3,6 +3,8 @@
 .mat-autocomplete-panel {
     @include common-mixins.scroll-bar;
 
+    border-radius: 8px;
+
     .mat-option {
         font-size: inherit;
     }
diff --git a/src/lib/filtering/popup-filter/popup-filter.component.html b/src/lib/filtering/popup-filter/popup-filter.component.html
index 3a9468f..bc55ca3 100644
--- a/src/lib/filtering/popup-filter/popup-filter.component.html
+++ b/src/lib/filtering/popup-filter/popup-filter.component.html
@@ -77,9 +77,9 @@
 </ng-template>
 
 <ng-template #filterHeader>
-    <div class="filter-menu-header">
-        <div class="all-caps-label" translate="filter-menu.filter-types"></div>
-        <div *ngIf="primaryFilterGroup$ | async as primaryGroup" class="actions">
+    <div *ngIf="primaryFilterGroup$ | async as primaryGroup" class="filter-menu-header">
+        <div [translateParams]="{ count: primaryGroup.filters.length }" [translate]="primaryFiltersLabel" class="all-caps-label"></div>
+        <div class="actions">
             <div
                 (click)="activatePrimaryFilters(); $event.stopPropagation()"
                 *ngIf="!primaryGroup.singleSelect"
diff --git a/src/lib/filtering/popup-filter/popup-filter.component.ts b/src/lib/filtering/popup-filter/popup-filter.component.ts
index 4513c56..79e7431 100644
--- a/src/lib/filtering/popup-filter/popup-filter.component.ts
+++ b/src/lib/filtering/popup-filter/popup-filter.component.ts
@@ -9,6 +9,7 @@ import { IFilterGroup } from '../models/filter-group.model';
 import { INestedFilter } from '../models/nested-filter.model';
 import { SearchService } from '../../search';
 import { Filter, IFilter } from '..';
+import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
 
 const areExpandable = (nestedFilter: INestedFilter) => !!nestedFilter?.children?.length;
 const atLeastOneIsExpandable = pipe(
@@ -36,6 +37,7 @@ export class PopupFilterComponent implements OnInit {
     @Input() primaryFiltersSlug!: string;
     @Input() actionsTemplate?: TemplateRef<unknown>;
     @Input() secondaryFiltersSlug = '';
+    @Input() primaryFiltersLabel: string = _('filter-menu.filter-types');
 
     atLeastOneFilterIsExpandable$?: Observable<boolean>;
     atLeastOneSecondaryFilterIsExpandable$?: Observable<boolean>;