Item displayState shows undefinded in the footer?

hi, I’m making a typical PV list that seemed to work in OH4 and now in 5.0.1 i kind of hit a wall.

- component: oh-list-item
      config:
        title: PV String 1
        icon: f7:bolt_horizontal_fill
        iconColor: yellow
        after: =items.Deye_PV1_Power.state
        footer: =items.Deye_PV1_Voltage.displayState + '  /  ' +
          items.Deye_PV1_Current.displayState
- component: oh-label-item
      config:
        item: Deye_PV1_Voltage
        title: PV1

Deye_PV1_Voltage is defined for sure, when I use it in the label-item it is just fine, if I try to put it into footer it shows undefined and sometimes for 1 sec it pops with right value but then back to undefined.

image

O like this it was good for just a second on the second string that is also all the time defined.

MAciej

This is expected behavior. displayState is only defined if it is different than the actual state (to reduce data demands). This is why you should never rely on displayState only unless you know that whatever transformation you are applying will always give a novel result.

Most widgets examples that use displayState also make sure to fall back to state in case the former is undefined. The default new widget code even includes one example of this:

content: =items[props.item].displayState || items[props.item].state

In fact, this is used so often, there’s a shortcut for it: the single @. So, you can just use

footer: =@'Deye_PV1_Voltage' + '  /  ' + @'Deye_PV1_Current'
1 Like

@JustinG

Hi,

I just have run into very related issue in my custom widget and I noticed that in 5.0.1 some of the old code does not work anymore

The code sniplet is for the line display below the battery icon (108 W).

                        - component: oh-link
                          config:
                            action: popover
                            iconColor: "=(Number.parseFloat(items[props.item37765].state) < 0) ? 'red' :
                              'green'"
                            iconF7: "=(Number.parseFloat(items[props.item37765].state) < 0) ?
                              'arrowtriangle_right_fill' :
                              'arrowtriangle_left_fill'"
                            iconSize: 18px
                            popoverOpen: ="#info-batt"
                            style:
                              color: white
                              font-size: 20px
                              font-weight: 600
                              margin-bottom: 6px
                              margin-top: -2px
                              white-space: nowrap
                            text: = items[props.item37765].displayState

that code worked in 4.x and now it will not anymore.

I could replace it text: = items[props.item37765].displayState with direct item name on this new notation text: =@‘Deye_Bat_Power’ but that supposed to be props field that is configurable

what is the new syntax here if it stays to be configurable.

ps. for some reason if that is not oh-link but an just a label component it still works the old way.

component: Label
config:
style:
font-size: 18px
font-weight: 600
margin-bottom: -6px
margin-top: 3px
white-space: nowrap
text: =items[props.item37760].displayState

Maciej


ok found a soltion, Jiiiz thats complicated since I needed a negative value

text: = (-#props.item37765) + (items[props.item37765].unit ? ’ ’ + items[props.item37765].unit : ‘’)

See my first post: if you use displayState by itself you are going to run into this problem most of the time at some point.

That’s the reason that @ works here; it is not just a shortcut to displayState but includes the necessary fallback to state:

Nothing about this part of the widget expressions has changed with an upgrade from 4 to 5. Probably what’s going on is that the upgrade means some better Item/Unit handling and now your displayState is always the same as your state and therefore does not exist in the widget expressions.

You can use the @ shortcut with props too, you just need to not put quotes around it. The @ shortcut applies to a string of the item name which is why text: =@‘Deye_Bat_Power’ works: you’ve used quotes to make Deye_Bat_Power a string. props.item37760 is a variable that contains the string value. If you put quotes around it and turn it into a string the the shortcut is looking for a Item named props.item37760. So, you just want:

text: =@props.item37760