New table node for Dashboard 2.0

Table node (using Tabulator) for Node-RED Dashboard 2.0

I have just published the node on NPM and Node-RED library.
@omrid/node-red-dashboard-2-table-tabulator
GitHub repo: https://github.com/omrid01/node-red-dashboard-2-table-tabulator

The node uses the popular Tabulator JavaScript package, and enables presentation, styling/formatting, updating, editing and querying tables on the dashboard UI, in both Shared and Multi-user modes.

Note: the node comes in addition to, not replacing, dashboard V2.0's native vue-based table node.

You are welcome to test & play with the node - it has comprehensive on-line help. Please let me know of any issues, and I am open to ideas & suggestions.

ui-tabulator

example-pic

General Overview

  • The node serves as a smart wrapper containing a Tabulator (table) object. For the most part, it calls the Tabulator API as-is (as defined in the Tabulator Documentation).
  • The node enables automatic instantiation of the table (with user-defined configuration & initial data), as well as to dynamically create/destroy tables in runtime.
  • Interface to the node is through messages (regular Node-red msg objects). The msg specifies a command (and arguments), and returns the table's response
  • The node accepts data-setting commands (e.g. setData, addData, updateData, deleteData etc.) as well as data-query commands (getData, searchData etc.)
  • In addition, the node can send unsolicited event messages for selected table events (cell & row click/double-click, cell edit etc.)
  • By default, the table operates in shared mode, i.e. a common table image (data + styling) in all concurrent dashboard clients. The table image is also cached in the Node-RED datastore, and reloaded upon browser open, refresh etc.
    The node also supports a Multi-User mode, which maintains independent, client-specific table data.

Message Examples

  • Data-setting command example
msg.tbCmd  = "addData";
msg.tbArgs = [
   [
      {id:1, name:"bob", gender:"male"},
      {id:2, name:"Jenny", gender:"female"}
   ],
   true
];
  • Data-retrieval command example
msg.tbCmd  = "searchData";
msg.tbArgs = [ "age", ">", 12 ];
  • Data response example:
    image

  • Event example

{
    topic: "tbNotification",
    event: "cellEdited",
    payload: {
        id: 2,
        field: "name",
        newValue: "Jack Brown",
        oldValue: "John Doe"
    },
    _client: {
        socketId: "uXRxjY9yO-Hya1vtAAAB"
    },
    _msgid:"6d9d7a97666f2783"
}

Node Configuration

The node configuration (editor properties):

  • Name, Group, Size: - same as in all dashboard 2.0 nodes
  • Initial Table Configuration: JSON object with all table & column definitions, and (optional) initial data
  • Notifications: selection of table events which trigger notification messages
  • Multi-user mode: (Y/N)
  • CSS theme: selection of an optional tabulator CSS Stylesheet (e.g. Midnight, Modern etc.)
  • Pass through message from input: if checked, forwards the incoming message as-is to the output port, in addition to the node'e response

Node Dependencies

  • Node-JS version >= 18
  • Node-red version >= 3.10
  • Node-red dashboard 2.0, version >= 1.11.1
  • Tabulator version >= 6.2 (comes bundled in the node installation)
6 Likes

Hi, seems to be missing the link back to your source repo?

To clarify that, you need to add into package.json something like


    "repository": {
        "type": "git",
        "url": "https://github.com/omrid/node-red-dashboard-2-table-tabulator.git"
    },

so that, for example, users can submit issues or checkout the code without having to install it.

Added the repo info.
Thanks Colin.

I have posted a couple of issues I found on the github repo.

Very happy to see this release.

Will test soon.

Just tried to install but getting error. Install via pallete in Node-Red

16 Jun 19:50:25 - [info] Installing module: @omrid01/node-red-dashboard-2-table-tabulator, version: 0.2.8
16 Jun 19:50:27 - [warn] Installation of module @omrid01/node-red-dashboard-2-table-tabulator failed:
16 Jun 19:50:27 - [warn] ------------------------------------------
16 Jun 19:50:27 - [warn] npm ERR! code ETARGET
npm ERR! notarget No matching version found for @omrid01/node-red-dashboard-2-table-tabulator@0.2.8.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.

npm ERR! A complete log of this run can be found in: C:\Users\artur\AppData\Local\npm-cache\_logs\2024-06-16T18_50_26_505Z-debug-0.log

16 Jun 19:50:27 - [warn] ------------------------------------------
Error: Install failed
    at C:\Users\artur\AppData\Roaming\npm\node_modules\node-red\node_modules\@node-red\registry\lib\installer.js:290:25
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
16 Jun 19:50:27 - [error] Error: Install failed

Using Node-Red v4.0.0-beta.4, NodeJs: 20.11.1 and Dashboard 1.11.1

It seems the version publish in Node-Red catalogue is 0.2.8 but the version that exists in npm is 0.2.93

Node Red Catalogue

Version in NPM

Maybe NodeRed catalogue is not updated... but should npm store the previous released versions?

Is now updated. Might take ~30mins to appear in palette manager.

I believe you need dashboard 2 for this node.

V1.11.1 is the latest version of Dashboard 2

Can see that in Nodered catalogue is updated, now is even more strange, in the GitHub repo the latest version is suppose to be 0.2.94 as in the node red catalogue, but on npm still shows only version 0.2.93 as the latest and only one available.

Probably sync "issues" and timings.

Seems that the module is being updated by the author, and is also "deleting" the previous versions from the npm catalogue.

Will give it a try another day.

@omrid, please don't delete old versions from npmjs, if that is what you have done. It causes problems as you can see.

It seems to have disappeared entirely from npmjs now.

Hi, every time I publish a new version, NPM removes the previous one. I use the command "npm install @omrid... --access public".
Is there some other command or switch I should use?

In any case, we should be all aligned now on v0.2.94, across GitHub, NPM and the Node-red library.

What full exact command are you using? I don't think it is npm install.
You should only need to specify --access public the first time you publish, but I would not have expected that to have deleted previous versions.

Strangely, searching npmjs.com for @omrid01/node-red-dashboard-2-table-tabulator doesn't find it, though it does in fact exist.

By the way, the convention after getting to version 1.1.9 is to go to 1.1.10, not 1.1.91.
Also you don't have to up the version every time you push to github. Only when you want to do a release.

Thanks, Colin! I meant of course npm publish, (too much beer...), and I'm noting your recommendation on version numbering.
To make sure - upon publish, NPM always grabs the latest GitHub release, and determines the version number from the tag - correct?

Strange indeed, I can see the package on npmjs.com, as you can see below. The page shows the latest package, and npm view ... versions shows 0.2.93 & 0.2.94 (but not any previous versions).

Not if you are doing the publish from your dev PC. It takes it from whatever is the current branch/version in the folder where you are doing the npm publish

v0.29.4 installed perfectly via the palette for me, no problems.

Here is the workflow I use for publishing.

  • First I create a new branch on GitHub and work on that locally until ready.
  • When ready, I do a final push and then create a PR to merge back to the main branch.
  • On the local dev PC, I switch branches to main.
  • Create a new tag with the new release version as the name, e.g. v1.2.3 and then create a GitHub new release from the tag.
  • Now to npm publish

Typically, I have this largely automated using Gulp.

1 Like

That's also what I do (except I do it manually - no gulp)

1 Like

Prettty much the same here, though I don't bother with PRs, I just merge the branch into main on my PC. For small changes I may not even bother pushing the branch to github. For very small changes I don't bother with creating a branch.