Widget: Data Table

[joepavitt]

Description

Precedes #76 - realise I hadn't added the table widget at all.

• Will display a holding "No Data" message until it receives a payload.
• On receipt of a msg:
  • If "Auto Calculate Columns" is active, it will read the keys of the data objects in the received array and auto create columns based on all keys found in the data.
  • If it isn't active, then it will use any explicitly defined "Columns" in the column-editor within Node-RED, where each column requires a Label & Key from which to read in the object.
• Adds pagination option with a "Max Rows" option

Checklist

• I have read the contribution guidelines

[joepavitt]

Screen.Recording.2023-09-02.at.10.41.24.mov

[joepavitt]

Also know that @Steve-Mcl would advocate here for a "rows" value on the widget that is a typed input, defaulting to msg.payload, but that allows us to easily define which input property for a message we use for the rows, likely a nice +1 feature after this one though as it's not essential.

[joepavitt]

Could also add alignment (left/center/right) for each column as a future feature too.

[joepavitt]

Would also appreciate @robmarcer's opinion here as I noticed you'd been rendering tables a few times with Dashboard 1.0 (and I assume using ui-template?) Any opinions around structure/UX are most welcome

[Steve-Mcl]

and I assume using ui-template?

Possibly, or the UI table node node-red-node-ui-table which is essentially a wrapper around the extremely capable/flexible tabulator

[robmarcer]

I've been using https://flows.nodered.org/node/node-red-node-ui-table

Having the ability to make the table continue on until the end of the data set would be really useful, so a user can use their browser's main window to scroll. You'd ideally still be able to put content beneath the table. If that's possible in node-red-node-ui-table I have not yet worked out how to do it.

I could spend a few hours digging into the features I've not used to give more detailed ideas, I suspect there's lots I've not even looked at yet.

Some features I would see value in:

• Easy to define 'rollups' (total, min. max etc).
• Easy to add URLs to link to other locations in the dashboard to create drill-downs.
• Ability to crud individual lines of the data rather than replace the whole set each time something needs to change.

I'm pretty sure node-red-node-ui-table does all of this with the exception of allowing the table length to extend the dashboard to show all data.

[joepavitt]

Fun demo linking the table to an API and having a button to generate 10 random jokes:

Screen.Recording.2023-09-06.at.08.52.02.mov