ui-notification does not hide when sent {ui_update: {show: false}}

[colinl]

Current Behavior

If a Notification node is send a message containing {ui_update: {show: false}} it is not hidden

Expected Behavior

It should be hidden

Steps To Reproduce

Import this flow, click the Show inject to popup the notification, then the Hide inject, which should hide it.

[{"id":"285d16e35a26ee0f","type":"ui-notification","z":"bdd7be38.d3b55","ui":"ID-BASE-1","position":"center center","colorDefault":true,"color":"#000000","displayTime":"","showCountdown":false,"outputs":1,"allowDismiss":true,"dismissText":"Ok","allowConfirm":false,"confirmText":"Confirm","raw":false,"className":"","name":"","x":680,"y":3720,"wires":[[]]},{"id":"f63a82911caf30c1","type":"inject","z":"bdd7be38.d3b55","name":"Show","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":270,"y":3720,"wires":[["2bd5f132ebc3ee3e"]]},{"id":"2bd5f132ebc3ee3e","type":"function","z":"bdd7be38.d3b55","name":"hello","func":"msg = {\n    payload:\"hello\"\n\n};\nreturn msg;\n\n","outputs":1,"timeout":0,"noerr":0,"initialize":"","finalize":"","libs":[],"x":430,"y":3720,"wires":[["71ddc274ab3e03cf"]]},{"id":"c3c401e4d567c336","type":"function","z":"bdd7be38.d3b55","name":"show: false","func":"msg = {\n    \"ui_update\": {\n        \"show\": false,\n    }\n    \n\n};\nreturn msg;\n","outputs":1,"timeout":0,"noerr":0,"initialize":"","finalize":"","libs":[],"x":450,"y":3780,"wires":[["71ddc274ab3e03cf"]]},{"id":"2934f84536f6fad7","type":"inject","z":"bdd7be38.d3b55","name":"hide","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":270,"y":3780,"wires":[["c3c401e4d567c336"]]},{"id":"a09cb12b7b1087c6","type":"debug","z":"bdd7be38.d3b55","name":"debug 87","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":680,"y":3800,"wires":[]},{"id":"71ddc274ab3e03cf","type":"junction","z":"bdd7be38.d3b55","x":560,"y":3720,"wires":[["285d16e35a26ee0f","a09cb12b7b1087c6"]]},{"id":"ID-BASE-1","type":"ui-base","name":"Dashboard","path":"/dashboard","includeClientData":true,"acceptsClientConfig":["ui-control","ui-notification","ui-gauge-classic"],"showPageTitle":true,"titleBarStyle":"default"}]

Environment

• Dashboard version: 1.18.1
• Node-RED version: 4.0.5
• Node.js version: 20.5.1
• npm version:
• Platform/OS: Ubuntu
• Browser: Edge

Have you provided an initial effort estimate for this issue?

[colinl]

Originally reported in https://discourse.nodered.org/t/dashboard2-close-notification/92873

[cgjgh]

Can confirm this.
Also, based on the code in UINotification.vue msg.show should be set to false to hide notification (seen below), whereas in the Docs the property to set is listed as msg.ui_update.show.

@joepavitt What is the intended functionality here? (assuming to maintain standardization across widgets it's msg.ui_update.show as in @colinl 's flow)

onMsgInput (msg) {
// other code

// show/hide notification
  if (msg.show === true || typeof msg.payload !== 'undefined') {
                // If msg.show is true or msg.payload contains a notification title, the notification popup need to be showed (if currently hidden)
                if (!this.show) {
                    this.show = true

                    // If a display time has been specified, close the notification automatically after that time
                    if (this.displayTime > 0) {
                        this.startCountdown(this.displayTime * 1000)
                    }
                }
            } else if (msg.show === false) {
                // If msg.show is false, the notification popup need to be hidden (if currently showed)
                if (this.show) {
                    this.close('input_msg')
                }
            }
        },

The following modified flow demonstrates a working example with msg.show:

Expand Flow

[
    {
        "id": "285d16e35a26ee0f",
        "type": "ui-notification",
        "z": "be27d720a00411c0",
        "ui": "dashboard-ui-base",
        "position": "center center",
        "colorDefault": true,
        "color": "#000000",
        "displayTime": "",
        "showCountdown": false,
        "outputs": 1,
        "allowDismiss": true,
        "dismissText": "Ok",
        "allowConfirm": false,
        "confirmText": "Confirm",
        "raw": false,
        "className": "",
        "name": "",
        "x": 570,
        "y": 260,
        "wires": [
            []
        ]
    },
    {
        "id": "f63a82911caf30c1",
        "type": "inject",
        "z": "be27d720a00411c0",
        "name": "Show",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "x": 160,
        "y": 260,
        "wires": [
            [
                "2bd5f132ebc3ee3e"
            ]
        ]
    },
    {
        "id": "2bd5f132ebc3ee3e",
        "type": "function",
        "z": "be27d720a00411c0",
        "name": "hello",
        "func": "msg = {\n    payload:\"hello\"\n\n};\nreturn msg;\n\n",
        "outputs": 1,
        "timeout": 0,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 320,
        "y": 260,
        "wires": [
            [
                "71ddc274ab3e03cf"
            ]
        ]
    },
    {
        "id": "2934f84536f6fad7",
        "type": "inject",
        "z": "be27d720a00411c0",
        "name": "hide",
        "props": [],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "x": 160,
        "y": 320,
        "wires": [
            [
                "949ed3144a258476"
            ]
        ]
    },
    {
        "id": "a09cb12b7b1087c6",
        "type": "debug",
        "z": "be27d720a00411c0",
        "name": "debug 87",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "statusVal": "",
        "statusType": "auto",
        "x": 570,
        "y": 340,
        "wires": []
    },
    {
        "id": "949ed3144a258476",
        "type": "change",
        "z": "be27d720a00411c0",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "show",
                "pt": "msg",
                "to": "false",
                "tot": "bool"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 340,
        "y": 320,
        "wires": [
            [
                "71ddc274ab3e03cf"
            ]
        ]
    },
    {
        "id": "71ddc274ab3e03cf",
        "type": "junction",
        "z": "be27d720a00411c0",
        "x": 450,
        "y": 260,
        "wires": [
            [
                "285d16e35a26ee0f",
                "a09cb12b7b1087c6"
            ]
        ]
    },
    {
        "id": "dashboard-ui-base",
        "type": "ui-base",
        "name": "Dashboard",
        "path": "/dashboard",
        "appIcon": "",
        "includeClientData": true,
        "acceptsClientConfig": [
            "ui-notification",
            "ui-control"
        ],
        "showPathInSidebar": false,
        "showPageTitle": true,
        "titleBarStyle": "default"
    }
]

[joepavitt]

Lack of documentation here, whereby the ui_update is referring to configuration changes. show is not a configuration change, so we've mis-typed the documentation, which should state that show is configured via msg.show instead.