Skip to content

Commit 26735c7

Browse files
refactor(react-grid): rename the changedRows Getter and dependent properties (#657)
BREAKING CHANGES: The following EditingState plugin's properties have been renamed to improve the API consistency: - `changedRows` => `rowChanges` - `defaultChangedRows` => `defaultRowChanges` - `onChangedRowsChange` => `onRowChangesChange` The `changedRows` getter has been renamed to `rowChanges`.
1 parent b7c2eac commit 26735c7

File tree

15 files changed

+86
-86
lines changed

15 files changed

+86
-86
lines changed
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export const getRowChange = (changedRows, rowId) => changedRows[rowId] || {};
1+
export const getRowChange = (rowChanges, rowId) => rowChanges[rowId] || {};

packages/dx-grid-core/src/plugins/editing-state/reducers.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,19 +25,19 @@ export const cancelAddedRows = (addedRows, { rowIds }) => {
2525
return result;
2626
};
2727

28-
export const changeRow = (prevChangedRows, { rowId, change }) => {
29-
const prevChange = prevChangedRows[rowId] || {};
28+
export const changeRow = (prevRowChanges, { rowId, change }) => {
29+
const prevChange = prevRowChanges[rowId] || {};
3030
return {
31-
...prevChangedRows,
31+
...prevRowChanges,
3232
[rowId]: {
3333
...prevChange,
3434
...change,
3535
},
3636
};
3737
};
3838

39-
export const cancelChanges = (prevChangedRows, { rowIds }) => {
40-
const result = { ...prevChangedRows };
39+
export const cancelChanges = (prevRowChanges, { rowIds }) => {
40+
const result = { ...prevRowChanges };
4141
rowIds.forEach((rowId) => {
4242
delete result[rowId];
4343
});

packages/dx-grid-core/src/plugins/editing-state/reducers.test.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -58,39 +58,39 @@ describe('EditingState reducers', () => {
5858
});
5959
describe('#changeRow', () => {
6060
it('should work on the first change', () => {
61-
const changedRows = {
61+
const rowChanges = {
6262
o1: { a: 1 },
6363
};
6464
const payload = { rowId: 'o2', change: { a: 2 } };
6565

66-
const nextChangedRows = changeRow(changedRows, payload);
67-
expect(nextChangedRows).toEqual({
66+
const nextRowChanges = changeRow(rowChanges, payload);
67+
expect(nextRowChanges).toEqual({
6868
o1: { a: 1 },
6969
o2: { a: 2 },
7070
});
7171
});
7272
it('should work on the second change', () => {
73-
const changedRows = {
73+
const rowChanges = {
7474
o1: { a: 1 },
7575
};
7676
const payload = { rowId: 'o1', change: { a: 2 } };
7777

78-
const nextChangedRows = changeRow(changedRows, payload);
79-
expect(nextChangedRows).toEqual({
78+
const nextRowChanges = changeRow(rowChanges, payload);
79+
expect(nextRowChanges).toEqual({
8080
o1: { a: 2 },
8181
});
8282
});
8383
});
8484
describe('#cancelChanges', () => {
8585
it('should work', () => {
86-
const changedRows = {
86+
const rowChanges = {
8787
o1: { a: 1 },
8888
o2: { a: 2 },
8989
};
9090
const payload = { rowIds: ['o2'] };
9191

92-
const nextChangedRows = cancelChanges(changedRows, payload);
93-
expect(nextChangedRows).toEqual({
92+
const nextRowChanges = cancelChanges(rowChanges, payload);
93+
expect(nextRowChanges).toEqual({
9494
o1: { a: 1 },
9595
});
9696
});

packages/dx-react-demos/src/bootstrap3/editing/edit-row-controlled.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,12 @@ export default class Demo extends React.PureComponent {
3838
}),
3939
editingRowIds: [],
4040
addedRows: [],
41-
changedRows: {},
41+
rowChanges: {},
4242
};
4343

4444
this.changeAddedRows = this.changeAddedRows.bind(this);
4545
this.changeEditingRowIds = this.changeEditingRowIds.bind(this);
46-
this.changeChangedRows = this.changeChangedRows.bind(this);
46+
this.changeRowChanges = this.changeRowChanges.bind(this);
4747
this.commitChanges = this.commitChanges.bind(this);
4848
}
4949
changeAddedRows(addedRows) {
@@ -53,8 +53,8 @@ export default class Demo extends React.PureComponent {
5353
changeEditingRowIds(editingRowIds) {
5454
this.setState({ editingRowIds });
5555
}
56-
changeChangedRows(changedRows) {
57-
this.setState({ changedRows });
56+
changeRowChanges(rowChanges) {
57+
this.setState({ rowChanges });
5858
}
5959
commitChanges({ added, changed, deleted }) {
6060
let { rows } = this.state;
@@ -79,7 +79,7 @@ export default class Demo extends React.PureComponent {
7979
}
8080
render() {
8181
const {
82-
rows, columns, tableColumnExtensions, editingRowIds, changedRows, addedRows,
82+
rows, columns, tableColumnExtensions, editingRowIds, rowChanges, addedRows,
8383
} = this.state;
8484

8585
return (
@@ -91,8 +91,8 @@ export default class Demo extends React.PureComponent {
9191
<EditingState
9292
editingRowIds={editingRowIds}
9393
onEditingRowIdsChange={this.changeEditingRowIds}
94-
changedRows={changedRows}
95-
onChangedRowsChange={this.changeChangedRows}
94+
rowChanges={rowChanges}
95+
onRowChangesChange={this.changeRowChanges}
9696
addedRows={addedRows}
9797
onAddedRowsChange={this.changeAddedRows}
9898
onCommitChanges={this.commitChanges}

packages/dx-react-demos/src/bootstrap3/featured-controlled-mode/demo.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,7 @@ export default class Demo extends React.PureComponent {
178178
sorting: [],
179179
editingRowIds: [],
180180
addedRows: [],
181-
changedRows: {},
181+
rowChanges: {},
182182
currentPage: 0,
183183
deletingRows: [],
184184
pageSize: 0,
@@ -198,7 +198,7 @@ export default class Demo extends React.PureComponent {
198198
customer: availableValues.customer[0],
199199
})),
200200
});
201-
this.changeChangedRows = changedRows => this.setState({ changedRows });
201+
this.changeRowChanges = rowChanges => this.setState({ rowChanges });
202202
this.changeCurrentPage = currentPage => this.setState({ currentPage });
203203
this.changePageSize = pageSize => this.setState({ pageSize });
204204
this.commitChanges = ({ added, changed, deleted }) => {
@@ -241,7 +241,7 @@ export default class Demo extends React.PureComponent {
241241
sorting,
242242
editingRowIds,
243243
addedRows,
244-
changedRows,
244+
rowChanges,
245245
currentPage,
246246
deletingRows,
247247
pageSize,
@@ -273,8 +273,8 @@ export default class Demo extends React.PureComponent {
273273
<EditingState
274274
editingRowIds={editingRowIds}
275275
onEditingRowIdsChange={this.changeEditingRowIds}
276-
changedRows={changedRows}
277-
onChangedRowsChange={this.changeChangedRows}
276+
rowChanges={rowChanges}
277+
onRowChangesChange={this.changeRowChanges}
278278
addedRows={addedRows}
279279
onAddedRowsChange={this.changeAddedRows}
280280
onCommitChanges={this.commitChanges}

packages/dx-react-demos/src/material-ui/editing/edit-row-controlled.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,12 @@ export default class Demo extends React.PureComponent {
3838
}),
3939
editingRowIds: [],
4040
addedRows: [],
41-
changedRows: {},
41+
rowChanges: {},
4242
};
4343

4444
this.changeAddedRows = this.changeAddedRows.bind(this);
4545
this.changeEditingRowIds = this.changeEditingRowIds.bind(this);
46-
this.changeChangedRows = this.changeChangedRows.bind(this);
46+
this.changeRowChanges = this.changeRowChanges.bind(this);
4747
this.commitChanges = this.commitChanges.bind(this);
4848
}
4949
changeAddedRows(addedRows) {
@@ -53,8 +53,8 @@ export default class Demo extends React.PureComponent {
5353
changeEditingRowIds(editingRowIds) {
5454
this.setState({ editingRowIds });
5555
}
56-
changeChangedRows(changedRows) {
57-
this.setState({ changedRows });
56+
changeRowChanges(rowChanges) {
57+
this.setState({ rowChanges });
5858
}
5959
commitChanges({ added, changed, deleted }) {
6060
let { rows } = this.state;
@@ -79,7 +79,7 @@ export default class Demo extends React.PureComponent {
7979
}
8080
render() {
8181
const {
82-
rows, columns, tableColumnExtensions, editingRowIds, changedRows, addedRows,
82+
rows, columns, tableColumnExtensions, editingRowIds, rowChanges, addedRows,
8383
} = this.state;
8484

8585
return (
@@ -92,8 +92,8 @@ export default class Demo extends React.PureComponent {
9292
<EditingState
9393
editingRowIds={editingRowIds}
9494
onEditingRowIdsChange={this.changeEditingRowIds}
95-
changedRows={changedRows}
96-
onChangedRowsChange={this.changeChangedRows}
95+
rowChanges={rowChanges}
96+
onRowChangesChange={this.changeRowChanges}
9797
addedRows={addedRows}
9898
onAddedRowsChange={this.changeAddedRows}
9999
onCommitChanges={this.commitChanges}

packages/dx-react-demos/src/material-ui/featured-controlled-mode/demo.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -216,7 +216,7 @@ class DemoBase extends React.PureComponent {
216216
sorting: [],
217217
editingRowIds: [],
218218
addedRows: [],
219-
changedRows: {},
219+
rowChanges: {},
220220
currentPage: 0,
221221
deletingRows: [],
222222
pageSize: 0,
@@ -236,7 +236,7 @@ class DemoBase extends React.PureComponent {
236236
customer: availableValues.customer[0],
237237
})),
238238
});
239-
this.changeChangedRows = changedRows => this.setState({ changedRows });
239+
this.changeRowChanges = rowChanges => this.setState({ rowChanges });
240240
this.changeCurrentPage = currentPage => this.setState({ currentPage });
241241
this.changePageSize = pageSize => this.setState({ pageSize });
242242
this.commitChanges = ({ added, changed, deleted }) => {
@@ -282,7 +282,7 @@ class DemoBase extends React.PureComponent {
282282
sorting,
283283
editingRowIds,
284284
addedRows,
285-
changedRows,
285+
rowChanges,
286286
currentPage,
287287
deletingRows,
288288
pageSize,
@@ -314,8 +314,8 @@ class DemoBase extends React.PureComponent {
314314
<EditingState
315315
editingRowIds={editingRowIds}
316316
onEditingRowIdsChange={this.changeEditingRowIds}
317-
changedRows={changedRows}
318-
onChangedRowsChange={this.changeChangedRows}
317+
rowChanges={rowChanges}
318+
onRowChangesChange={this.changeRowChanges}
319319
addedRows={addedRows}
320320
onAddedRowsChange={this.changeAddedRows}
321321
onCommitChanges={this.commitChanges}

packages/dx-react-grid/docs/guides/editing.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ In the [uncontrolled mode](controlled-and-uncontrolled-modes.md), you can specif
2424

2525
- `defaultEditingRowIds` - the rows being edited
2626
- `defaultAddedRows` - the rows being added
27-
- `defaultChangedRows` - the changed rows
27+
- `defaultRowChanges` - the row changes
2828
- `defaultDeletedRowIds` - the rows being deleted
2929

3030
.embedded-demo(editing/edit-row)
@@ -35,7 +35,7 @@ In the [controlled mode](controlled-and-uncontrolled-modes.md), specify the foll
3535

3636
- `editingRowIds` and `onEditingRowIdsChange` - the rows being edited
3737
- `addedRows` and `onAddedRowsChange` - the rows being added
38-
- `changedRows` and `onChangedRowsChange` - the changed rows
38+
- `rowChanges` and `onRowChangesChange` - the row changes
3939
- `deletedRowIds` and `onDeletedRowIdsChange` - the rows being deleted
4040

4141
Note, you can also use the `onAddedRowsChange` event to initialize a created row with default property values.

packages/dx-react-grid/docs/reference/editing-state.md

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -12,19 +12,19 @@ none
1212

1313
Name | Type | Default | Description
1414
-----|------|---------|------------
15-
createRowChange | (row: any, columnName: string, value: string &#124; number) => any | | A function that returns a row changes object depending on row editor values. This function is called each time the row editor's value changes.
15+
createRowChange | (row: any, columnName: string, value: string &#124; number) => any | | A function that returns a row change object depending on row editor values. This function is called each time the row editor's value changes.
1616
columnExtensions | Array&lt;[EditingColumnExtension](#editingcolumnextension)&gt; | | Additional column properties that the plugin can handle.
17-
editingRowIds | Array&lt;number &#124; string&gt; | | Specifies IDs of the rows being edited.
18-
defaultEditingRowIds | Array&lt;number &#124; string&gt; | [] | Specifies IDs of the rows initially added to the `editingRowIds` array in uncontrolled mode.
17+
editingRowIds | Array&lt;number &#124; string&gt; | | IDs of the rows being edited.
18+
defaultEditingRowIds | Array&lt;number &#124; string&gt; | [] | IDs of the rows initially added to the `editingRowIds` array in uncontrolled mode.
1919
onEditingRowIdsChange | (editingRowIds: Array&lt;number &#124; string&gt;) => void | | Handles adding or removing a row to/from the `editingRowIds` array.
20-
addedRows | Array&lt;any&gt; | | Specifies created but not committed rows.
21-
defaultAddedRows | Array&lt;any&gt; | [] | Specifies rows initially added to the `addedRows` array in uncontrolled mode.
20+
addedRows | Array&lt;any&gt; | | Created but not committed rows.
21+
defaultAddedRows | Array&lt;any&gt; | [] | Rows initially added to the `addedRows` array in uncontrolled mode.
2222
onAddedRowsChange | (addedRows: Array&lt;any&gt;) => void | | Handles adding or removing a row to/from the `addedRows` array.
23-
changedRows | { [key: string]: any } | | Specifies changed but not committed rows.
24-
defaultChangedRows | { [key: string]: any } | {} | Specifies rows initially added to the `changedRows` array in uncontrolled mode.
25-
onChangedRowsChange | (changedRows: { [key: string]: any }) => void | | Handles adding or removing a row to/from the `changedRows` array.
26-
deletedRowIds | Array&lt;number &#124; string&gt; | | Specifies IDs of the rows prepared for deletion.
27-
defaultDeletedRowIds | Array&lt;number &#124; string&gt; | [] | Specifies rows initially added to the `deletedRowIds` array in uncontrolled mode.
23+
rowChanges | { [key: string]: any } | | Not committed row changes.
24+
defaultRowChanges | { [key: string]: any } | {} | Row changes initially added to the `rowChanges` array in uncontrolled mode.
25+
onRowChangesChange | (rowChanges: { [key: string]: any }) => void | | Handles adding or removing a row changes to/from the `rowChanges` array.
26+
deletedRowIds | Array&lt;number &#124; string&gt; | | IDs of the rows prepared for deletion.
27+
defaultDeletedRowIds | Array&lt;number &#124; string&gt; | [] | Rows initially added to the `deletedRowIds` array in uncontrolled mode.
2828
onDeletedRowIdsChange | (deletedRowIds: Array&lt;number &#124; string&gt;) => void | | Handles adding a row to or removing from the `deletedRowIds` array.
2929
onCommitChanges | (Array&lt;[ChangeSet](#change-set)&gt;) => void | | Handles row changes committing.
3030

@@ -39,7 +39,7 @@ A value with the following shape:
3939
Field | Type | Description
4040
------|------|------------
4141
columnName | string | The name of a column to extend.
42-
createRowChange? | (row: any, value: any, columnName: string) => any | A function that returns a value specifying row changes depending on the columns's editor values for the current row. This function is called each time the editor's value changes.
42+
createRowChange? | (row: any, value: any, columnName: string) => any | A function that returns a value specifying row changes depending on the columns' editor values for the current row. This function is called each time the editor's value changes.
4343

4444
### ChangeSet
4545

@@ -69,14 +69,14 @@ stopEditRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void
6969
addedRows | Getter | Array&lt;any&gt; | Created but not committed rows.
7070
addRow | Action | () => void | Adds an item to the `addedRows` array.
7171
changeAddedRow | Action | ({ rowId: number, change: any }) => void | Applies a change to a created but uncommitted row. Note: `rowId` is a row index within the `addedRows` array.
72-
cancelAddedRows | Action | ({ rowIds: Array&lt;number&gt; }) => void | Removes specified rows from the `addedRows` array.
72+
cancelAddedRows | Action | ({ rowIds: Array&lt;number&gt; }) => void | Removes the specified rows from the `addedRows` array.
7373
commitAddedRows | Action | ({ rowIds: Array&lt;number&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](#changeset) and removes specified rows from the `addedRows` array.
74-
changedRows | Getter | { [key: string]: any } | An associated array that stores changes made to existing rows. Each array item specifies changes made to a row. The item's key specifies the associated row's ID.
75-
changeRow | Action | ({ rowId: number &#124; string, change: any }) => void | Adds an item representing changes made to an exsiting row to the `changedRows` array.
76-
cancelChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Removes specified rows' data from the `changedRows` array.
77-
commitChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](#changeset) and removes specified rows from the `changedRows` array.
74+
rowChanges | Getter | { [key: string]: any } | An associated array that stores changes made to existing rows. Each array item specifies changes made to a row. The item's key specifies the associated row's ID.
75+
changeRow | Action | ({ rowId: number &#124; string, change: any }) => void | Adds an item representing changes made to an exsiting row to the `rowChanges` array.
76+
cancelChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Removes specified rows' data from the `rowChanges` array.
77+
commitChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](#changeset) and removes specified rows from the `rowChanges` array.
7878
deletedRowIds | Getter | Array&lt;number &#124; string&gt; | Rows prepared for deletion.
7979
deleteRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Adds rows the ID specifies to the `deletedRowIds` array.
80-
cancelDeletedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Removes specified rows from the `deletedRowIds` array.
80+
cancelDeletedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Removes the specified rows from the `deletedRowIds` array.
8181
commitDeletedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](#changeset) and removes specified rows from the `deletedRowIds` array.
82-
createRowChange | Getter | (row: any, value: any, columnName: string) => any | A function that returns a value that specifies row changes depending on columns editor values for the current row. This function is called each time the editor's value changes.
82+
createRowChange | Getter | (row: any, value: any, columnName: string) => any | A function that returns a value that specifies row changes depending on the column's editor values for the current row. This function is called each time the editor's value changes.

packages/dx-react-grid/docs/reference/table-edit-column.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ cancelCommand? | string | 'Cancel' | Specifies the cancel command button text.
7373

7474
Name | Properties | Description
7575
-----|------------|------------
76-
TableEditColumn.Command | [EditCommandProps](#editcommandprops) | A component that renders command control within a command cell.
76+
TableEditColumn.Command | [EditCommandProps](#editcommandprops) | A component that renders a command control within a command cell.
7777
TableEditColumn.Cell | [TableEditColumnCellProps](#tableeditcolumncellprops) | A component that renders a command cell within a data row.
7878
TableEditColumn.HeaderCell | [TableEditColumnHeaderCellProps](#tableeditcolumnheadercellprops) | A component that renders a command cell within the header row.
7979

@@ -92,8 +92,8 @@ commitAddedRows | Action | ({ rowIds: Array&lt;number&gt; }) => void | Fires the
9292
startEditRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Switches rows with the specified ID to the edit mode.
9393
stopEditRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Switches rows with the specified ID to the read-only mode.
9494
cancelChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Cancels uncommitted changes in rows with the specified ID.
95-
commitChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](editing-state.md#changeset) and removes specified rows from the `changedRows` array.
96-
deleteRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Prepares rows with the specified ID for deletion by adding them to the `deletedRowIds` array.
95+
commitChangedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](editing-state.md#changeset) and removes specified rows from the `rowChanges` array.
96+
deleteRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Prepares rows with the specified ID for deletion by adding them to the `deletedRows` array.
9797
commitDeletedRows | Action | ({ rowIds: Array&lt;number &#124; string&gt; }) => void | Fires the `onCommitChanges` event with the corresponding [ChangeSet](editing-state.md#changeset) and removes specified rows from the `deletedRowIds` array.
9898
tableCell | Template | [TableCellProps](table.md#tablecellprops) | A template that renders a table cell.
9999

0 commit comments

Comments
 (0)