Skip to content

[dev-v5][Docs] Improve FluentDataGrid docs - #5034

Merged
vnbaaij merged 6 commits into
microsoft:dev-v5from
MarvinKlein1508:docs-datagrid
Jul 24, 2026
Merged

[dev-v5][Docs] Improve FluentDataGrid docs#5034
vnbaaij merged 6 commits into
microsoft:dev-v5from
MarvinKlein1508:docs-datagrid

Conversation

@MarvinKlein1508

Copy link
Copy Markdown
Collaborator

Pull Request

📖 Description

This PR improves the documentation for FluentDataGrid.

It introduces a new page, DataGridColumnTypes, which contains examples of all available column types: PropertyColumn, TemplateColumn, and SelectColumn. The page also provides guidance on when to use each column type.

Since this is fundamental knowledge for using the component effectively, I placed the page relatively high in the navigation.

Additionally, I removed the separate pages containing these demos, as they are now consolidated into a single page that also includes the relevant API documentation.

👩‍💻 Reviewer Notes

The folder of examples is still pretty large. Would it be a good idea to categorize the demos by Layout and Advanced as we do in the Overview page?

✅ Checklist

General

  • I have added tests for my changes.
  • I have tested my changes.
  • I have updated the project documentation to reflect my changes.
  • I have read the CONTRIBUTING documentation and followed the standards for this project.

Component-specific

  • I have added a new component
  • I have added Unit Tests for my new component
  • I have modified an existing component
  • I have validated the Unit Tests for an existing component

Copilot AI review requested due to automatic review settings July 21, 2026 09:30

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

This PR consolidates FluentDataGrid column documentation by introducing a single “Column Types” page that explains when to use PropertyColumn, TemplateColumn, and SelectColumn, and removes older, separate demo pages in favor of the new consolidated content.

Changes:

  • Reworked DataGridColumnTypes.md into a “Column Types” documentation page and moved column API docs onto that page.
  • Updated the main FluentDataGrid docs to link to the new consolidated page and removed links/sections for the older template-column pages.
  • Restructured DataGrid demo examples by removing the old “TemplateColumns2” demo and adding/adjusting examples under Examples/ColumnTypes/.

Reviewed changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
examples/Tools/FluentUI.Demo.SampleData/People.cs Attempts to make Email editable in the sample Person model (currently introduces a compile-breaking duplicate member).
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Pages/DataGridTemplateColumnsPage.md Removed (content consolidated into the new Column Types page).
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Pages/DataGridTemplateColumns2Page.md Removed (content consolidated into the new Column Types page).
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Pages/DataGridColumnTypes.md Converted into the new “Column Types” page with consolidated demos + API references.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/FluentDataGrid.md Updated navigation/links and removed column API sections that moved to the new page.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/DataGridTemplateColumns2.razor Removed (superseded by new column-type examples).
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/ColumnTypes/DataGridTemplateColumn.razor Updated template-column example; now demonstrates an email input column.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/ColumnTypes/DataGridSelectColumn.razor New SelectColumn example showing both SelectedItems and manual selection management.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/ColumnTypes/DataGridPropertyColumn.razor New minimal PropertyColumn example.
Comments suppressed due to low confidence (2)

examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Examples/ColumnTypes/DataGridTemplateColumn.razor:9

  • @bind-Value requires a settable value, but People.Person.Email is currently an init-only property (positional record). This will not compile after removing the duplicate Email property attempt in People.cs.

Use one-way binding here (or introduce an editable view-model) to keep the sample compiling.
examples/Demo/FluentUI.Demo.Client/Documentation/Components/DataGrid/Pages/DataGridColumnTypes.md:21

  • The Docs-style admonition syntax elsewhere in this repo uses a space after > (e.g., > [!NOTE]). Without the space, this may not render as an admonition depending on the Markdown pipeline.

Comment thread examples/Tools/FluentUI.Demo.SampleData/People.cs Outdated
@vnbaaij

vnbaaij commented Jul 21, 2026

Copy link
Copy Markdown
Collaborator

The folder of examples is still pretty large. Would it be a good idea to categorize the demos by Layout and Advanced as we do in the Overview page?

Yes. Let's do that. Can be done in this PR I think.

@vnbaaij
vnbaaij enabled auto-merge (squash) July 22, 2026 20:32
@vnbaaij
vnbaaij merged commit 593e7c0 into microsoft:dev-v5 Jul 24, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants