Created with CodeSandbox

This POC is to test out React Material-UI Tables, and testing the ability to pin all items, select all items, edit row items within a table, and filter the table items with the filter search bar in the upper right corner of each table.

Unfortunately, I did not get the pin all / select all working on the CodeSandbox that is demonstrated in the committed code.

HOWEVER, you will be able to test "activating" a row item, which allows editing of the row items' input fields.

The input fields have a number of different input field types: textboxes: text and number boxes, dropdown-selects, icon-pickers, and dropdown-selects which represent an icon value.

Table 1 demonstrates the "activation" button next to the pencil icon, which will allow editing of a selected row.

Table 2 demonstrates "selecting" an item.

Table 3 is the most comprehensive table, which demonstrates editing multiple fields when the row is "activated". It also demonstrates "grouping by" column category. You can test this by dragging a column header into the greyed area to "group by"

To test this repo, simply run:

npm install

then

npm start

This project is not in active development. Use at your own risk.