Skip to content

Commit d6bdf08

Browse files
mddragnevmddragnev
committed
Merge branch 'pivot-grid-master' of https://github.com/IgniteUI/igniteui-angular into mdragnev/pivot-api-hiding
2 parents 91260c0 + 5fe7bdd commit d6bdf08

File tree

16 files changed

+1297
-672
lines changed

16 files changed

+1297
-672
lines changed

‎CHANGELOG.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ All notable changes for each version of this project will be documented in this
5353
- **Breaking Change** - The following input has been removed
5454
- Input `columns`. Use `igxGrid` `columns` input instead.
5555
- `IgxCarousel`
56-
- **Breaking Changes** -The carousel animation type `CarouselAnimationType` is renamed to `HorizontalAnimationType`.
56+
- **Breaking Changes** -The carousel animation type `CarouselAnimationType` is renamed to `HorizontalAnimationType`.
5757

5858
## 12.2.3
5959

‎projects/igniteui-angular/migrations/update-13_0_0/index.spec.ts

Lines changed: 123 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,13 +22,14 @@ describe(`Update to ${version}`, () => {
2222
}
2323
};
2424

25-
const migrationName = 'migration-22';
26-
2725
beforeEach(() => {
2826
appTree = new UnitTestTree(new EmptyTree());
2927
appTree.create('/angular.json', JSON.stringify(configJson));
3028
});
3129

30+
const migrationName = 'migration-22';
31+
const lineBreaksAndSpaceRegex = /\s/g;
32+
3233
it('should rename CarouselAnimationType to HorizontalAnimationType', async () => {
3334
appTree.create(
3435
'/testSrc/appPrefix/component/test.component.ts',
@@ -67,4 +68,124 @@ describe(`Update to ${version}`, () => {
6768
)
6869
).toEqual(expectedContent);
6970
});
71+
72+
/* eslint-disable arrow-parens */
73+
it('Should properly rename columns property to columnsCollection', async () => {
74+
appTree.create('/testSrc/appPrefix/component/test.component.ts',
75+
`
76+
import { IgxGridComponent } from 'igniteui-angular';
77+
export class MyClass {
78+
@ViewChild(IgxGridComponent, { read: IgxGridComponent })
79+
public grid1: IgxGridComponent;
80+
81+
public ngAfterViewInit() {
82+
const columns = grid1.columns;
83+
}
84+
}
85+
`);
86+
87+
const tree = await schematicRunner
88+
.runSchematicAsync(migrationName, {}, appTree)
89+
.toPromise();
90+
91+
expect(
92+
tree.readContent('/testSrc/appPrefix/component/test.component.ts')
93+
).toEqual(
94+
`
95+
import { IgxGridComponent } from 'igniteui-angular';
96+
export class MyClass {
97+
@ViewChild(IgxGridComponent, { read: IgxGridComponent })
98+
public grid1: IgxGridComponent;
99+
100+
public ngAfterViewInit() {
101+
const columns = grid1.columnsCollection;
102+
}
103+
}
104+
`
105+
);
106+
});
107+
108+
it('Should properly rename columns property to columnsCollection - treeGrid', async () => {
109+
appTree.create('/testSrc/appPrefix/component/test.component.ts',
110+
`
111+
import { IgxTreeGridComponent } from 'igniteui-angular';
112+
export class MyClass {
113+
@ViewChild(IgxTreeGridComponent, { read: IgxTreeGridComponent })
114+
public tGrid1: IgxTreeGridComponent;
115+
116+
public ngAfterViewInit() {
117+
const columns = this.tGrid1.columns;
118+
}
119+
120+
public soSth() {
121+
const editableColumns = this.tGrid1.columns.filter(c => e.editable);
122+
}
123+
}
124+
`);
125+
126+
const tree = await schematicRunner
127+
.runSchematicAsync(migrationName, {}, appTree)
128+
.toPromise();
129+
130+
expect(
131+
tree.readContent('/testSrc/appPrefix/component/test.component.ts')
132+
).toEqual(
133+
`
134+
import { IgxTreeGridComponent } from 'igniteui-angular';
135+
export class MyClass {
136+
@ViewChild(IgxTreeGridComponent, { read: IgxTreeGridComponent })
137+
public tGrid1: IgxTreeGridComponent;
138+
139+
public ngAfterViewInit() {
140+
const columns = this.tGrid1.columnsCollection;
141+
}
142+
143+
public soSth() {
144+
const editableColumns = this.tGrid1.columnsCollection.filter(c => e.editable);
145+
}
146+
}
147+
`
148+
);
149+
});
150+
151+
it('should remove paging and paginationTemplate property and define a igx-paginator component with custom content', async () => {
152+
appTree.create(
153+
'/testSrc/appPrefix/component/test.component.html', `
154+
<div class="columnHidingContainer">
155+
<div *ngFor="let col of grid.columns">
156+
{{col.field}}
157+
</div>
158+
</div>
159+
<div class="gridContainer">
160+
<igx-grid igxPreventDocumentScroll #grid [data]="data" [autoGenerate]="false" width="100%" height="560px" columnWidth="200px"
161+
[allowFiltering]="true">
162+
<igx-column [field]="'ID'" dataType="string" [sortable]="true"></igx-column>
163+
<igx-column [field]="'ContactName'" dataType="string" [sortable]="true" [disableHiding]="true"></igx-column>
164+
<igx-column [field]="'ContactTitle'" dataType="string" [sortable]="true" [disableHiding]="true"></igx-column>
165+
<igx-column [field]="'City'" dataType="string" [sortable]="true"></igx-column>
166+
<igx-column [field]="'CompanyName'" dataType="string" [sortable]="true"></igx-column>
167+
</igx-grid>
168+
</div>`);
169+
const tree = await schematicRunner.runSchematicAsync(migrationName, {}, appTree)
170+
.toPromise();
171+
172+
expect(tree.readContent('/testSrc/appPrefix/component/test.component.html').replace(lineBreaksAndSpaceRegex, ''))
173+
.toEqual(`
174+
<div class="columnHidingContainer">
175+
<div *ngFor="let col of grid.columnsCollection">
176+
{{col.field}}
177+
</div>
178+
</div>
179+
<div class="gridContainer">
180+
<igx-grid igxPreventDocumentScroll #grid [data]="data" [autoGenerate]="false" width="100%" height="560px" columnWidth="200px"
181+
[allowFiltering]="true">
182+
<igx-column [field]="'ID'" dataType="string" [sortable]="true"></igx-column>
183+
<igx-column [field]="'ContactName'" dataType="string" [sortable]="true" [disableHiding]="true"></igx-column>
184+
<igx-column [field]="'ContactTitle'" dataType="string" [sortable]="true" [disableHiding]="true"></igx-column>
185+
<igx-column [field]="'City'" dataType="string" [sortable]="true"></igx-column>
186+
<igx-column [field]="'CompanyName'" dataType="string" [sortable]="true"></igx-column>
187+
</igx-grid>
188+
</div>
189+
`.replace(lineBreaksAndSpaceRegex, ''));
190+
});
70191
});

‎projects/igniteui-angular/migrations/update-13_0_0/index.ts

Lines changed: 55 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,65 @@
1-
import { Rule, SchematicContext, Tree } from '@angular-devkit/schematics';
1+
import {
2+
Rule,
3+
SchematicContext,
4+
Tree
5+
} from '@angular-devkit/schematics';
26
import { UpdateChanges } from '../common/UpdateChanges';
7+
import { Element } from '@angular/compiler';
8+
import { findElementNodes, getSourceOffset, parseFile } from '../common/util';
39

410
const version = '13.0.0';
511

612
export default (): Rule => (host: Tree, context: SchematicContext) => {
713
context.logger.info(`Applying migration for Ignite UI for Angular to version ${version}`);
814

915
const update = new UpdateChanges(__dirname, host, context);
16+
const GRIDS = ['IgxGridComponent', 'IgxTreeGridComponent', 'IgxHierarchicalGridComponent'];
17+
const TAGS = ['igx-grid', 'igx-tree-grid', 'igx-hierarchical-grid'];
18+
const tsFiles = update.tsFiles;
19+
20+
for (const path of update.templateFiles) {
21+
findElementNodes(parseFile(host, path), TAGS)
22+
.map(node => getSourceOffset(node as Element))
23+
.forEach(offset => {
24+
const { file, node } = offset;
25+
if (file.content.includes('columns')) {
26+
const gridRef = node.attrs.find(e => e.name.includes('#')).name.substring(1);
27+
const content = file.content.split(gridRef + '.columns').join(gridRef + '.columnsCollection');
28+
host.overwrite(path, content);
29+
}
30+
});
31+
}
32+
33+
const getIndicesOf = (searchStr, str) => {
34+
if (searchStr.length === 0) {
35+
return [];
36+
}
37+
let startIndex = 0;
38+
let index = 0;
39+
const indexes = [];
40+
while ((index = str.indexOf(searchStr, startIndex)) > -1) {
41+
indexes.push(index);
42+
startIndex = index + searchStr.length;
43+
}
44+
return indexes;
45+
};
46+
47+
for (const path of tsFiles) {
48+
let content = host.read(path)?.toString();
49+
GRIDS.forEach(grid => {
50+
if (content.indexOf(grid) > -1) {
51+
const indexes = getIndicesOf('@ViewChild', content);
52+
indexes.forEach(index => {
53+
const viewChildRef = content.substring(index, content.indexOf(';', index)).replace(/\s\s+/g, ' ');
54+
if (viewChildRef.includes(grid)) {
55+
const gridDeclaration = viewChildRef.substring(viewChildRef.indexOf(')') + 1).replace(/\:/g, '').trim();
56+
const gridName = gridDeclaration.split(' ')[1];
57+
content = content.split(gridName + '.columns').join(gridName + '.columnsCollection');
58+
host.overwrite(path, content);
59+
}
60+
});
61+
}
62+
});
63+
}
1064
update.applyChanges();
1165
};

‎projects/igniteui-angular/src/lib/data-operations/pivot-strategy.ts

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -46,23 +46,21 @@ export class PivotRowDimensionsStrategy implements IPivotDimensionStrategy {
4646
hierarchies = PivotUtil.getFieldsHierarchy(collection, [row], PivotDimensionType.Row, pivotKeys);
4747
// generate flat data from the hierarchies
4848
data = PivotUtil.processHierarchy(hierarchies, collection[0] ?? [], pivotKeys, 0, true);
49-
row.fieldName = hierarchies.get(hierarchies.keys().next().value).dimension.fieldName;
5049
prevRowDims.push(row);
5150
prevDim = row;
5251
} else {
5352
const newData = [...data];
5453
for (let i = 0; i < newData.length; i++) {
55-
const currData = newData[i][prevDim.fieldName + '_' + pivotKeys.records];
54+
const currData = newData[i][prevDim.memberName + '_' + pivotKeys.records];
5655
const hierarchyFields = PivotUtil
5756
.getFieldsHierarchy(currData, [row], PivotDimensionType.Row, pivotKeys);
5857
const siblingData = PivotUtil
5958
.processHierarchy(hierarchyFields, newData[i] ?? [], pivotKeys, 0);
60-
row.fieldName = hierarchyFields.get(hierarchyFields.keys().next().value).dimension.fieldName;
6159
PivotUtil.processSiblingProperties(newData[i], siblingData, pivotKeys);
6260

6361
PivotUtil.processSubGroups(row, prevRowDims.slice(0), siblingData, pivotKeys);
6462
if (PivotUtil.getDimensionDepth(prevDim) > PivotUtil.getDimensionDepth(row)) {
65-
newData[i][row.fieldName + '_' + pivotKeys.records] = siblingData;
63+
newData[i][row.memberName + '_' + pivotKeys.records] = siblingData;
6664
} else {
6765
newData.splice(i , 1, ...siblingData);
6866
}

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -762,7 +762,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
762762
let fieldsMap;
763763
if (this.pivotConfiguration.columnStrategy && this.pivotConfiguration.columnStrategy instanceof NoopPivotDimensionsStrategy) {
764764
const fields = this.generateDataFields(data);
765-
const rowFields = PivotUtil.flatten(this.pivotConfiguration.rows).map(x => x.fieldName);
765+
const rowFields = PivotUtil.flatten(this.pivotConfiguration.rows).map(x => x.memberName);
766766
const keyFields = Object.values(this.pivotKeys);
767767
const filteredFields = fields.filter(x => rowFields.indexOf(x) === -1 && keyFields.indexOf(x) === -1 &&
768768
x.indexOf('_level') === -1 && x.indexOf('_records') === -1);

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.interface.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,12 @@ export interface IPivotConfiguration {
1919
export interface IPivotDimension {
2020
// allow defining a hierarchy when multiple sub groups need to be extracted from single member.
2121
childLevel?: IPivotDimension;
22-
// field name which to use to extract value or function that extract the value.
23-
member: string | ((data: any) => any);
22+
// field name which to use to extract value
23+
memberName: string;
24+
// function that extract the value
25+
memberFunction?: (data: any) => any;
2426
// Enables/Disables a particular dimension from pivot structure.
2527
enabled: boolean;
26-
// additional field name when using member as a function
27-
fieldName?: string;
2828
}
2929

3030
export interface IPivotValue {

0 commit comments

Comments
 (0)