Epic - New Component: Table / Grid

[MidasXIV]

Description

Add a functional table / grid component.

Epic issues

Phase I: Table - Simple functionality

• New component: Table (simple functionality) #6697
• [Table] Follow up items from initial PR #7630
• Design target: May 2023
• Target release: August 2023

Phase II: Table - Advanced functionality

• New Component: Table (advanced functionality) #6646
• Design target: May 2023
• Target release: TBD

Implementation

Design work will be carried out in May 2023, with a development target for the Table with simple functionality targeted for release in August 2023 and Table with advanced functionality TBD.

Original request details

Mockup:

Pro:

[driskull]

@mitc7862 @asangma what do you think?

[ope-nz]

+1 a table component is vital to my product migration to calcite.

[AdelheidF]

Current look on production.

on a small screen

Russian

RGB style for e.g. this layer:
https://tiledimageservices.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/NLDAS2011_daily_wind_magdir/ImageServer

[shawnmgoulet]

Some examples in the wild for this kind of component as per @macandcheese request:

https://mui.com/x/react-data-grid/row-grouping/

https://www.ag-grid.com/react-data-grid/grouping-group-rows/

https://web-components.carbondesignsystem.com/?path=/story/components-data-table--expandable

https://adazzle.github.io/react-data-grid/#/grouping

[macandcheese]

Thanks @shawnmgoulet - @benelan / @geospatialem this is a v-next component, should we continue to use this issue for the time being?

[geospatialem]

this is a v-next component, should we continue to use this issue for the time being?

@macandcheese Leaning towards keeping the issue as-is, with an already referenced link in our internal site for reference.

Since this issue is in the Freezer milestone it wouldn't impact future sprints unless we'd like to add it in based on sprint discussions. And the new component label could help us for tracking in the future.

[yelenakreyndel]

@geospatialem please add a label "new component opportunity" and please CC me in all issues and conversations regarding opportunities for new components. Cc'ing @macandcheese and @benelan

[benelan]

@yelenakreyndel we use the new component label which is already added.

[geospatialem]

@geospatialem please add a label "new component opportunity" and please CC me in all issues and conversations regarding opportunities for new components. Cc'ing @macandcheese and @benelan

@yelenakreyndel A notification has been added when the new component label is added to issues that will notify you (and others as you see fit in the future).

[yelenakreyndel]

I'm going to assign this to @macandcheese to work on next.

[yelenakreyndel]

@macandcheese Mitch needs this for Analysis.

[macandcheese]

@jcfranco lets sync on this, I know there are many existing data grid libraries in use across the platform.

To scope the design requirements it would be good to understand what we would use if we go that route - it may be a case of theming an existing library.

It would also likely provide us the complex capabilities like editable table cells, groups, multiple selection, freezing columns, reorder of columns, sorting, etc, etc.

[driskull]

Agreed. It might be too much work to create our own grid component. Hopefully, we can decide on one to use with the ability to style it to match our design system.

[macandcheese]

@yelenakreyndel this may be a research task to determine library, licensing, etc., before it moves to design, as the available UI to design / theme may differ.

[RSantosGIS]

Adam T. suggested that the ArcGIS Knowledge Studio team +1 the requirement for a data-grid component. Having a data grid is required for our project, and we have been asked to use Calcite wherever possible. We are basically looking for something like the MUI data grid.

[geospatialem]

Simple table effort has been completed, the more advanced table will dictate the larger effort in a future milestone tbd. cc @brittneytewks

[geospatialem]

Moving to November, where additional research will be performed for the next steps with the advanced table component.

[brittneytewks]

Removed figma changes label, will track progress for this work in monday.com

[macandcheese]

Closing this as the initial Table work is complete and further follow up and enhancements are logged as separate issues.