Hiding UI components based on entity state

I’m looking to hide internal CCTV cameras from the (standard) UI based on the state of a presence sensor. I’ve explored using custom-ui and I’ve added to the following to customize.yaml:

camera.kitchen:
  templates:
    hidden: "return (entities['binary_sensor.occupancy'].state === 'off'); "

However the camera is still shown regardless of the state of the occupancy sensor. Can anyone suggest if I’m doing anything wrong, or maybe an alternative way to achieve this? I know I can hide a group, but I don’t want to hide all the cameras in that group (some are external).

(I’m using 0.81.5, and I can see the custom-ui components being loaded successfully in the startup logs)

You could do it with Lovelace conditional Card:

  - type: conditional
    conditions:
      - entity: binary_sensor.occupancy
        state: "on"
    card:
      type: entities
      entities:
        - camera.kitchen
1 Like

I’ve been trying to avoid diving into Lovelace just yet (too many other projects on the go), but I think this may tip me over the edge. Thanks!

I use this in my Tiles:

style_template: >
  if (entities['sensor.mobile_reachable'].state === 'False') return 'display:none';

Should be working, that’s exactly what I have in the customize.yaml.

But what is the global configuration ?
For instance, I have that to enable custom ui :

  customize_glob:
    "*.*":
      custom_ui_state_card: state-card-custom-ui

I don’t remember exactly why it’s needed…

this is needed so you can use custom-ui on all entities.
If you wouldn’t do it globally, you’d have to set it to each entity individually

Ok, so definitly needed, if @analbeard doesn’t have this, it won’t work !