Skip to content

Commit

Permalink
fix typescript
Browse files Browse the repository at this point in the history
  • Loading branch information
@alexfauquette
alexfauquette committed Jun 20, 2022
1 parent a8a52a2 commit be02aa1
Show file tree
Hide file tree
Showing 4 changed files with 30 additions and 22 deletions.
6 changes: 3 additions & 3 deletions docs/pages/x/api/data-grid/grid-api.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,14 +25,14 @@ import { GridApi } from '@mui/x-data-grid-pro';
| <span class="prop-name">exportState</span> | <span class="prop-type">() =&gt; InitialState</span> | Generates a serializable object containing the exportable parts of the DataGrid state.<br />These values can then be passed to the `initialState` prop or injected using the `restoreState` method. |
| <span class="prop-name">forceUpdate</span> | <span class="prop-type">() =&gt; void</span> | Forces the grid to rerender. It's often used after a state update. |
| <span class="prop-name">getAllColumns</span> | <span class="prop-type">() =&gt; GridStateColDef[]</span> | Returns an array of [GridColDef](/x/api/data-grid/grid-col-def/) containing all the column definitions. |
| <span class="prop-name">getAllGroupDetails</span> | <span class="prop-type">() =&gt; GridColumnGroupLookup</span> | returns the column group lookup. |
| <span class="prop-name">getAllGroupDetails</span> | <span class="prop-type">() =&gt; GridColumnGroupLookup</span> | Returns the column group lookup. |
| <span class="prop-name">getAllRowIds</span> | <span class="prop-type">() =&gt; GridRowId[]</span> | Gets the list of row ids. |
| <span class="prop-name">getCellElement</span> | <span class="prop-type">(id: GridRowId, field: string) =&gt; HTMLDivElement \| null</span> | Gets the underlying DOM element for a cell at the given `id` and `field`. |
| <span class="prop-name">getCellMode</span> | <span class="prop-type">(id: GridRowId, field: string) =&gt; GridCellMode</span> | Gets the mode of a cell. |
| <span class="prop-name">getCellParams</span> | <span class="prop-type">&lt;V = any, R extends GridValidRowModel = any, F = V&gt;(id: GridRowId, field: string) =&gt; GridCellParams&lt;R, V, F&gt;</span> | Gets the [GridCellParams](/x/api/data-grid/grid-cell-params/) object that is passed as argument in events. |
| <span class="prop-name">getCellValue</span> | <span class="prop-type">&lt;V extends any = any&gt;(id: GridRowId, field: string) =&gt; V</span> | Gets the value of a cell at the given `id` and `field`. |
| <span class="prop-name">getColumn</span> | <span class="prop-type">(field: string) =&gt; GridStateColDef</span> | Returns the [GridColDef](/x/api/data-grid/grid-col-def/) for the given `field`. |
| <span class="prop-name">getColumnGroupPath</span> | <span class="prop-type">(field: string) =&gt; GridColumnGroup['groupId'][]</span> | returns the array of groupId applied on the column `field`. |
| <span class="prop-name">getColumnGroupPath</span> | <span class="prop-type">(field: string) =&gt; GridColumnGroup['groupId'][]</span> | Returns the array of groupId applied on the column `field`. |
| <span class="prop-name">getColumnHeaderElement</span> | <span class="prop-type">(field: string) =&gt; HTMLDivElement \| null</span> | Gets the underlying DOM element for the column header with the given `field`. |
| <span class="prop-name">getColumnHeaderParams</span> | <span class="prop-type">(field: string) =&gt; GridColumnHeaderParams</span> | Gets the GridColumnHeaderParams object that is passed as argument in events. |
| <span class="prop-name">getColumnIndex</span> | <span class="prop-type">(field: string, useVisibleColumns?: boolean) =&gt; number</span> | Returns the index position of a column. By default, only the visible columns are considered.<br />Pass `false` to `useVisibleColumns` to consider all columns. |
Expand All @@ -42,7 +42,7 @@ import { GridApi } from '@mui/x-data-grid-pro';
| <span class="prop-name">getDataAsExcel [<span class="plan-premium" title="Premium plan"></span>](https://mui.com/store/items/material-ui-premium/)</span> | <span class="prop-type">(options?: GridExcelExportOptions) =&gt; Promise&lt;Excel.Workbook&gt; \| null</span> | Returns the grid data as an exceljs workbook.<br />This method is used internally by `exportDataAsExcel`. |
| <span class="prop-name">getEditRowsModel</span> | <span class="prop-type">() =&gt; GridEditRowsModel</span> | Gets the edit rows model of the grid. |
| <span class="prop-name">getExpandedDetailPanels [<span class="plan-pro" title="Pro plan"></span>](https://mui.com/store/items/mui-x-pro/)</span> | <span class="prop-type">() =&gt; GridRowId[]</span> | Returns the rows whose detail panel is open. |
| <span class="prop-name">getGroupDetails</span> | <span class="prop-type">(groupId: string) =&gt; Omit&lt;GridColumnGroup, 'children'&gt; \| null</span> | returns the details about a group corresponding to `groupId`. |
| <span class="prop-name">getGroupDetails</span> | <span class="prop-type">(groupId: string) =&gt; Omit&lt;GridColumnGroup, 'children'&gt; \| null</span> | Returns the details about a group corresponding to `groupId`. |
| <span class="prop-name">getLocaleText</span> | <span class="prop-type">&lt;T extends GridTranslationKeys&gt;(key: T) =&gt; GridLocaleText[T]</span> | Returns the translation for the `key`. |
| <span class="prop-name">getPinnedColumns [<span class="plan-pro" title="Pro plan"></span>](https://mui.com/store/items/mui-x-pro/)</span> | <span class="prop-type">() =&gt; GridPinnedColumns</span> | Returns which columns are pinned. |
| <span class="prop-name">getRootDimensions</span> | <span class="prop-type">() =&gt; GridDimensions \| null</span> | Returns the dimensions of the grid |
Expand Down
6 changes: 4 additions & 2 deletions packages/grid/x-data-grid/src/components/columnHeaders/GridColumnGroupHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ interface GridColumnGroupHeaderProps {
groupId: string | null;
width: number;
fields: string[];
// colIndex: number; TODO: use this prop to get accessible column group
colIndex: number; // TODO: use this prop to get accessible column group
}

type OwnerState = GridColumnGroupHeaderProps & {
Expand All @@ -37,7 +37,7 @@ const useUtilityClasses = (ownerState: OwnerState) => {
};

function GridColumnGroupHeader(props: GridColumnGroupHeaderProps) {
const { groupId, width, fields } = props;
const { groupId, width, fields, colIndex } = props;

const rootProps = useGridRootProps();

Expand Down Expand Up @@ -66,7 +66,9 @@ function GridColumnGroupHeader(props: GridColumnGroupHeaderProps) {
minWidth: width,
maxWidth: width,
}}
// TODO: move role to columnheader and data-col-index to colIndex
role="presentation"
data-col-index={colIndex}
>
<div className={classes.titleContainer}>
<div className={classes.titleContainerContent}>
Expand Down
24 changes: 15 additions & 9 deletions packages/grid/x-data-grid/src/hooks/features/columns/useGridColumnGrouping.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,13 @@ import { GridColumnGroupLookup } from './gridColumnsInterfaces';
import { GridColumnGroupingApi } from '../../../models/api/gridColumnGroupingApi';
import { useGridApiMethod } from '../../utils/useGridApiMethod';
import { isDeepEqual } from '../../../utils/utils';
import { GridStateColDef, GridColDef } from '../../../models/colDef';

export function hasGroupPath(
lookupElement: GridColDef | GridStateColDef,
): lookupElement is GridStateColDef {
return (<GridStateColDef>lookupElement).groupPath !== undefined;
}

type UnwrappedGroupingModel = { [key: string]: string[] };

Expand Down Expand Up @@ -166,17 +173,16 @@ export const useGridColumnGrouping = (

columnsState.all.forEach((field) => {
const newGroupPath = unwrappedGroupingModel[field] ?? [];
const groupPathWillBeModified = !isDeepEqual(
newGroupPath,
columnsState.lookup[field].groupPath,
);
if (groupPathWillBeModified) {

const lookupElement = columnsState.lookup[field];
if (hasGroupPath(lookupElement) && isDeepEqual(newGroupPath, lookupElement?.groupPath)) {
// Avoid modifying the pointer to allow shadow comparison in https://github.com/mui/mui-x/blob/f90afbf10a1264ee8b453d7549dd7cdd6110a4ed/packages/grid/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts#L446:L453
columnsState.lookup[field] = {
...columnsState.lookup[field],
groupPath: unwrappedGroupingModel[field] ?? [],
};
return;
}
columnsState.lookup[field] = {
...columnsState.lookup[field],
groupPath: unwrappedGroupingModel[field] ?? [],
};
});
return columnsState;
},
Expand Down
16 changes: 8 additions & 8 deletions packages/grid/x-data-grid/src/models/api/gridColumnGroupingApi.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,20 +6,20 @@ import { GridColumnGroup } from '../gridColumnGrouping';
*/
export interface GridColumnGroupingApi {
/**
* returns the array of groupId applied on the column `field`.
* @param {string} field
* @returns {string[]} array of groupId
* Returns the array of groupId applied on the column `field`.
* @param {string} field The id of of the column requested.
* @returns {string[]} array of groupId.
*/
getColumnGroupPath: (field: string) => GridColumnGroup['groupId'][];
/**
* returns the details about a group corresponding to `groupId`.
* @param {string} groupId
* @returns {Omit<GridColumnGroup, 'children'>} group details
* Returns the details about a group corresponding to `groupId`.
* @param {string} groupId The id of the group requested.
* @returns {Omit<GridColumnGroup, 'children'>} group details.
*/
getGroupDetails: (groupId: string) => Omit<GridColumnGroup, 'children'> | null;
/**
* returns the column group lookup.
* @returns {GridColumnGroupLookup} groupsLookup
* Returns the column group lookup.
* @returns {GridColumnGroupLookup} groupsLookup.
*/
getAllGroupDetails: () => GridColumnGroupLookup;
}

0 comments on commit be02aa1

Please sign in to comment.