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.

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

[docs] Create an "Advanced Components" home page #4298

Merged
merged 34 commits into from
Apr 4, 2022

Conversation

flaviendelangle
Copy link
Member

@flaviendelangle flaviendelangle commented Mar 28, 2022

⚠ This page will only be available on the new doc architecture that will be published on the same release as the date pickers migration.
The Premium Plan being released after, the content of these pages will have to be adapted next week.


Doc preview

Now that we have two sets of components (Data Grid and Date Pickers), all the content that is not limited to the Data Grid should be available outside of the Data Grid documentation.


Links to update in the core

https://github.com/mui/material-ui/blob/master/docs/src/components/pricing/FAQ.tsx#L76

What's next ?

  • On the X home page (https://mui.com/x/), should be point to this new page instead of the Data Grid home page ? Should be update the code snippet to also install the Date Pickers or change the UI more drastically ?

@flaviendelangle flaviendelangle self-assigned this Mar 28, 2022
@flaviendelangle flaviendelangle added the docs Improvements or additions to the documentation label Mar 28, 2022
@mui-bot
Copy link

mui-bot commented Mar 28, 2022

These are the results for the performance tests:

Test case Unit Min Max Median Mean σ
Filter 100k rows ms 225.7 614.1 377.4 395.34 138.321
Sort 100k rows ms 490.7 1,120.5 603.8 718.96 213.705
Select 100k rows ms 106.5 308.5 175.6 192.9 67.919
Deselect 100k rows ms 93.2 293.4 173.2 167.12 68.077

Generated by 🚫 dangerJS against 4be13d1

@flaviendelangle flaviendelangle added component: data grid This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module! labels Mar 28, 2022
docs/data/advanced-components/overview.md Show resolved Hide resolved
docs/data/advanced-components/overview.md Show resolved Hide resolved
docs/data/advanced-components/overview.md Show resolved Hide resolved
docs/data/advanced-components/overview.md Show resolved Hide resolved
docs/data/advanced-components/overview.md Show resolved Hide resolved
docs/data/advanced-components/overview.md Show resolved Hide resolved

For each set of component, you can check the feature comparison table:

- [Data Grid](/x/react-data-grid/getting-started/#feature-comparison)
Copy link
Member Author

Choose a reason for hiding this comment

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

Should we directly link to the pricing page which has the most advanced feature comparison UI ?

Right now we have 3 lists:

I would at least drop the 3rd one (not in this PR)

Copy link
Member

Choose a reason for hiding this comment

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

I do not know if we should remove mui.com/components/data-grid/#features

For sure we should not link to this section because it is less informative than feature comparison. But it seems to be a good way to give an overview of what is available in the component without having to navigate on a big table

Copy link
Member Author

Choose a reason for hiding this comment

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

I find it not very usable

You have a flat mix of

  • advanced features (Row Grouping, Column Pinning, etc...)
  • very basic things that we obviously support (Pagination)
  • marketing statements with no real meaning (High performance, 100% customizable)

If the goal is to give an insight of the pover of the grid, the I think the list could be two times shorter with only the most interesting ones.

Copy link
Member

Choose a reason for hiding this comment

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

The capitalization convention we use from what I understand

Suggested change
- [Data Grid](/x/react-data-grid/getting-started/#feature-comparison)
- [Data grid](/x/react-data-grid/getting-started/#feature-comparison)

Copy link
Contributor

Choose a reason for hiding this comment

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

I think the mui.com/pricing page is the best place to send people.

Copy link
Contributor

Choose a reason for hiding this comment

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

@oliviertassinari I believe it should be capitalized since it's referring to The MUI X Data Grid, as opposed to any generic data grid or the concept in general.

Copy link
Member Author

Choose a reason for hiding this comment

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

I think the mui.com/pricing page is the best place to send people.

@samuelsycamore would you keep https://mui.com/components/data-grid/getting-started/#feature-comparison
And if so, for which usages ?

Copy link
Contributor

Choose a reason for hiding this comment

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

@flaviendelangle is there any info on that page that isn't included on the Pricing page? If it's all there already then I think this #feature-comparison section is redundant. I would lean toward keeping all of this info on the Pricing page as the single source of truth.

Copy link
Member Author

Choose a reason for hiding this comment

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

The 1st two are almost identical (but the 2nd is DataGrid only)
Le 3rd one is a partial list

I think we could have two at most
With :

  • The pricing page with a very detailed collapsible list, that serve as source of truth for our community
  • On section in each component page focusing only on the most important / most exciting features of the pro / premium, to serve as an entry point for Community users to give them a taste of what we have and give them a reason to go to the full list


<p class="description">A collection of fast and powerful components.</p>

## Licenses
Copy link
Member Author

Choose a reason for hiding this comment

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

This section is inspired by Data Grid - Getting Started # Plans but reworked

The features exclusives to the **Premium** Plan are marked with the <span class="plan-premium"></span> icon across our documentation.
The **Premium** Plan also contains all the features of the **Pro** Plan

## MIT vs. commercial
Copy link
Member Author

Choose a reason for hiding this comment

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

Pure Copy Paste

Copy link
Contributor

Choose a reason for hiding this comment

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

Is this section really necessary? I don't think we need to keep trying to justify the existence of our paid products. It makes us look oddly defensive, especially to devote so many words to it. If it needs to stay, I think a few sentences would be plenty.

Copy link
Member Author

Choose a reason for hiding this comment

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

Copy / pasted
But I agree that we talk a lot about the "why", which was maybe useful one year ago, but now our product feature should justify the cost by themselves.

@@ -25,7 +25,7 @@ jobs:
We use GitHub issues as a bug and feature requests tracker, however,
this issue appears to be a support request.

For support, please check out https://mui.com/components/data-grid/getting-started/#support. Thanks!
For support, please check out https://mui.com/getting-started/support/. Thanks!
Copy link
Member Author

Choose a reason for hiding this comment

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

To be consistent with the issue templates I put the link of the core doc

I don't know if we should strengthen our Support section (or do an Advanced Components - Support page) and use it on the Issue templates AND on the Stackoverflow bot.

@flaviendelangle flaviendelangle changed the title [docs] Create new X home page [docs] Create an "Advanced Components" home page on the doc Mar 28, 2022
@flaviendelangle flaviendelangle changed the title [docs] Create an "Advanced Components" home page on the doc [docs] Create an "Advanced Components" home page Mar 28, 2022
docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved

For each set of component, you can check the feature comparison table:

- [Data Grid](/x/react-data-grid/getting-started/#feature-comparison)
Copy link
Member

Choose a reason for hiding this comment

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

I do not know if we should remove mui.com/components/data-grid/#features

For sure we should not link to this section because it is less informative than feature comparison. But it seems to be a good way to give an overview of what is available in the component without having to navigate on a big table

While MUI Core is entirely licensed under MIT, MUI X serves a part of its components under a commercial license.
Please pay attention to the license.

### Community Plan
Copy link
Member

Choose a reason for hiding this comment

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

https://www.notion.so/mui-org/Style-guide-2a957a4168a54d47b14bae026d06a24b#d8e9cfb2423c4f83844a9f29d2032e3f and for the other? Not sure

Suggested change
### Community Plan
### Community plan

Copy link
Contributor

Choose a reason for hiding this comment

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

If it's a proper noun that's normally capitalized as "Community Plan" when used in a sentence, then it's correct as is.

Copy link
Member Author

Choose a reason for hiding this comment

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

I am in favor of using "Pro Plan" / "Community Plan" / "Premium Plan"


For each set of component, you can check the feature comparison table:

- [Data Grid](/x/react-data-grid/getting-started/#feature-comparison)
Copy link
Member

Choose a reason for hiding this comment

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

The capitalization convention we use from what I understand

Suggested change
- [Data Grid](/x/react-data-grid/getting-started/#feature-comparison)
- [Data grid](/x/react-data-grid/getting-started/#feature-comparison)

@oliviertassinari
Copy link
Member

oliviertassinari commented Mar 30, 2022

Once this change gets live, we will need to update links, for instance, https://github.com/mui/mui-store/blob/6e2253ff880d5ccf25723a22e78286b56963aeaf/lambda/keymailer/index.js#L8 won't work anymore.

docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
While MUI Core is entirely licensed under MIT, MUI X serves a part of its components under a commercial license.
Please pay attention to the license.

### Community Plan
Copy link
Contributor

Choose a reason for hiding this comment

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

If it's a proper noun that's normally capitalized as "Community Plan" when used in a sentence, then it's correct as is.

docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
### Professional support

When purchasing an MUI X Pro or Premium license you get access to professional support for a limited duration.
Support is available on multiple channels, but the recommended channel is GitHub issues.
Copy link
Contributor

Choose a reason for hiding this comment

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

What are the "multiple channels"? Seems like it's just GitHub and email, so let's say that instead.

Suggested change
Support is available on multiple channels, but the recommended channel is GitHub issues.
We recommend that you use [GitHub Issues](https://github.com/mui/mui-x/issues/) for support requests.

Copy link
Member Author

Choose a reason for hiding this comment

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

You also have Zendesk, I don't know how people access this one
@DanailH ?

docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
Support is available on multiple channels, but the recommended channel is GitHub issues.
If you need to share private information, you can also use email.

- **MUI X Pro**: No SLA is provided but MUI's maintainers give these issues more attention than the ones from the Community plan. The channels:
Copy link
Contributor

Choose a reason for hiding this comment

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

What does SLA mean in this context? Is there another way to say this?

Suggested change
- **MUI X Pro**: No SLA is provided but MUI's maintainers give these issues more attention than the ones from the Community plan. The channels:
- **MUI X Pro**: No SLA is provided but MUI's maintainers give these issues more attention than the ones from the Community plan. The channels:

Copy link
Member Author

Choose a reason for hiding this comment

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

Comment on lines +156 to +161
- **MUI X Premium**: Same as MUI X Pro, but with priority over Pro, and a 48 hour SLA for the first answer.
- GitHub: this plan is not available yet
- Emails: this plan is not available yet
- **MUI X Premium Priority**: Same as MUI X Premium but with a 24 hours SLA for the first answer.
- GitHub: this plan is not available yet
- Emails: this plan is not available yet
Copy link
Contributor

Choose a reason for hiding this comment

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

Is this necessary since these plans are not yet available?

Copy link
Member Author

Choose a reason for hiding this comment

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

Copy / Pasted, so no strong feeling here
@oliviertassinari

docs/data/advanced-components/overview.md Outdated Show resolved Hide resolved
flaviendelangle and others added 8 commits March 31, 2022 09:24
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
flaviendelangle and others added 18 commits March 31, 2022 09:27
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
Co-authored-by: Sam Sycamore <71297412+samuelsycamore@users.noreply.github.com>
@flaviendelangle flaviendelangle merged commit 1c707e9 into mui:master Apr 4, 2022
@flaviendelangle flaviendelangle deleted the x-home-page branch April 4, 2022 14:03
alexfauquette pushed a commit to alexfauquette/mui-x that referenced this pull request Aug 26, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module! docs Improvements or additions to the documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants