node-red-dashboard icon indicating copy to clipboard operation
node-red-dashboard copied to clipboard

Class Name Not Working for Notification Node with Dialog

Open nickHolsman opened this issue 3 years ago • 1 comments

What are the steps to reproduce?

Add Notification node to flow, use OK/Cancel Dialog option. Add a class name to Notification node or by send msg.className to Notification node.

What happens?

Class name is not used, so custom CSS cannot be used

What do you expect to happen?

The class should update.

Looks like a simple fix. Node.className or msg.className is already passed along in the msg in ui_toast.js. See below:

node.on('input', function(msg) {
          if (node.sendall === true) { delete msg.socketid; }
          var dt = node.displayTime || msg.timeout * 1000 || 3000;
          if (dt <= 0) { dt = 1; }
          //msg.payload = noscript(msg.payload);
          ui.emitSocket('show-toast', {
              title: node.topic || msg.topic,
              toastClass: node.className || msg.className,
              message: msg.payload,
              highlight: node.highlight || msg.highlight,
              displayTime: dt,
              position: node.position,
              id: node.id,
              dialog: (node.position === "dialog" || node.position === "prompt") || false,
              prompt: (node.position === "prompt") || false,
              ok: node.ok,
              cancel: node.cancel,
              socketid: msg.socketid,
              raw: node.raw,
              msg: msg
          });
      });

Thought it might be easier for someone to make this change than for me to do a pull request.

So it looks like what is needed is for this to pass into the panelClass with a msg.toastClass || 'nr-dashboard-dialog' or something similar.

$mdDialog.show(confirm, { panelClass:'nr-dashboard-dialog' }).then(
          function(res) {
              msg.msg.payload = msg.ok;
              if (res !== true) { msg.msg.payload = res; }
              if (res == undefined) { msg.msg.payload = ""; }
              events.emit({ id:msg.id, value:msg });
          },
          function() {
              msg.msg.payload = msg.cancel;
              events.emit({ id:msg.id, value:msg });
          }
      );

Please tell us about your environment:

  • [x] Node-RED-Dashboard version: 3.0.4
  • [x] Node-RED version: 2.2.2
  • [x] node.js version: 17.6.0
  • [x] npm version: 8.1.1
  • [x] Platform/OS: windows 10
  • [x] Browser: chrome

nickHolsman avatar May 27 '22 15:05 nickHolsman

totally happy to look at a tested PR :-)

dceejay avatar May 29 '22 15:05 dceejay