Merge branch '15.1.x' into ibarakov/fix-12581-15.1.x

kdinev · web-flow · commit 5db634b78336 · 2023-04-10T14:12:20.000+03:00
diff --git a/projects/igniteui-angular/src/lib/chips/chip.component.ts b/projects/igniteui-angular/src/lib/chips/chip.component.ts
@@ -11,7 +11,8 @@
     Renderer2,
     TemplateRef,
     Inject,
-    Optional
+    Optional,
+    OnDestroy
 } from '@angular/core';
 import { IDisplayDensityOptions, DisplayDensityToken, DisplayDensityBase } from '../core/displayDensity';
 import {
@@ -24,7 +25,7 @@ import {
 import { IBaseEventArgs } from '../core/utils';
 import { IChipResourceStrings } from '../core/i18n/chip-resources';
 import { CurrentResourceStrings } from '../core/i18n/resources';
-import { fromEvent } from 'rxjs';
+import { fromEvent, Subject } from 'rxjs';
 import { take, filter } from 'rxjs/operators';
 
 export interface IBaseChipEventArgs extends IBaseEventArgs {
@@ -79,7 +80,7 @@ let CHIP_ID = 0;
     selector: 'igx-chip',
     templateUrl: 'chip.component.html'
 })
-export class IgxChipComponent extends DisplayDensityBase {
+export class IgxChipComponent extends DisplayDensityBase implements OnDestroy {
     /**
      * An @Input property that sets the value of `id` attribute. If not provided it will be automatically generated.
      *
@@ -536,6 +537,12 @@ export class IgxChipComponent extends DisplayDensityBase {
      */
     public hideBaseElement = false;
 
+    /**
+     * @hidden
+     * @internal
+     */
+    public destroy$ = new Subject();
+
     protected _tabIndex = null;
     protected _selected = false;
     protected _selectedItemClass = 'igx-chip__item--selected';
@@ -854,4 +861,9 @@ export class IgxChipComponent extends DisplayDensityBase {
             }
         }
     }
+
+    public ngOnDestroy(): void {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
 }
diff --git a/projects/igniteui-angular/src/lib/chips/chips-area.component.ts b/projects/igniteui-angular/src/lib/chips/chips-area.component.ts
@@ -223,20 +223,20 @@ export class IgxChipsAreaComponent implements DoCheck, AfterViewInit, OnDestroy
             const changes = this._differ.diff(this.chipsList.toArray());
             if (changes) {
                 changes.forEachAddedItem((addedChip) => {
-                    addedChip.item.moveStart.pipe(takeUntil(this.destroy$)).subscribe((args) => {
+                    addedChip.item.moveStart.pipe(takeUntil(addedChip.item.destroy$)).subscribe((args) => {
                         this.onChipMoveStart(args);
                     });
-                    addedChip.item.moveEnd.pipe(takeUntil(this.destroy$)).subscribe((args) => {
+                    addedChip.item.moveEnd.pipe(takeUntil(addedChip.item.destroy$)).subscribe((args) => {
                         this.onChipMoveEnd(args);
                     });
-                    addedChip.item.dragEnter.pipe(takeUntil(this.destroy$)).subscribe((args) => {
+                    addedChip.item.dragEnter.pipe(takeUntil(addedChip.item.destroy$)).subscribe((args) => {
                         this.onChipDragEnter(args);
                     });
-                    addedChip.item.keyDown.pipe(takeUntil(this.destroy$)).subscribe((args) => {
+                    addedChip.item.keyDown.pipe(takeUntil(addedChip.item.destroy$)).subscribe((args) => {
                         this.onChipKeyDown(args);
                     });
                     if (addedChip.item.selectable) {
-                        addedChip.item.selectedChanging.pipe(takeUntil(this.destroy$)).subscribe((args) => {
+                        addedChip.item.selectedChanging.pipe(takeUntil(addedChip.item.destroy$)).subscribe((args) => {
                             this.onChipSelectionChange(args);
                         });
                     }
diff --git a/projects/igniteui-angular/src/lib/core/styles/README.md b/projects/igniteui-angular/src/lib/core/styles/README.md
@@ -33,7 +33,7 @@ Learn how to create themes:
 * [Component Themes](https://www.infragistics.com/products/ignite-ui-angular/angular/components/themes/component-themes.html)
 
 Learn how to create a component schema:
-* [Schemas](https://www.infragistics.com/products/ignite-ui-angular/angular/components/themes/schemas.html)
+* [Schemas](https://www.infragistics.com/products/ignite-ui-angular/angular/components/themes/sass/schemas)
 
 Learn how to build color palettes:
 * [Palettes](https://www.infragistics.com/products/ignite-ui-angular/angular/components/themes/palette.html)
diff --git a/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts b/projects/igniteui-angular/src/lib/grids/grid/grid-filtering-advanced.spec.ts
@@ -2144,6 +2144,63 @@ describe('IgxGrid - Advanced Filtering #grid - ', () => {
                 expect(GridFunctions.getAdvancedFilteringTreeChildItems(secondItem, false).length).toBe(1);
             }));
 
+            it('Should respect the changes of the groups applied from the context menu.',
+            fakeAsync(() => {
+                // Apply advanced filter through API.
+                const tree = new FilteringExpressionsTree(FilteringLogic.And);
+                tree.filteringOperands.push({
+                    fieldName: 'ProductName', searchVal: 'angular', condition: IgxStringFilteringOperand.instance().condition('contains'),
+                    ignoreCase: true
+                });
+                tree.filteringOperands.push({
+                    fieldName: 'ProductName', searchVal: 'script', condition: IgxStringFilteringOperand.instance().condition('contains'),
+                    ignoreCase: true
+                });
+                grid.advancedFilteringExpressionsTree = tree;
+                fix.detectChanges();
+
+                // Verify the filter changes are applied.
+                expect(grid.filteredData.length).toEqual(0);
+
+                // Open Advanced Filtering dialog.
+                grid.openAdvancedFilteringDialog();
+                fix.detectChanges();
+
+                // Verify tree layout before the group change through context menu.
+                let rootGroup = GridFunctions.getAdvancedFilteringTreeRootGroup(fix);
+                expect(GridFunctions.getAdvancedFilteringTreeChildItems(rootGroup, true).length).toBe(2);
+                expect(GridFunctions.getAdvancedFilteringTreeChildItems(rootGroup, false).length).toBe(2);
+                
+                // Select two chips.
+                GridFunctions.clickAdvancedFilteringTreeExpressionChip(fix, [0]);
+                GridFunctions.clickAdvancedFilteringTreeExpressionChip(fix, [1]);
+                tick(200);
+
+                // Click "Create Or Group" in context menu.
+                const buttons = GridFunctions.getAdvancedFilteringContextMenuButtons(fix);
+                buttons[2].click();
+                tick(100);
+                fix.detectChanges();
+                         
+                // Close dialog through API.
+                grid.closeAdvancedFilteringDialog(true);
+                tick(100);
+                fix.detectChanges();
+
+                // Open Advanced Filtering dialog.
+                grid.openAdvancedFilteringDialog();
+                fix.detectChanges();
+                
+                // Verify tree layout after the group change through context menu.
+                rootGroup = GridFunctions.getAdvancedFilteringTreeRootGroup(fix);
+                expect(GridFunctions.getAdvancedFilteringTreeChildItems(rootGroup, true).length).toBe(1);
+                expect(GridFunctions.getAdvancedFilteringTreeChildItems(rootGroup, false).length).toBe(3);
+                
+                // Verify the filter changes are applied.
+                expect(grid.filteredData.length).toEqual(3);
+            }));
+
+
             it('Should delete all selected conditions when the \'delete filters\' option from context menu is clicked.',
             fakeAsync(() => {
                 // Apply advanced filter through API.
diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/child-grid-row.component.html b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/child-grid-row.component.html
@@ -1,3 +1,3 @@
 <div class="igx-grid__hierarchical-indent" [ngClass]="{'igx-grid__hierarchical-indent--scroll': parentHasScroll}">
-    <igx-hierarchical-grid #hgrid [data]='data.childGridsData[layout.key]'></igx-hierarchical-grid>
+    <ng-container #container></ng-container>
 </div>
diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts
@@ -95,7 +95,12 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit {
     @Input()
     public index: number;
 
-    @ViewChild('hgrid', { static: true })
+    @ViewChild('container', {read: ViewContainerRef, static: true}) 
+    public container: ViewContainerRef;
+
+    /**
+     * @hidden
+     */
     public hGrid: IgxHierarchicalGridComponent;
 
     /**
@@ -155,6 +160,9 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit {
      * @hidden
      */
     public ngOnInit() {
+        const ref = this.container.createComponent(IgxHierarchicalGridComponent, { injector: this.container.injector });
+        this.hGrid = ref.instance;
+        this.hGrid.data = this.data.childGridsData[this.layout.key];
         this.layout.layoutChange.subscribe((ch) => {
             this._handleLayoutChanges(ch);
         });
diff --git a/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts b/projects/igniteui-angular/src/lib/query-builder/query-builder.component.ts
@@ -1164,8 +1164,8 @@ export class IgxQueryBuilderComponent extends DisplayDensityBase implements Afte
         parent.children.splice(index, 0, groupItem);
 
         for (const expr of this.selectedExpressions) {
-            this.deleteItem(expr);
             groupItem.children.push(expr);
+            this.deleteItem(expr);
             expr.parent = groupItem;
         }
 

Original file line number	Diff line number	Diff line change
`@@ -1164,8 +1164,8 @@ export class IgxQueryBuilderComponent extends DisplayDensityBase implements Afte`
`1164`	`1164`	`parent.children.splice(index, 0, groupItem);`
`1165`	`1165`
`1166`	`1166`	`for (const expr of this.selectedExpressions) {`
`1167`		`- this.deleteItem(expr);`
`1168`	`1167`	`groupItem.children.push(expr);`
	`1168`	`+ this.deleteItem(expr);`
`1169`	`1169`	`expr.parent = groupItem;`
`1170`	`1170`	`}`
`1171`	`1171`