# 🎇 FlexDash alpha release - round 2

**URL:** <https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783>\
**Category:** Share Your Nodes\
**Tags:** flexdash\
**Created:** [16 September 2022 04:14 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783 "2022-09-16T04:14:30Z")\
**Posts on this page:** 20\
**Page:** 2

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [21 September 2022 16:58 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/21 "2022-09-21T16:58:36Z")

</div>

There is no repaint. I have not seen any issues WRT stuff not drawing... I have not tried your specific flow.

To reorder tabs:

- enable edit mode in the top-right gear menu in FD
- click on the pencil icon on the tab (icon) you want to move
- use the left/right arrow buttons
- when done, hit 'deploy' in the NR flow editor to persist the changes

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [21 September 2022 17:14 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/22 "2022-09-21T17:14:53Z")

</div>

That worked.

Where is the information stored? Is it persistent? Is it a cookie?

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [21 September 2022 17:28 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/23 "2022-09-21T17:28:18Z")

</div>

> [@cameo69](#):
>
> Where is the information stored? Is it persistent? Is it a cookie?

I assume you're talking about the tab order: all dashboard configuration is stored in the flow, in this case each tab is a config node and the order of tabs is stored in the dashboard config node (type `fd_dashboard`).

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [22 September 2022 09:14 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/24 "2022-09-22T09:14:49Z")

</div>

I'm developing some logic for controlling garden lighting, which so far is working OK.  
The buttons toggle their state, and the button colour changes only occur when feedback from the hardware confirms it's actually changed it's state (that's why there is a slight delay).

The only downside is that the buttons are not the same width because of their wordcount. Anyone any ideas how to create buttons of the same width.

Also... noticed that the panel which contains the buttons reacts to mouseover, should it?

![buttons2](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/d/5d03f8218d49e82791241bdd9d59f94df6ba6a55.gif)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [22 September 2022 14:57 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/25 "2022-09-22T14:57:00Z")

</div>

I haven't had any time to digg into FlexDash CSS and I have no clue how it is built up. Other than that I'm not sure about the CSS is meant to be overrided. From top of my head I kind of remember that correct path is to create kind of replica of the widget and do your stuff on top of it.  
But that's only me with tiny knowledge base of topic

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [22 September 2022 16:02 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/26 "2022-09-22T16:02:48Z")

</div>

> [@Paul-Reed](#):
>
> ![buttons2](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/d/5d03f8218d49e82791241bdd9d59f94df6ba6a55.gif)

I just had a good laugh imagining that all the lights are going on and off while you made the demo 😂

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [22 September 2022 16:40 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/27 "2022-09-22T16:40:53Z")

</div>

> [@Paul-Reed](#):
>
> Also... noticed that the panel which contains the buttons reacts to mouseover, should it?

For me in Chrome it does not.

> Version 105.0.5195.125 (Official Build) (x86\_64)

![output_buttons4](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/7/4793ff8cf0a78bf5ecfca92b85471047e77840c4.gif)

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [22 September 2022 16:42 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/28 "2022-09-22T16:42:42Z")

</div>

Albeit I cannot solve @Paul-Reed's question above, I would like to add some observation I made while playing with the buttons.

**Setup:**

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/1/e1e3d7e2d8cd7f5fccfc01b3951e24514b2013ac.png)

and `array of buttons[]` is setup like this

 ![5DB28D81-12D1-441D-8B71-9F6F1FAFC7FF](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/7/27106ff5f9e9b2bd27042b3877c9100f7c18ded3.jpeg)

**Flow:**

```auto
[{"id":"94ced6cd1748e170","type":"inject","z":"95e238910d29e0c2","name":"","props":[{"p":"payload"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":130,"y":60,"wires":[["f6032f8e6e47b319"]]},{"id":"8dbebc965a0f1df2","type":"inject","z":"95e238910d29e0c2","name":"","props":[{"p":"topic","v":"","vt":"date"},{"p":"title","v":"","vt":"date"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":130,"y":160,"wires":[["75961e82d73d9aec"]]},{"id":"137570977409ef12","type":"debug","z":"95e238910d29e0c2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"topic","targetType":"msg","statusVal":"","statusType":"auto","x":540,"y":100,"wires":[]},{"id":"adb7eae63154ed82","type":"change","z":"95e238910d29e0c2","name":"","rules":[{"t":"set","p":"label","pt":"msg","to":"topic","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":500,"y":160,"wires":[["9408f7f8ce7a7483"]]},{"id":"04cee7036bd6529e","type":"change","z":"95e238910d29e0c2","name":"","rules":[{"t":"set","p":"topic","pt":"msg","to":"","tot":"date"},{"t":"set","p":"title","pt":"msg","to":"","tot":"date"}],"action":"","property":"","from":"","to":"","reg":false,"x":310,"y":100,"wires":[["137570977409ef12","75961e82d73d9aec"]]},{"id":"f6032f8e6e47b319","type":"fd-date-time","z":"95e238910d29e0c2","fd_container":"2e1077589627ac5c","fd_cols":"2","fd_rows":1,"fd_array":false,"fd_array_max":10,"name":"","title":"Flow started at","popup_info":"","value":"","color":"","start_mode":0,"zoom":100,"low_threshold":null,"low_color":"blue","high_threshold":null,"high_color":"pink","chip":false,"units":["now","sec","min","hr","days","weeks","months"],"x":300,"y":60,"wires":[]},{"id":"9408f7f8ce7a7483","type":"fd-label","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":1,"fd_rows":1,"fd_array":false,"fd_array_max":10,"name":"","title":"","popup_info":"","label":"banane","color":"purple-accent-3","align":"center","justify":"center","weight":"400","size":"100%","padding":"4px","x":650,"y":160,"wires":[]},{"id":"3cb0ab8809391dd3","type":"fd-push-button","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":"2","fd_rows":1,"fd_array":false,"fd_array_max":10,"fd_output_topic":"","name":"","title":"add new button","popup_info":"","enabled":true,"color":"","output_value":25,"icon":null,"x":110,"y":100,"wires":[["04cee7036bd6529e"]]},{"id":"75961e82d73d9aec","type":"fd-push-button","z":"95e238910d29e0c2","fd_container":"6d69e6adc0fd0416","fd_cols":1,"fd_rows":1,"fd_array":true,"fd_array_max":"5","fd_output_topic":"bix","name":"array of buttons","title":"button1","popup_info":"","enabled":true,"color":"","output_value":25,"icon":null,"x":310,"y":160,"wires":[["adb7eae63154ed82"]]},{"id":"2e1077589627ac5c","type":"flexdash container","name":"Demo grid","kind":"StdGrid","fd_children":",f6032f8e6e47b319","title":"Demo grid","tab":"5671049acbf17679","min_cols":2,"max_cols":6,"parent":"","solid":false,"cols":"1","rows":"1"},{"id":"16ba1ce3418bf289","type":"flexdash container","name":"button static container","kind":"StdGrid","fd_children":",9408f7f8ce7a7483,3cb0ab8809391dd3","title":"button static container","tab":"5671049acbf17679","min_cols":"1","max_cols":"20","parent":"2e1077589627ac5c","solid":false,"cols":"1","rows":"1"},{"id":"6d69e6adc0fd0416","type":"flexdash container","name":"button container","kind":"StdGrid","fd_children":",75961e82d73d9aec","title":"button container","tab":"5671049acbf17679","min_cols":"1","max_cols":"20","parent":"","solid":false,"cols":"1","rows":"1"},{"id":"5671049acbf17679","type":"flexdash tab","name":"Demo","icon":"mdi-view-dashboard","title":"Demo","fd_children":",2e1077589627ac5c,16ba1ce3418bf289,6d69e6adc0fd0416","fd":"e8f5aea52ab49500"}]

```

**Issue:**  
If I understand correctly, the limit of "Max widgets" should limit the array to 5 buttons.  
Upon restart of node-red it looks normal. The `array of buttons[]` is empty, hence no button shown.  
But then every click on the button `ADD NEW BUTTON` creates an additional button within the array and the limit of 5 is not enforced.

![output_buttons3](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/8/185b17c22b30b0abc2fbd19d5b2a4ec9d837dcab.gif)

**Bonus question:**  
How can I empty the array of buttons except by restarting node-red?

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [22 September 2022 17:15 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/29 "2022-09-22T17:15:25Z")

</div>

> [@Paul-Reed](#):
>
> The only downside is that the buttons are not the same width because of their wordcount. Anyone any ideas how to create buttons of the same width.

Nope. Please live with it 'til there are more options for customization...

> [@](#):
>
> Also... noticed that the panel which contains the buttons reacts to mouseover, should it?

No it shouldn't, it's a bug I forgot to fix. Fortunately it's only cosmetic.

> [@cameo69](#):
>
> But then every click on the button `ADD NEW BUTTON` creates an additional button within the array and the limit of 5 is not enforced.

Bug.

> [@cameo69](#):
>
> How can I empty the array of buttons except by restarting node-red?

[https://flexdash.github.io/docs/using-flexdash/array-widgets/#deleting-array-elements](https://flexdash.github.io/docs/using-flexdash/array-widgets/#deleting-array-elements)

I've been wanting to add a message to delete-all but I'm not sure how to encode that...

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [22 September 2022 17:40 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/30 "2022-09-22T17:40:19Z")

</div>

> [@hotNipi](#):
>
> I haven't had any time to digg into FlexDash CSS and I have no clue how it is built up. Other than that I'm not sure about the CSS is meant to be overrided. From top of my head I kind of remember that correct path is to create kind of replica of the widget and do your stuff on top of it.

This topic needs further exploration, prob best once Vuetify is released and has proper docs... IMHO the right way to do this type of stuff is to support [fall through attributes](https://vuejs.org/guide/components/attrs.html) in such a way that you can add arbitrary attributes to a FD node (e.g. in the general tab) and they "fall through" to the appropriate Vuetify or other main component. In addition, one of Vue's special attributes is `style` which would allow you to add CSS to some element.

All this needs some research and thinking so the end result is not a complete hodge-podge...

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [26 September 2022 08:12 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/31 "2022-09-26T08:12:45Z")

</div>

> [@tve](#):
>
> > [@cameo69](#):
> >
> > How can I empty the array of buttons except by restarting node-red?
> 
> [https://flexdash.github.io/docs/using-flexdash/array-widgets/#deleting-array-elements](https://flexdash.github.io/docs/using-flexdash/array-widgets/#deleting-array-elements)
> 
> I've been wanting to add a message to delete-all but I'm not sure how to encode that...

Deletion works if done item by item.

What sometimes does not work is the change of the dropdown list to empty.  
Albeit, always sending `{ payload: "" }`

For example:

```auto
const newbtn = oldbtn.filter(e => e !== topic)

return [
    { payload: "", choices: newbtn }
    ]

```

See in the example below... should be emptied whenever an item is deleted or all items are deleted. But sometimes it is not. Maybe a mistake in my code, but looks more like issue with logic inside dropdown.

![output_buttons5](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/3/8392fbaa535a128bcae1a9f9571b761a3239cf31.gif)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/8/d839dabc0631f32958544c89f7aaf7425e2ef05f.png)

```auto
[{"id":"adb7eae63154ed82","type":"change","z":"95e238910d29e0c2","name":"","rules":[{"t":"set","p":"label","pt":"msg","to":"topic","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":680,"y":200,"wires":[["9408f7f8ce7a7483"]]},{"id":"6b55b3797fc1ce3d","type":"debug","z":"95e238910d29e0c2","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":850,"y":300,"wires":[]},{"id":"540205cc2cd8f831","type":"function","z":"95e238910d29e0c2","name":"add to list","func":"const topic = msg.topic\nvar btn = flow.get(\"btnarray\") || []\nbtn.push(topic)\nflow.set(\"btnarray\", btn)\n\nconst newPayload = flow.get(\"btnarray\") || []\n\nreturn [\n { topic: topic, title: topic },\n { payload: topic, choices: btn }\n];","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":160,"y":200,"wires":[["75961e82d73d9aec"],["d7bb96a5b22e1080"]]},{"id":"ec335d92973b49df","type":"function","z":"95e238910d29e0c2","name":"remove from list","func":"var oldbtn = flow.get(\"btnarray\") || []\nconst topic = msg.payload\n\nconst newbtn = oldbtn.filter(e => e !== topic)\n\nflow.set(\"btnarray\", newbtn)\n\nreturn [\n { topic: topic, _delete: true},\n { payload: \"\", choices: newbtn }\n];","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":140,"y":300,"wires":[["75961e82d73d9aec"],["d7bb96a5b22e1080"]]},{"id":"f89c21e8bfab9eb1","type":"http request","z":"95e238910d29e0c2","name":"","method":"GET","ret":"obj","paytoqs":"ignore","url":"https://random-word-api.herokuapp.com/word","tls":"","persist":false,"proxy":"","insecureHTTPParser":false,"authType":"","senderr":false,"headers":[],"x":350,"y":120,"wires":[["18c687013e62f435"]]},{"id":"18c687013e62f435","type":"change","z":"95e238910d29e0c2","name":"","rules":[{"t":"set","p":"topic","pt":"msg","to":"msg.payload[0]","tot":"jsonata"},{"t":"set","p":"title","pt":"msg","to":"msg.payload[0]","tot":"jsonata"}],"action":"","property":"","from":"","to":"","reg":false,"x":550,"y":120,"wires":[["540205cc2cd8f831"]]},{"id":"9408f7f8ce7a7483","type":"fd-label","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":1,"fd_rows":1,"fd_array":false,"fd_array_max":10,"name":"","title":"","popup_info":"","label":"banane","color":"purple-accent-3","align":"center","justify":"center","weight":"400","size":"100%","padding":"4px","x":830,"y":200,"wires":[]},{"id":"d7bb96a5b22e1080","type":"fd-dropdown-select","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":"2","fd_rows":1,"fd_array":false,"fd_array_max":10,"fd_output_topic":"","name":"","title":"Detele Button","popup_info":"","enabled":true,"value":"","choices":[],"labels":[],"allow_multiple":false,"color":"","x":610,"y":300,"wires":[["6b55b3797fc1ce3d","ec335d92973b49df"]]},{"id":"3cb0ab8809391dd3","type":"fd-push-button","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":"2","fd_rows":1,"fd_array":false,"fd_array_max":10,"fd_output_topic":"","name":"add new button","title":"add new button","popup_info":"","enabled":true,"color":"","output_value":25,"icon":null,"x":160,"y":120,"wires":[["f89c21e8bfab9eb1"]]},{"id":"75961e82d73d9aec","type":"fd-push-button","z":"95e238910d29e0c2","fd_container":"6d69e6adc0fd0416","fd_cols":1,"fd_rows":1,"fd_array":true,"fd_array_max":"5","fd_output_topic":"bix","name":"array of buttons","title":"button1","popup_info":"","enabled":true,"color":"","output_value":25,"icon":null,"x":490,"y":200,"wires":[["adb7eae63154ed82"]]},{"id":"7576b5c91ca5324e","type":"fd-push-button","z":"95e238910d29e0c2","fd_container":"16ba1ce3418bf289","fd_cols":"2","fd_rows":1,"fd_array":false,"fd_array_max":10,"fd_output_topic":"","name":"delete all","title":"delete all","popup_info":"","enabled":true,"color":"","output_value":25,"icon":null,"x":140,"y":400,"wires":[["4f6a3c53f61c5610"]]},{"id":"4f6a3c53f61c5610","type":"function","z":"95e238910d29e0c2","name":"delete all from list","func":"var oldbtn = flow.get(\"btnarray\") || []\n\nconst newbtn = []\n\nflow.set(\"btnarray\", newbtn)\n\nreturn [\n oldbtn.map((e) => ({\n topic: e,\n _delete: true\n }))\n,{payload: \"\", choices: []}]\n","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":330,"y":400,"wires":[["53dcc48b954c6712","75961e82d73d9aec"],["d7bb96a5b22e1080","b7d412a169a434b2"]]},{"id":"53dcc48b954c6712","type":"debug","z":"95e238910d29e0c2","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":850,"y":380,"wires":[]},{"id":"b7d412a169a434b2","type":"debug","z":"95e238910d29e0c2","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":850,"y":420,"wires":[]},{"id":"16ba1ce3418bf289","type":"flexdash container","name":"button static container","kind":"StdGrid","fd_children":",9408f7f8ce7a7483,3cb0ab8809391dd3,d7bb96a5b22e1080,7576b5c91ca5324e","title":"button static container","tab":"5671049acbf17679","min_cols":"1","max_cols":"20","parent":"2e1077589627ac5c","solid":false,"cols":"1","rows":"1"},{"id":"6d69e6adc0fd0416","type":"flexdash container","name":"button container","kind":"StdGrid","fd_children":",75961e82d73d9aec","title":"button container","tab":"5671049acbf17679","min_cols":"1","max_cols":"20","parent":"","solid":false,"cols":"1","rows":"1"},{"id":"5671049acbf17679","type":"flexdash tab","name":"Demo","icon":"mdi-view-dashboard","title":"Demo","fd_children":",2e1077589627ac5c,16ba1ce3418bf289,6d69e6adc0fd0416","fd":"e8f5aea52ab49500"},{"id":"2e1077589627ac5c","type":"flexdash container","name":"Demo grid","kind":"StdGrid","fd_children":",f6032f8e6e47b319","title":"Demo grid","tab":"5671049acbf17679","min_cols":2,"max_cols":6,"parent":"","solid":false,"cols":"1","rows":"1"}]

```

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [2 October 2022 08:28 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/32 "2022-10-02T08:28:18Z")

</div>

Just noticed this line in my node-RED log;

`2 Oct 09:14:36 - [info] [flexdash dashboard:digitalnut] Sending config to UxW7pX5GYaG9R3RmAAAh from store undefined including dash, tabs, grids, widgets`

It mentions `store undefined`, is this something that users need to define ?

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [2 October 2022 16:26 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/33 "2022-10-02T16:26:58Z")

</div>

The 'store' here refers to something else, I should fix that. It's OK as-is.

---

<div class="post-metadata">

**Author:** ![cameo69](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/cameo69/32/66593_2.png) [@cameo69](https://discourse.nodered.org/u/cameo69)\
**Post date:** [5 October 2022 14:57 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/34 "2022-10-05T14:57:21Z")

</div>

> [@cameo69](#):
>
> What sometimes does not work is the change of the dropdown list to empty.  
> Albeit, always sending `{ payload: "" }`

@tve, what is the proper way of emptying the dropdown list? Sending `{ payload: "" }` works sometimes, but not always. Bug?

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [6 October 2022 04:03 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/35 "2022-10-06T04:03:15Z")

</div>

@cameo69 Sorry, took a while. The problem is the same as for the toggle where the local feedback (you select a new value, it changes what the widgets displays and outputs the new value) fundamentally breaks what's happening. You can see that if you do the following:

- add some buttons
- select one button to delete
- as you select, internally the value is set to the entry you choose
- your flow then sets payload="" so the selection changes to empty
- select another button to delete
- as you select, internally the value is set to the entry you choose
- your flow then sets payload="", but it's already "", so nothing changes
- the drop-down thus continues to display the entry you deleted

I believe the fix is the same as for toggle and others: I need to move the feedback into node-red.

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [9 October 2022 20:47 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/36 "2022-10-09T20:47:19Z")

</div>

When using a Sparkline node, it does not load the previous value upon a browser connect, like a Stat node does.  
_Example_, browser connects and the dashboard has a Stat node and a Sparkline node, both receiving the same payload. Initially, the Stat node displays the previous payload received (22.4°C), but the Sparkline node remains blank.  
Only when another payload arrives (22.5°C) does the Sparkline node display any data (which could be minutes later).  
Is this something that we need to manage in the flow? and if so, how can we determine that a browser has connected.  
In the ui-dashboard, we used the `ui_control` node to determine a browser connect.

![stat](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/a/3ac1c961c174a9569b420d033ea9c147b7329be4.gif)

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [10 October 2022 00:56 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/37 "2022-10-10T00:56:16Z")

</div>

This is a bug that also affects the other time series plots. I have not looked into it, but it's at the top of my list. (I'm currently trying to use FD in another project.)

Edit: I spent some time looking at it. It's a slightly different issue. Well, there are really 2 issues 😪 One is easy to fix, which is that nothing appears when the widget is brought up. The harder one is that sending individual values (as opposed to an array) just fundamentally doesn't work the way I'm doing it. I need to fix that.  
I will try to get another release out the coming week, but can't promise, some unexpected personal things have come up.

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [10 October 2022 05:18 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/38 "2022-10-10T05:18:41Z")

</div>

List of issues I have noted down:

- Toggle and other input feedback/loopback has to go through server
- Sending one value to plots or sparkline doesn't work when browser is refreshed, need to fix implementation
- Log line "Sending config to ... from store undefined" is confusing
- ~~Panel shows a ripple on click, it shouldn't.~~
- TimePlot is blank if both axes are used and the data for one of the axes is all null (prob. uPlot bug)
- TimePlot should support SI prefixes
- When there are many time plots on a page the tooltip can appear in the wrong plot (needs clean repro)
- TimePlot: remove circles for data points when there are few points
- TimelinePlot needs to be clickable
- TimelinePlot: look into supporting multi-line labels
- ~~TextView: provide option to wrap text, also to scroll to bottom~~
- Button: look into 100% width option as well as FAB support
- Figure out support for per-connection data
- Support simple login
- Option to hide edit mode

Phew...

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [23 October 2022 14:38 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/39 "2022-10-23T14:38:48Z")

</div>

> [@tve](#):
>
> I will try to get another release out the coming week, but can't promise, some unexpected personal things have come up.

No worries, home life must always come first!

---

<div class="post-metadata">

**Author:** ![tve](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/tve/32/59475_2.png) [@tve](https://discourse.nodered.org/u/tve)\
**Post date:** [23 October 2022 18:35 UTC](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783/40 "2022-10-23T18:35:20Z")

</div>

Thanks for your patience! If there's something you need fixed urgently please point it out and I'll take a crack at it.  
I'm having trouble wrapping up a release of another open-source project (which actually uses FlexDash) and hope to get back to FlexDash this coming week, but I've been overly optimistic before...

[Previous page](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783.md?page=1)

[Next page](https://discourse.nodered.org/t/flexdash-alpha-release-round-2/67783.md?page=3)
