# Dashboard 2.0 Pre-Alpha Available

**URL:** <https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142>\
**Category:** General\
**Tags:** dashboard-2\
**Created:** [28 July 2023 13:39 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142 "2023-07-28T13:39:33Z")\
**Posts on this page:** 20\
**Page:** 13

<div class="post-metadata">

**Author:** ![jbudd](https://avatars.discourse-cdn.com/v4/letter/j/5f8ce5/32.png) [@jbudd](https://discourse.nodered.org/u/jbudd)\
**Post date:** [19 November 2023 15:09 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/241 "2023-11-19T15:09:07Z")

</div>

> [@Steve-Mcl](#):
>
> mustache support was (deliberately) never carried over.

That's going to make migrating from dashboard 1 painful. 😾

I'm starting to feel uneasy about this new dashboard project.

---

<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:** [19 November 2023 15:35 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/242 "2023-11-19T15:35:09Z")

</div>

> [@jbudd](#):
>
> I'm starting to feel uneasy about this new dashboard project.

I think that there are 2 ways to look at this.

I stopped using DB1 because it was lacking flexibility and started using Flexdash & Grafana instead.  
This is a new beginning, and an opportunity to create something that will satisfy most users, new & experienced alike, and so some things need to change, otherwise we end up with DB1 v3!

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [19 November 2023 15:54 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/243 "2023-11-19T15:54:20Z")

</div>

> [@jbudd](#):
>
> That's going to make migrating from dashboard 1 painful

Unfortunately eggs must be broken to make omelettes Paul 😉

While I appreciate it may make migration a little harder, it will be for good reason. And once embraced, you would realise the mustache method was not great and locked you in to hacky workarounds and less than desirable results.

I am of course speculating but the aim of dashboard 2 is to "move forward". So don't give up hope just yet, whatever is implemented will (we hope) be much better, easier, flexible, prettier, faster, stronger etc ☺

---

<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:** [19 November 2023 16:00 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/244 "2023-11-19T16:00:21Z")

</div>

> [@Steve-Mcl](#):
>
> Unfortunately eggs must be broken to make omelettes Paul 😉

That is also my view. Joe has been very receptive to new ideas being put forward, and now is a good time for users to contribute wherever they can and help shape it's future.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [19 November 2023 16:07 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/245 "2023-11-19T16:07:33Z")

</div>

I have not yet seen any indication of how the issue of selecting and formatting data via the Value Format field is to be addressed in D2. It would be useful to know what approach is to be taken.

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [19 November 2023 16:17 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/246 "2023-11-19T16:17:22Z")

</div>

> [@Steve-Mcl](#):
>
> I am pretty sure mustache support was (deliberately) never carried over.

Was it Mustache, or [AngularJS](https://docs.angularjs.org/api/ng/filter/number#)! ?

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [19 November 2023 16:20 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/247 "2023-11-19T16:20:02Z")

</div>

Indeed it was angular formatting not mustache. They both used {{ }} just to be confusing

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [19 November 2023 16:28 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/248 "2023-11-19T16:28:50Z")

</div>

VueJS also uses the same style of brackets for variables so why can't that be possible in D2?

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [19 November 2023 16:31 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/249 "2023-11-19T16:31:15Z")

</div>

Not a user of VueJS, but reading this it would be in the input msg, possible. [Introduction | Vue Number Format](https://vue-number-format.netlify.app/guide/#globally)

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [19 November 2023 16:31 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/250 "2023-11-19T16:31:24Z")

</div>

Its software. So all things _are_ possible. Just needs someone to write the code.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [19 November 2023 16:36 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/251 "2023-11-19T16:36:18Z")

</div>

Ah was it? I (wrongly) assumed the label was mustache prepossessing (before being passed to angularjs)

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [19 November 2023 16:38 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/252 "2023-11-19T16:38:26Z")

</div>

It can. The template node already supports curly brackets binding.

The tricky part in mapping dynamic binding from backend config (flow) to frontend compiled Vue app.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [19 November 2023 16:38 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/253 "2023-11-19T16:38:47Z")

</div>

Actually thinking about it. The value formatting was angular. The label and some others were a dodgy DCJ regex substitution. 🕶

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [19 November 2023 16:47 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/254 "2023-11-19T16:47:40Z")

</div>

> [@Steve-Mcl](#):
>
> The tricky part in mapping dynamic binding from backend config (flow) to frontend compiled Vue app.

Yup! One of the reasons I dumped VueJS in favour of vanilla HTML 😉

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:24 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/255 "2023-11-21T09:24:35Z")

</div>

> [@Paul-Reed](#):
>
> - Being able to add units to the axis, such as °C, W, mph etc.
> - The hover-over displays all of the values using the same timestamp, instead of just one value. This is useful because you get a overall data snapshot, and then can easily compare values to identify problems. Example; energy data can be volatile, but by displaying all values at a timestamp its easy to do basic maths to identify discrepancies.
> - The x-axis currently just displays hours but not the date & hours, which is helpful when data spans more than one day (also am or pm if displaying 2 digit time?).

@Paul-Reed open to all of these ideas. Could I trouble you to open a GH issue for each of them please? 1. and 3. feel very quick/easy, 2. may be a little trickier, but will do my best.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:33 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/256 "2023-11-21T09:33:00Z")

</div>

As @Steve-Mcl mentioned, we don't _currently_ support this, but I certainly haven't ruled it out. We have [Set labels on charts and other widgets via msg · Issue #234 · FlowFuse/node-red-dashboard · GitHub](https://github.com/FlowFuse/node-red-dashboard/issues/234) open to discuss this, but not a lot of thought gone into it just yet.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:34 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/257 "2023-11-21T09:34:22Z")

</div>

> [@jbudd](#):
>
> I'm starting to feel uneasy about this new dashboard project.

@jbudd open to all ideas/feedback. We aren't just copying Dashboard 1.0 verbatim. Where appropriate, and with careful consideration, we are trying to make improvements, with functionality and UX in order to make Dashboard 2.0 a better Dashboarding solution that D1.0.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:35 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/258 "2023-11-21T09:35:02Z")

</div>

> [@Colin](#):
>
> I have not yet seen any indication of how the issue of selecting and formatting data via the Value Format field is to be addressed in D2. It would be useful to know what approach is to be taken.

> <https://github.com/FlowFuse/node-red-dashboard/issues/234>
>
> \### Description
> 
> In Dashboard 1, it was possible to set a widgets label using mu…stache format. e.g. \`{{topic}} temperature\` 
> 
> This is especially useful (for example) when pulling data from a database to display in a chart - you might want the title to read "Data for {{lineName}} for {{monthName}}"
> 
> I am not syaing we \_must\_ add mustache support but rather perhaps the label could support JSONata to permit it to be computed? Or could be updated via a specially crafter message.
> 
> \### Have you provided an initial effort estimate for this issue?
> 
> I have provided an initial effort estimate

Any discussion should take place in this issue, no thoughts given so far.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:48 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/259 "2023-11-21T09:48:07Z")

</div>

> [@Paul-Reed](#):
>
> Joe has been very receptive to new ideas being put forward, and now is a good time for users to contribute wherever they can and help shape it's future.

Thanks @Paul-Reed - as far as I'm concerned, I'm just a dev that is executing the ideas on GitHub. Some of those ideas are my own, some aren't. Anyone is open to contributing to Dashboard 2.0, I'm just lucky enough that my job at FlowFuse allows me to do this between 9 and 5.

My rich background in data vis and UI design/dev I hope helps shape some of these ideas for the better, but always open to building ideas that aren't my own, or ideas that are popular with community that I may not agree with myself.

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [21 November 2023 09:50 UTC](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142/260 "2023-11-21T09:50:53Z")

</div>

> now is a good time for users to contribute wherever they can and help shape it's future.

One particularly good example of this is our Third Party Integration workflow. I spent 2 weeks building that recently, [delivered it](https://flowfuse.com/blog/2023/10/dashboard-integrations/), feedback from community [wasn't good](https://github.com/FlowFuse/node-red-dashboard/issues/307), as it was _too similar_ to Dashboard 1.0, and the development experience with D1.0 was not good for third party widgets.

We've stripped it all back, started again, and we're due to push the [new version](https://github.com/FlowFuse/node-red-dashboard-example-node/pull/3) of it this week.

[Previous page](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142.md?page=12)

[Next page](https://discourse.nodered.org/t/dashboard-2-0-pre-alpha-available/80142.md?page=14)