[CST-7217] Use short number pipe and fix badge alignment

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html

@@ -4,11 +4,10 @@
    [queryParams]="addQueryParams" queryParamsHandling="merge">
   <label class="mb-0 d-flex w-100">
     <input type="checkbox" [checked]="false" class="my-1 align-self-stretch filter-checkbox"/>
-    <span class="w-100 filter-value px-1 break-facet">
+    <span class="w-100 pl-1 break-facet">
+      <span class="float-right badge badge-secondary badge-pill">{{filterValue.count | dsShortNumber}}</span>
       {{ 'search.filters.' + filterConfig.name + '.' + filterValue.value | translate: {default: filterValue.value} }}
     </span>
   </label>
-  <span class="float-right filter-value-count ml-auto">
+
-    <span class="badge badge-secondary badge-pill">{{filterValue.count}}</span>
-  </span>
 </a>

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.scss

@@ -9,7 +9,7 @@ a {
 }
 
 .break-facet {
-    word-break: break-all;
+    word-break: break-word;
 }
 
 .filter-checkbox {

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.spec.ts

@@ -18,6 +18,7 @@ import { SearchFacetOptionComponent } from './search-facet-option.component';
 import { PaginationComponentOptions } from '../../../../../pagination/pagination-component-options.model';
 import { PaginationService } from '../../../../../../core/pagination/pagination.service';
 import { PaginationServiceStub } from '../../../../../testing/pagination-service.stub';
+import { ShortNumberPipe } from '../../../../../utils/short-number.pipe';
 
 describe('SearchFacetOptionComponent', () => {
   let comp: SearchFacetOptionComponent;
@@ -89,7 +90,7 @@ describe('SearchFacetOptionComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
-      declarations: [SearchFacetOptionComponent],
+      declarations: [SearchFacetOptionComponent, ShortNumberPipe],
       providers: [
         { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
         { provide: Router, useValue: new RouterStub() },

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html

@@ -3,6 +3,6 @@
    [queryParams]="changeQueryParams" queryParamsHandling="merge">
   <span class="filter-value px-1">{{filterValue.label}}</span>
   <span class="float-right filter-value-count ml-auto">
-                        <span class="badge badge-secondary badge-pill">{{filterValue.count}}</span>
+    <span class="badge badge-secondary badge-pill">{{filterValue.count | dsShortNumber}}</span>
   </span>
 </a>

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.spec.ts

@@ -15,10 +15,14 @@ import { SearchConfigurationService } from '../../../../../../core/shared/search
 import { SearchFilterService } from '../../../../../../core/shared/search/search-filter.service';
 import { By } from '@angular/platform-browser';
 import { SearchFacetRangeOptionComponent } from './search-facet-range-option.component';
-import { RANGE_FILTER_MAX_SUFFIX, RANGE_FILTER_MIN_SUFFIX } from '../../search-range-filter/search-range-filter.component';
+import {
+  RANGE_FILTER_MAX_SUFFIX,
+  RANGE_FILTER_MIN_SUFFIX
+} from '../../search-range-filter/search-range-filter.component';
 import { PaginationComponentOptions } from '../../../../../pagination/pagination-component-options.model';
 import { PaginationService } from '../../../../../../core/pagination/pagination.service';
 import { PaginationServiceStub } from '../../../../../testing/pagination-service.stub';
+import { ShortNumberPipe } from '../../../../../utils/short-number.pipe';
 
 describe('SearchFacetRangeOptionComponent', () => {
   let comp: SearchFacetRangeOptionComponent;
@@ -60,7 +64,7 @@ describe('SearchFacetRangeOptionComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
-      declarations: [SearchFacetRangeOptionComponent],
+      declarations: [SearchFacetRangeOptionComponent, ShortNumberPipe],
       providers: [
         { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
         { provide: Router, useValue: new RouterStub() },

src/app/shared/search/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.scss

@@ -9,7 +9,7 @@ a {
 }
 
 .break-facet {
-    word-break: break-all;
+    word-break: break-word;
 }
 
 .filter-checkbox {