You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Follows #1692. The current stories in storybook for DataGrid do not cover the pattern as a whole, many options are missing, and are generally too much of stories simply rendering components rather than communicating usage and user experience intent. Update existing stories and add new ones based on the revised DataGrid toolbar concept. Stories should be real-world scenarios, not zone-by-zone technical demonstrations.
(Guiding principle: Every story should answer "when and how would I use this?" — not "what does this component render?")
Replace Default with a story showing a minimal but realistic toolbar: just a primary action button (e.g. "Create Server") — the simplest real-world case
Add a story showing a toolbar with filters, search, active filter pills, item count and refresh — no bulk actions, no primary action
Add a story showing a full toolbar: bulk action controls + sort + overflow + primary action in the first DataGridToolbar, filters + search + pills + item count + refresh in the second DataGridToolbar with background, both wrapped in a Stack (direction="vertical")
DataGrid stories (DataGrid.stories.tsx)
Add a story showing a DataGrid with row checkboxes and a toolbar with select-all and bulk action controls — the primary reference for DataGridCheckboxCell usage in context
Add a story showing a DataGrid with a footer with realistic pagination controls — the primary reference for DataGridFoot usage in context
DataGridCheckboxCell / DataGridFoot stories
Delete DataGridCheckboxCell.stories.tsx and DataGridFoot.stories.tsx
Clarify: Is DatagridFoot actually needed? And if yes, how (Pagination? or does that go underneath a DataGrid anyway? If not, can we create a ticket to remove the component altogether?
Story Descriptions
Update the descriptions so they:
Clarify usage of header cells (are these technically part of the header / toolbar?)
Clarify sorting by Sort element, not by column headers (description)
Interacting with rows/items
placement of action buttons, usage of overflow menus
pagination of datagrids
Not in scope:
Show states (empty (no data), empty (no items matching filter or search), loading, error – qwe need design first)
WIP
Follows #1692. The current stories in storybook for
DataGriddo not cover the pattern as a whole, many options are missing, and are generally too much of stories simply rendering components rather than communicating usage and user experience intent. Update existing stories and add new ones based on the revised DataGrid toolbar concept. Stories should be real-world scenarios, not zone-by-zone technical demonstrations.(Guiding principle: Every story should answer "when and how would I use this?" — not "what does this component render?")
DataGridToolbar stories (DataGridToolbar.stories.tsx)
DataGridToolbarbackground color for updated design #1692)DataGrid stories (DataGrid.stories.tsx)
DataGridCheckboxCell / DataGridFoot stories
DatagridFootactually needed? And if yes, how (Pagination? or does that go underneath aDataGridanyway? If not, can we create a ticket to remove the component altogether?Story Descriptions
Update the descriptions so they:
Not in scope:
Depends on #1692