DB2 - since 1.24.1 onwards - the size of widgets is getting changed

Dashboard
1

Hi ,

I was on DB 1.24.0
I upgraded to 1.24.1 and then to 1.24.2 and then to 1.25 . Post each step i see the issue which seems to have appeared in 1.24.1 - continues to persist.
(I have rechecked with each of the new versions to be 100% since when the issue occurs).

For now had to revert back to 1.24.0 - to avoid rechanging every widget.

Issue 1 :
I have multiple dynamic forms. For most of them - the size is X * 1.
X changes from form to form . But the number of rows remains 1.

The forms are being created dynamically via. msg.ui_update
Example say - a form has 4 x 1.
And if node receives payload object which has say 10 attributes - the form would end up showing all attributes. (The widget would stretch and add multiple rows to accommodate the extra rows)

From 1.24.1 - it seems something was changed and now the size of the object defined is strictly being adhered to. So in above example now it shows only 1 row.

This now causes a new problem. For dynamically created objects - we cannot maintain a strict size of widget . If i make the widget as 4x20 - then if the number of rows are less - there is extra white space being shown and if it make it too less this causes a scroll bar to appear.

Can someone suggest if changes were done in this area ?
If so - how should we work with sizing esp. around dynamic objects ?

Issue 2 : Template node sizing.
I had my template node as 14*1 . And it worked well to show me content .
From 1.24.1 - unless i make it auto - it doesnt show the content at all.

Not sure how to handle this. I can live with auto - but wondering if i need to be aware of any side effects.

2

The problem was widget sizing did not correctly honour it's setting. Since this change it was made more strict in respecting the set size. This is what will be causing your issues. I'm afraid it is quite unlikely this will be reverted so some other approach will be necessary to resolve your situation.

3

Was there any change around "auto" sizing ?

4

I don't believe so.

If you can post a standalone demo flow that demonstrates what you are doing, I'll see if I can provide some CSS that emulated the behaviour you want.

5

The css in this post reverts the sizing behaviour for the classic gauge, something similar should work for the form. Widget Sizing Issue · Issue #20 · colinl/node-red-dashboard-2-ui-gauge-classic · GitHub

Not at my PC at the moment so can't say exactly what.

6

Try this for the form sizing. Paste this css override template anywhere in your flow, no need to connect it to anything, it has global effect.

[{"id":"e964360de9cbf375","type":"ui-template","z":"8fde719260b2c325","group":"","page":"","ui":"04ee189a49c54f22","name":"CSS to allow form to expand vertically","order":0,"width":0,"height":0,"head":"","format":".nrdb-ui-widget.nrdb-ui-form\n{\n    grid-row-end: span null !important;\n    grid-template-rows: repeat(0, var(--widget-row-height)) !important;\n}","storeOutMessages":true,"passthru":true,"resendOnRefresh":true,"templateScope":"site:style","className":"","x":710,"y":380,"wires":[[]]},{"id":"04ee189a49c54f22","type":"ui-base","name":"Remote dash","path":"/dashboard","appIcon":"","includeClientData":true,"acceptsClientConfig":["ui-control","ui-notification"],"showPathInSidebar":false,"headerContent":"page","navigationStyle":"temporary","titleBarStyle":"default","showReconnectNotification":false,"notificationDisplayTime":5,"showDisconnectNotification":true},{"id":"3cde2bb95028a1fd","type":"global-config","env":[],"modules":{"@flowfuse/node-red-dashboard":"1.25.0"}}]
7

I am not able to test it, but for the ui-templates try the same thing but with selector
.nrdb-ui-widget.nrdb-ui-template

8

I have implemented this at page level for now. This seems to work. I have tested it with 1.24.0 and on 1.25.0 both. Seems to ok across.

Had to implement it also for text widget.
For now kept template node in auto size mode. Seems to work.

Thanks a ton @Colin for helping on this one.

9

Ideally it would be good if we could specify a fixed width but had the option of Auto for height.