chore(combo): cleanup unnecessary imports, format template

Author: ViktorSlavov

projects/igniteui-angular/src/lib/combo/combo.component.html

@@ -18,14 +18,17 @@
         <ng-container *ngIf="clearIconTemplate">
             <ng-container *ngTemplateOutlet="clearIconTemplate"></ng-container>
         </ng-container>
-        <igx-icon *ngIf="!clearIconTemplate" fontSet="material">clear</igx-icon>
+        <igx-icon *ngIf="!clearIconTemplate" fontSet="material">
+            clear
+        </igx-icon>
     </igx-suffix>
     <igx-suffix igxButton="icon" class="igx-combo__toggle-button" igxRipple>
         <ng-container *ngIf="toggleIconTemplate">
             <ng-container *ngTemplateOutlet="toggleIconTemplate; context: {$implicit: this.collapsed}"></ng-container>
         </ng-container>
         <igx-icon *ngIf="!toggleIconTemplate" fontSet="material">
-            {{ dropdown.collapsed ? 'arrow_drop_down' : 'arrow_drop_up'}}</igx-icon>
+            {{ dropdown.collapsed ? 'arrow_drop_down' : 'arrow_drop_up'}}
+        </igx-icon>
     </igx-suffix>
 </igx-input-group>
 <igx-combo-drop-down #igxComboDropDown class="igx-combo__drop-down" [displayDensity]="displayDensity"
@@ -42,10 +45,12 @@
     <div #dropdownItemContainer class="igx-combo__content" [style.overflow]="'hidden'"
         [style.maxHeight.px]="itemsMaxHeight" [igxDropDownItemNavigation]="dropdown" (focus)="dropdown.onFocus()"
         [tabindex]="dropdown.collapsed ? -1 : 0" role="listbox" [attr.id]="dropdown.id">
-        <igx-combo-item *igxFor="let item of data | comboFiltering:searchValue:displayKey:filterable
-        | comboGrouping:groupKey:valueKey;
-        index as rowIndex; containerSize: itemsMaxHeight; scrollOrientation: 'vertical'; itemSize: itemHeight"
-            [itemHeight]='itemHeight' [value]="item" [isHeader]="item.isHeader" role="option" [index]="rowIndex">
+        <igx-combo-item role="option" [itemHeight]='itemHeight'
+            *igxFor="let item of data
+            | comboFiltering:searchValue:displayKey:filterable
+            | comboGrouping:groupKey:valueKey;
+            index as rowIndex; containerSize: itemsMaxHeight; scrollOrientation: 'vertical'; itemSize: itemHeight"
+            [value]="item" [isHeader]="item.isHeader" [index]="rowIndex">
             <ng-container *ngIf="item.isHeader">
                 <ng-container
                     *ngTemplateOutlet="headerItemTemplate ? headerItemTemplate : headerItemBase;

projects/igniteui-angular/src/lib/combo/combo.component.spec.ts

@@ -2352,30 +2352,26 @@ describe('igxCombo', () => {
             fix.detectChanges();
             expect(combo.groupKey).toEqual('region');
             expect(combo.dropdown.items[0].value.field === combo.data[0].field).toBeFalsy();
-            // expect(combo.sortingExpressions[0]).toEqual({
-            //     fieldName: 'region',
-            //     dir: SortingDirection.Asc,
-            //     ignoreCase: true,
-            //     strategy: DefaultSortingStrategy.instance()
-            // });
             const listItems = fix.debugElement.queryAll(By.css('.' + CSS_CLASS_DROPDOWNLISTITEM));
             const listHeaders = fix.debugElement.queryAll(By.css('.' + CSS_CLASS_HEADERITEM));
             expect(listItems.length).toBeGreaterThan(0);
             expect(listHeaders.length).toBeGreaterThan(0);
             expect(listHeaders[0].nativeElement.innerHTML).toContain('East North Central');
         }));
-        it('Should sort items correctly', fakeAsync(() => {
+        it('Should group items correctly', fakeAsync(() => {
             const fix = TestBed.createComponent(IgxComboInputTestComponent);
             fix.detectChanges();
             const combo = fix.componentInstance.combo;
             combo.toggle();
             tick();
             fix.detectChanges();
             expect(combo.groupKey).toEqual('region');
+            // First item is group header
             expect(combo.dropdown.items[0].value.field === combo.data[0].field).toBeFalsy();
             combo.groupKey = '';
 
             fix.detectChanges();
+            // First item is regular item
             expect(combo.dropdown.items[0].value).toEqual(combo.data[0]);
         }));
 

projects/igniteui-angular/src/lib/combo/combo.component.ts

@@ -19,8 +19,7 @@ import { IgxCheckboxModule } from '../checkbox/checkbox.component';
 import { IgxSelectionAPIService } from '../core/selection';
 import { cloneArray, CancelableEventArgs, CancelableBrowserEventArgs, IBaseEventArgs } from '../core/utils';
 import { IgxStringFilteringOperand, IgxBooleanFilteringOperand } from '../data-operations/filtering-condition';
-import { FilteringLogic, IFilteringExpression } from '../data-operations/filtering-expression.interface';
-import { SortingDirection, ISortingExpression } from '../data-operations/sorting-expression.interface';
+import { FilteringLogic } from '../data-operations/filtering-expression.interface';
 import { IgxForOfModule, IForOfState, IgxForOfDirective } from '../directives/for-of/for_of.directive';
 import { IgxIconModule } from '../icon/index';
 import { IgxRippleModule } from '../directives/ripple/ripple.directive';

projects/igniteui-angular/src/lib/combo/combo.pipes.ts

@@ -1,4 +1,4 @@
-import { Pipe, PipeTransform, Inject } from '@angular/core';
+import { Inject, Pipe, PipeTransform} from '@angular/core';
 import { cloneArray } from '../core/utils';
 import { DataUtil } from '../data-operations/data-util';
 import { SortingDirection } from '../data-operations/sorting-expression.interface';