[DataGridPro] Allow to automatically group the rows in a Tree Data #2725

flaviendelangle · 2021-09-28T12:01:52Z

Closes #210 (I will create new issues for the following features in the Tree Data)

Preview doc

Merging plan

Merge [core] Each hook should initialize its state synchronously #2782
Extract independent features in stand-alone PRs

Columns pre-processing (and apply it for selection) [core] Each feature hook should be responsible for its column pre-processing #2839
Row grouping pre-processing (but do not apply it) [core] New internal hook: useGridRowGroupsPreProcessing #2840
Filtering rework [core] Apply all filters on a row before passing to the next one #2870
CSV export cleaning [core] Simplify the CSV export #2941

Extract the selector breaking changes [DataGrid] Unify filtering / sorting / pagination / rows selectors #2942
Extract the list => tree migration in useGridRows, useGridFilter, useGridSorting and rendering [core] Implement tree-based row management #2996
Extract the data generator updates [core] Adapt useDemoData for Tree Data #2978
Merge the useGridTreeData and directly related features + its documentation

1-3 should be done before the major release because 3. is a breaking change.

github-actions · 2021-10-01T19:06:37Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-05T08:32:26Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-05T19:08:47Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-07T12:01:44Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-08T19:13:27Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-12T14:09:47Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-13T07:03:54Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

github-actions · 2021-10-13T12:18:31Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

m4theushw · 2021-11-19T18:21:20Z

There's still this one: https://github.com/mui-org/material-ui-x/pull/2725/files#r752488746

flaviendelangle · 2021-11-22T07:58:57Z

@m4theushw Done 👍

sanjinbecirovic · 2021-11-22T11:02:32Z

Is there an ETA when this feature will be released?

flaviendelangle · 2021-11-22T11:07:14Z

@sanjinbecirovic we don't have a fixed date but depending on the feedback it could be for the 02/11.
We prefer to review thoroughly this one to avoid bad surprises and breaking changes to fix bugs / unintended behaviors 👍

alexfauquette · 2021-11-22T13:05:31Z

Small design detail, the arrow icon should be in the other direction when children are open. See the "Thomas" row in the DataGrid and the "Component API" in the doc menu

m4theushw · 2021-11-22T13:33:49Z

Small design detail, the arrow icon should be in the other direction when children are open. See the "Thomas" row in the DataGrid and the "Component API" in the doc menu

Is not the sidebar that is wrong? In most of the demos in https://mui.com/components/accordion/#customization, the arrow is pointing up when the item is open. Only https://mui.com/components/accordion/#customization reproduces the same pattern as the sidebar. cc @danilo-leal

m4theushw

The data generator is generating duplicated paths. This causes unwanted behaviors if users open the demo in CodeSandbox and change the number of rows to something big, like 2k rows. See this example: https://codesandbox.io/s/treedatafullexample-material-demo-forked-hkm7q?file=/demo.tsx

I think we could also send an error to the console if the paths are not unique, similar to what happens with the key prop. It took me some time to figure out they weren't unique.

docs/src/pages/components/data-grid/group-pivot/group-pivot.md

github-actions · 2021-11-22T20:34:15Z

This pull request has conflicts, please resolve those before we can evaluate the pull request.

flaviendelangle · 2021-11-23T07:37:51Z

@m4theushw concerning the non-uniq paths, I indeed only applied the logic to the non-seeded generator, so below 1000 lines.
I will add an error when using the generator with tree data and more than 1000 lines for now 👍

For the unicity test, same thing I think it can be done in a folow up PR. And probably in dev mode only to avoid overhead

m4theushw · 2021-11-23T13:46:34Z

docs/src/pages/components/data-grid/group-pivot/DisableChildrenSortingTreeData.tsx

+              onChange={(event) => setDisableChildrenSorting(event.target.checked)}
+            />
+          }
+          label="Enable `disableChildrenSorting`"


The formatting is different from https://deploy-preview-2725--material-ui-x.netlify.app/components/data-grid/group-pivot/#filtering.

m4theushw · 2021-11-23T13:52:27Z

docs/src/pages/components/data-grid/group-pivot/group-pivot.md

+> For instance:
+
+```ts
+// The row A.A is immediately after its parent


The code should be inside the warning.

m4theushw · 2021-11-23T13:59:49Z

docs/src/pages/components/data-grid/group-pivot/group-pivot.md

+const validRows = [{ path: ['A'] }, { path: ['A', 'A'] }, { path: ['B'] }];
+
+// The row A.A is not immediately after its parent
+const invalidRows = [{ path: ['A'] }, { path: ['B'] }, { path: ['A', 'A'] }];


We could add emojis to make clear what is the wrong pattern. Two examples: https://mui.com/guides/minimizing-bundle-size/#option-1 and https://mui.com/customization/how-to-customize/#main-content

m4theushw

Great work! I don't have anything to add. 💯

My only concern is that the code for sorting and filtering tree data nodes shouldn't be shipped as MIT, however, this can be addressed later.

Merging with master should fix the screenshot below:

docs/src/pages/components/data-grid/group-pivot/group-pivot.md

Co-authored-by: Matheus Wichman <matheushw@outlook.com>

sanjinbecirovic · 2021-11-30T17:54:36Z

@sanjinbecirovic we don't have a fixed date but depending on the feedback it could be for the 02/11. We prefer to review thoroughly this one to avoid bad surprises and breaking changes to fix bugs / unintended behaviors 👍

Thank you for the reply, 02/11 is a release or? I've seen the code has been merged? but not released?

flaviendelangle · 2021-12-01T07:57:22Z

02/12 not 02/11 my bad.
Yes it should be release on the 02/12, or in the days just after if the release takes more time to prepare.
In any case, it will be in the next release and we have a release planned tomorrow.

flaviendelangle self-assigned this Sep 28, 2021

flaviendelangle changed the title ~~[DataGridPro] Tree data~~ [DataGridPro] Tree data (WIP) Sep 28, 2021

flaviendelangle added breaking change components: DataGridPro labels Sep 30, 2021

github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 1, 2021

github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged and removed PR: out-of-date The pull request has merge conflicts and can't be merged labels Oct 4, 2021

github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged and removed PR: out-of-date The pull request has merge conflicts and can't be merged labels Oct 5, 2021

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 6, 2021

github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged and removed PR: out-of-date The pull request has merge conflicts and can't be merged labels Oct 7, 2021

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 9, 2021

github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 12, 2021

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 12, 2021

github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged and removed PR: out-of-date The pull request has merge conflicts and can't be merged labels Oct 13, 2021

flaviendelangle requested a review from m4theushw November 19, 2021 13:55

flaviendelangle added 2 commits November 22, 2021 08:57

Merge branch 'master' into tree-data

c8f96fd

Code review

7007220

m4theushw reviewed Nov 22, 2021

View reviewed changes

docs/src/pages/components/data-grid/group-pivot/group-pivot.md Outdated Show resolved Hide resolved

github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Nov 22, 2021

merge

3e565d9

github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Nov 23, 2021

flaviendelangle added 2 commits November 23, 2021 08:40

Fix

c23565f

Fix

74f105d

m4theushw reviewed Nov 23, 2021

View reviewed changes

flaviendelangle requested a review from m4theushw November 23, 2021 14:48

Code review

f8cb6e1

m4theushw approved these changes Nov 24, 2021

View reviewed changes

Merge branch 'master' into tree-data

0b96809

m4theushw reviewed Nov 24, 2021

View reviewed changes

docs/src/pages/components/data-grid/group-pivot/group-pivot.md Outdated Show resolved Hide resolved

flaviendelangle and others added 2 commits November 24, 2021 14:01

Update docs/src/pages/components/data-grid/group-pivot/group-pivot.md

5e448d6

Co-authored-by: Matheus Wichman <matheushw@outlook.com>

Fix

b304525

flaviendelangle merged commit 21d3a75 into mui:master Nov 24, 2021

flaviendelangle deleted the tree-data branch November 24, 2021 15:08

flaviendelangle mentioned this pull request Nov 29, 2021

[DataGrid] Prepare the tree structure for grouping sorting / filtering + multi field grouping #3301

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[DataGridPro] Allow to automatically group the rows in a Tree Data #2725

[DataGridPro] Allow to automatically group the rows in a Tree Data #2725

flaviendelangle commented Sep 28, 2021 •

edited

github-actions bot commented Oct 1, 2021

github-actions bot commented Oct 5, 2021

github-actions bot commented Oct 5, 2021

github-actions bot commented Oct 7, 2021

github-actions bot commented Oct 8, 2021

github-actions bot commented Oct 12, 2021

github-actions bot commented Oct 13, 2021

github-actions bot commented Oct 13, 2021

m4theushw commented Nov 19, 2021

flaviendelangle commented Nov 22, 2021

sanjinbecirovic commented Nov 22, 2021

flaviendelangle commented Nov 22, 2021

alexfauquette commented Nov 22, 2021

m4theushw commented Nov 22, 2021

m4theushw left a comment

github-actions bot commented Nov 22, 2021

flaviendelangle commented Nov 23, 2021

m4theushw Nov 23, 2021

m4theushw Nov 23, 2021

m4theushw Nov 23, 2021 •

edited

m4theushw left a comment

sanjinbecirovic commented Nov 30, 2021

flaviendelangle commented Dec 1, 2021

[DataGridPro] Allow to automatically group the rows in a Tree Data #2725

[DataGridPro] Allow to automatically group the rows in a Tree Data #2725

Conversation

flaviendelangle commented Sep 28, 2021 • edited

Merging plan

github-actions bot commented Oct 1, 2021

github-actions bot commented Oct 5, 2021

github-actions bot commented Oct 5, 2021

github-actions bot commented Oct 7, 2021

github-actions bot commented Oct 8, 2021

github-actions bot commented Oct 12, 2021

github-actions bot commented Oct 13, 2021

github-actions bot commented Oct 13, 2021

m4theushw commented Nov 19, 2021

flaviendelangle commented Nov 22, 2021

sanjinbecirovic commented Nov 22, 2021

flaviendelangle commented Nov 22, 2021

alexfauquette commented Nov 22, 2021

m4theushw commented Nov 22, 2021

m4theushw left a comment

Choose a reason for hiding this comment

github-actions bot commented Nov 22, 2021

flaviendelangle commented Nov 23, 2021

m4theushw Nov 23, 2021

Choose a reason for hiding this comment

m4theushw Nov 23, 2021

Choose a reason for hiding this comment

m4theushw Nov 23, 2021 • edited

Choose a reason for hiding this comment

m4theushw left a comment

Choose a reason for hiding this comment

sanjinbecirovic commented Nov 30, 2021

flaviendelangle commented Dec 1, 2021

flaviendelangle commented Sep 28, 2021 •

edited

m4theushw Nov 23, 2021 •

edited