Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[core] Remove use of getState #2300

Merged
merged 4 commits into from
Aug 12, 2021
Merged

[core] Remove use of getState #2300

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
fbda90c
[core] Remvoe usage of getState
oliviertassinari Aug 7, 2021
e04219c
Merge branch 'master' into HEAD
m4theushw Aug 11, 2021
9a3f2d2
replace remaining getState()
m4theushw Aug 11, 2021
a23d4df
make getState private
m4theushw Aug 11, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -203,7 +203,7 @@ Big thanks to the 11 contributors who made this release possible. Here are some

```diff
-const filterState = apiRef.current.getState('filter');
+const filterState = apiRef.current.getState().filter;
+const filterState = apiRef.current.state.filter;
```

- [DataGrid] Improve controllable sorting (#2095) @dtassone
Expand Down
1 change: 0 additions & 1 deletion docs/pages/api-docs/data-grid/grid-api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,6 @@ import { GridApi } from '@material-ui/x-grid';
| <span class="prop-name">getSortedRowIds</span> | <span class="prop-type">() =&gt; GridRowId[]</span> | Returns all row ids sorted according to the active sort model. |
| <span class="prop-name">getSortedRows</span> | <span class="prop-type">() =&gt; GridRowData[]</span> | Returns all rows sorted according to the active sort model. |
| <span class="prop-name">getSortModel</span> | <span class="prop-type">() =&gt; GridSortModel</span> | Returns the sort model currently applied to the grid. |
| <span class="prop-name">getState</span> | <span class="prop-type">() =&gt; GridState</span> | Returns the state of the grid. |
| <span class="prop-name">getVisibleColumns</span> | <span class="prop-type">() =&gt; GridStateColDef[]</span> | Returns the currently visible columns. |
| <span class="prop-name">getVisibleRowModels</span> | <span class="prop-type">() =&gt; Map&lt;GridRowId, GridRowData&gt;</span> | Returns a sorted `Map` containing only the visible rows. |
| <span class="prop-name">hideColumnMenu</span> | <span class="prop-type">() =&gt; void</span> | Hides the column menu that is open. |
Expand Down
4 changes: 1 addition & 3 deletions packages/grid/_modules_/grid/components/columnHeaders/ColumnHeaderFilterIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,7 @@ export function ColumnHeaderFilterIcon(props: ColumnHeaderFilterIconProps) {
event.preventDefault();
event.stopPropagation();

const { open, openedPanelValue } = gridPreferencePanelStateSelector(
apiRef!.current.getState(),
);
const { open, openedPanelValue } = gridPreferencePanelStateSelector(apiRef!.current.state);

if (open && openedPanelValue === GridPreferencePanelsValue.filters) {
apiRef!.current.hideFilterPanel();
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/components/columnHeaders/GridColumnHeaderItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,7 @@ export function GridColumnHeaderItem(props: GridColumnHeaderItemProps) {
);

React.useLayoutEffect(() => {
const columnMenuState = apiRef!.current.getState().columnMenu;
const columnMenuState = apiRef!.current.state.columnMenu;
if (hasFocus && !columnMenuState.open) {
const focusableElement = headerCellRef.current!.querySelector(
'[tabindex="0"]',
Expand Down
4 changes: 2 additions & 2 deletions packages/grid/_modules_/grid/components/columnSelection/GridHeaderCheckbox.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@ export const GridHeaderCheckbox = React.forwardRef<HTMLInputElement, GridColumnH
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
const checked = event.target.checked;
const rowsToBeSelected = options.checkboxSelectionVisibleOnly
? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef.current.getState())
: visibleSortedGridRowIdsSelector(apiRef.current.getState());
? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef.current.state)
: visibleSortedGridRowIdsSelector(apiRef.current.state);
apiRef!.current.selectRows(rowsToBeSelected, checked, !event.target.indeterminate);
};

Expand Down
6 changes: 3 additions & 3 deletions packages/grid/_modules_/grid/hooks/features/columns/useGridColumns.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -198,7 +198,7 @@ export function useGridColumns(
logger.debug('updating GridColumns with new state');

// Avoid dependency on gridState to avoid infinite loop
const refGridState = apiRef.current.getState();
const refGridState = apiRef.current.state;
const newColumns: GridColumns = newState.all.map((field) => newState.lookup[field]);
const updatedCols = getStateColumns(newColumns, refGridState.viewportSizes.width);

Expand All @@ -215,7 +215,7 @@ export function useGridColumns(
const updateColumns = React.useCallback(
(cols: GridColDef[]) => {
// Avoid dependency on gridState to avoid infinite loop
const newState = upsertColumnsState(cols, apiRef.current.getState().columns);
const newState = upsertColumnsState(cols, apiRef.current.state.columns);
setColumnsState(newState, false);
},
[apiRef, setColumnsState],
Expand Down Expand Up @@ -335,7 +335,7 @@ export function useGridColumns(
`GridColumns gridState.viewportSizes.width, changed ${gridState.viewportSizes.width}`,
);
// Avoid dependency on gridState as I only want to update cols when viewport size changed.
const currentColumns = allGridColumnsSelector(apiRef.current.getState());
const currentColumns = allGridColumnsSelector(apiRef.current.state);

apiRef.current.updateColumns(currentColumns);
}, [apiRef, gridState.viewportSizes.width, logger]);
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/hooks/features/filter/useGridFilter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -284,7 +284,7 @@ export const useGridFilter = (

const onColUpdated = React.useCallback(() => {
logger.debug('onColUpdated - GridColumns changed, applying filters');
const filterState = apiRef.current.getState().filter;
const filterState = apiRef.current.state.filter;
const columnsIds = filterableGridColumnsIdsSelector(apiRef.current.state);
logger.debug('GridColumns changed, applying filters');

Expand Down
8 changes: 4 additions & 4 deletions packages/grid/_modules_/grid/hooks/features/focus/useGridFocus.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const useGridFocus = (apiRef: GridApiRef, props: Pick<GridComponentProps,

const setColumnHeaderFocus = React.useCallback(
(field: string, event?: React.SyntheticEvent) => {
const { cell } = apiRef.current.getState().focus;
const { cell } = apiRef.current.state.focus;
if (cell) {
apiRef.current.publishEvent(
GridEvents.cellFocusOut,
Expand Down Expand Up @@ -103,7 +103,7 @@ export const useGridFocus = (apiRef: GridApiRef, props: Pick<GridComponentProps,
const cellParams = lastClickedCell.current;
lastClickedCell.current = null;

const { cell: focusedCell } = apiRef.current.getState().focus;
const { cell: focusedCell } = apiRef.current.state.focus;

if (!focusedCell) {
if (cellParams) {
Expand Down Expand Up @@ -147,7 +147,7 @@ export const useGridFocus = (apiRef: GridApiRef, props: Pick<GridComponentProps,
if (params.cellMode === 'view') {
return;
}
const { cell } = apiRef.current.getState().focus;
const { cell } = apiRef.current.state.focus;
if (cell?.id !== params.id || cell?.field !== params.field) {
apiRef.current.setCellFocus(params.id, params.field);
}
Expand All @@ -165,7 +165,7 @@ export const useGridFocus = (apiRef: GridApiRef, props: Pick<GridComponentProps,
);

React.useEffect(() => {
const { cell } = apiRef.current.getState().focus;
const { cell } = apiRef.current.state.focus;

if (cell) {
const updatedRow = apiRef.current.getRow(cell.id);
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/hooks/features/keyboard/useGridKeyboard.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export const useGridKeyboard = (apiRef: GridApiRef): void => {

apiRef.current.publishEvent(GridEvents.cellNavigationKeyDown, params, event);

const focusCell = apiRef.current.getState().focus.cell!;
const focusCell = apiRef.current.state.focus.cell!;
const rowIndex = apiRef.current.getRowIndex(focusCell.id);
// We select the rows in between
const rowIds = Array(Math.abs(rowIndex - selectionFromRowIndex) + 1).fill(
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/hooks/features/pagination/useGridPageSize.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export const useGridPageSize = (

React.useEffect(() => {
const autoPageSize = containerSizes?.viewportPageSize;
const prevPageSize = apiRef.current.getState().pagination.pageSize;
const prevPageSize = apiRef.current.state.pagination.pageSize;

let pageSize = prevPageSize;

Expand Down
8 changes: 4 additions & 4 deletions packages/grid/_modules_/grid/hooks/features/rows/useGridEditRows.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export function useGridEditRows(
);

const handleColumnHeaderDragStart = useEventCallback((nativeEvent) => {
const { cell } = apiRef.current.getState().focus;
const { cell } = apiRef.current.state.focus;
if (!cell) {
return;
}
Expand Down Expand Up @@ -99,7 +99,7 @@ export function useGridEditRows(

const getCellMode = React.useCallback(
(id, field) => {
const editState = apiRef.current.getState().editRows;
const editState = apiRef.current.state.editRows;
const isEditing = editState[id] && editState[id][field];
return isEditing ? 'edit' : 'view';
},
Expand Down Expand Up @@ -166,7 +166,7 @@ export function useGridEditRows(
);

const getEditRowsModel = React.useCallback(
(): GridEditRowsModel => apiRef.current.getState().editRows,
(): GridEditRowsModel => apiRef.current.state.editRows,
[apiRef],
);

Expand Down Expand Up @@ -333,7 +333,7 @@ export function useGridEditRows(
}, [apiRef, props.editRowsModel, props.onEditRowsModelChange]);

React.useEffect(() => {
const currentEditRowsModel = apiRef.current.getState().editRows;
const currentEditRowsModel = apiRef.current.state.editRows;

if (props.editRowsModel !== undefined && props.editRowsModel !== currentEditRowsModel) {
apiRef.current.setEditRowsModel(props.editRowsModel || {});
Expand Down
8 changes: 4 additions & 4 deletions packages/grid/_modules_/grid/hooks/features/rows/useGridParamsApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,8 +62,8 @@ export function useGridParamsApi(apiRef: GridApiRef) {
throw new Error(`No row with id #${id} found`);
}

const cellFocus = gridFocusCellSelector(apiRef.current.getState());
const cellTabIndex = gridTabIndexCellSelector(apiRef.current.getState());
const cellFocus = gridFocusCellSelector(apiRef.current.state);
const cellTabIndex = gridTabIndexCellSelector(apiRef.current.state);

const params: GridValueGetterParams = {
id,
Expand Down Expand Up @@ -93,8 +93,8 @@ export function useGridParamsApi(apiRef: GridApiRef) {
throw new Error(`No row with id #${id} found`);
}

const cellFocus = gridFocusCellSelector(apiRef.current.getState());
const cellTabIndex = gridTabIndexCellSelector(apiRef.current.getState());
const cellFocus = gridFocusCellSelector(apiRef.current.state);
const cellTabIndex = gridTabIndexCellSelector(apiRef.current.state);

const params: GridCellParams = {
id,
Expand Down
4 changes: 2 additions & 2 deletions packages/grid/_modules_/grid/hooks/features/selection/useGridSelection.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export const useGridSelection = (apiRef: GridApiRef, props: GridComponentProps):
options;

const getSelectedRows = React.useCallback(
() => selectedGridRowsSelector(apiRef.current.getState()),
() => selectedGridRowsSelector(apiRef.current.state),
[apiRef],
);

Expand Down Expand Up @@ -153,7 +153,7 @@ export const useGridSelection = (apiRef: GridApiRef, props: GridComponentProps):

const setSelectionModel = React.useCallback<GridSelectionApi['setSelectionModel']>(
(model) => {
const currentModel = apiRef.current.getState().selection;
const currentModel = apiRef.current.state.selection;
if (currentModel !== model) {
setGridState((state) => ({ ...state, selection: model }));
}
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/hooks/features/sorting/useGridSorting.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -157,7 +157,7 @@ export const useGridSorting = (
return;
}

const sortModel = apiRef.current.getState().sorting.sortModel;
const sortModel = apiRef.current.state.sorting.sortModel;

if (sortModel.length > 0) {
const comparatorList = buildComparatorList(sortModel);
Expand Down
4 changes: 2 additions & 2 deletions packages/grid/_modules_/grid/hooks/features/virtualization/useGridVirtualRows.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,7 +134,7 @@ export const useGridVirtualRows = (apiRef: GridApiRef): void => {

const updateViewport = React.useCallback(
(forceReRender = false) => {
const lastState = apiRef.current.getState();
const lastState = apiRef.current.state;
const containerProps = lastState.containerSizes;
if (!windowRef || !windowRef.current || !containerProps) {
return;
Expand Down Expand Up @@ -302,7 +302,7 @@ export const useGridVirtualRows = (apiRef: GridApiRef): void => {
);

const getScrollPosition = React.useCallback(
() => scrollStateSelector(apiRef.current.getState()),
() => scrollStateSelector(apiRef.current.state),
[apiRef],
);

Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/hooks/utils/useResizeContainer.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export function useResizeContainer(
gridLogger.debug(`resizing...`);

apiRef.current.publishEvent(GridEvents.debouncedResize, {
containerSize: apiRef.current.getState().containerSizes?.windowSizes,
containerSize: apiRef.current.state.containerSizes?.windowSizes,
});
}, [apiRef, gridLogger]);

Expand Down
4 changes: 2 additions & 2 deletions packages/grid/_modules_/grid/models/api/gridStateApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ export interface GridStateApi {
state: GridState;
/**
* Returns the state of the grid.
* @param {string} stateId The part of the state to be returned.
* @returns {any} The state of the grid.
* @returns {GridState} The state of the grid.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we not document it for now?

Suggested change
* @returns {GridState} The state of the grid.
* @returns {GridState} The state of the grid.
* @ignore - do not document.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we stop using it internally, we can just remove it.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@flaviendelangle Removing the method would be a breaking change. We can move more iteratively.

* @ignore - do not document.
*/
getState: () => GridState;
/**
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/_modules_/grid/models/colDef/gridCheckboxSelection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export const gridCheckboxSelectionColDef: GridColDef = {
disableColumnMenu: true,
disableReorder: true,
valueGetter: (params) => {
const selectionLookup = selectedIdsLookupSelector(params.api.getState());
const selectionLookup = selectedIdsLookupSelector(params.api.state);
return selectionLookup[params.id] !== undefined;
},
renderHeader: (params) => <GridHeaderCheckbox {...params} />,
Expand Down
2 changes: 1 addition & 1 deletion packages/grid/x-grid/src/tests/filtering.XGrid.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -253,7 +253,7 @@ describe('<XGrid /> - Filter', () => {
render(<TestCase checkboxSelection filterModel={newModel} />);
const checkAllCell = getColumnHeaderCell(0).querySelector('input');
fireEvent.click(checkAllCell);
expect(apiRef.current.getState().selection).to.deep.equal([1]);
expect(apiRef.current.state.selection).to.deep.equal([1]);
});

it('should allow to clear filters by passing an empty filter model', () => {
Expand Down
Loading