Lovelace: Decluttering Card

so its not possible to use the same decluttering templates for multiple dashboards?

ups… I should read the whole comment. Thanks a lot for the explanation!

Edit: Sad that it’s not really worth to dive into this card, as everything seems to slow down if this card is used. Plus there have not been any updates for almost 3 years now…

It would declutter my code so much, but those are deal breakers imo

3 Likes

decluttering does not evaluate templates unfortunately. it only passes strings.

explain please? can not state the same experience on this side, using a rather extended frontend, and some serious decluttering going on.
Maybe you have another issue at hand?

now that is true. otoh, there have been no real issues to solve and it keeps doing its job nicely

I noticed this while using the tap_action: more-info popup. The popup is slowed down by a second if using decluttering card. That’s what scared me

Right, I see.
not using that myself, so I couldn’t respond to that really, but are you sure there’s nothing else in that card config that might cause the delay? The decluttering card really only ‘rewrites’ the yaml, and once that is loaded shouldn’t be any different than writing the card without it.

Note I say ‘shouldnt’… ofc there is always the exception to the rule :wink:

I only tested this with custom mushroom cards. But the delay is definitely not there if I use them regularly. Would you mind to test this on your environment?

sure.
paste you’re yaml here, and I can have a look

Thanks for the reply, that is too bad really. I wanted to show a mushroom card with a simple string on one lovelace page, but showing the template on another page. I guess there’s now way around this unless decluttering card gets an update?

I can confirm, I have a simple camera card with more-info popup which shows instantly, and multiple declutter cards in a stack-in-card (so different card, but same popup) where the popup shows with a slight delay. I’d say it’s almost unnoticeable (can’t be more than 0.3 seconds), but when compared to the popup of the camera card there is definitely a difference.

Have terrible experience with camera cards and especially the more info myself, but also without the decluttering card so that might be another issue. See this post

On the template , give us an idea in yaml what you would like and we can see.

Maybe it’s just taking it 1 step earlier in the yaml rebuild sequence

I guess I just found the issue. The delay is only happening if double_tap_action is defined in the card. if not it just pops up right away. That is great news as I can now use the decluttering card :smiley:

I don’t have a lovelace-ui.yaml, I guess because I only edit my lovelace from the UI itself. I added decluttering_templates: in the raw configuration editor, on the same level as views:, but the card I added says No card type configured. Anyone have any idea?

No code = no ideas (

Start of my raw lovelace config:

iron-overlay-backdrop-background-color: rgba(41,128,185,0.25)
swipe_nav:
  animate: swipe
  prevent_default: true
  swipe_amount: 30
  wrap: true
decluttering_templates:
  my_first_template:
    default:
      - icon: fire
    card:
      type: custom:button-card
      name: '[[name]]'
      icon: mdi:[[icon]]
views:
  - theme: Backend-selected
    icon: mdi:home
    panel: false
    path: home
    title: Home
    visible:
etc.......

Test card:

  template: my_first_template
  variables:
    - name: Test Button
    - icon: arrow-up

This is the error I see if it helps any more:image

Is this a screenshot from UI editor?
Try to remove the leading “-“.

1 Like

Ohh that was it! I have no idea how I ended up copying the example without the leading -, I guess after like 3 years I still don’t know how YAML works :joy:

1 Like

for anyone looking to add templates to decluttering-card, I found this to be a working solution, in cooperation with config-template-card:

card:
  type: custom:config-template-card
  entities:
    - '[[entity]]'
  variables:
    id: states[ '[[entity]]' ].attributes.friendly_name
  card:
    type: custom:mod-card
    card_mod:
      style:
        .: |
          ha-card {
            --restriction-lock-icon-size: 14px;
            --restriction-regular-lock-color: var(--background-color-on);
            --restriction-success-lock-color: green;
            --restriction-lock-opacity: 0.8;
          }
        restriction-card$: |
          ha-icon {
            display: flex;
            position: absolute;
            top: 8px;
            left: 40px;
            background: red;
            border-radius: 50%;
          }
    card:
      type: custom:restriction-card
      restrictions:
        confirm:
          text: ${'Wil je ' + id + ' schakelen?'}
      card:
        type: '[[type]]'
        entity: '[[entity]]'
        name: '[[name]]'
        tap_action:
          action: toggle

and a dashboard config with:

        - type: custom:decluttering-card
          template: badge_mod
          variables:
            - type: tile #'custom:mushroom-entity-card'
            - entity: switch.espresso_keuken
            - name: Espresso

Scherm­afbeelding 2023-01-26 om 13.00.18

click to popup confirmation:

click OK to take out lock:

Scherm­afbeelding 2023-01-26 om 13.00.44

1 Like

testing something on a minimalistic area card, which initially seems to work as expected but unfortunately changes the card size inside the grid see decluttering inside a core grid card behaves oddly, changes size of the grid tile · Issue #59 · custom-cards/decluttering-card · GitHub

card:
  type: custom:minimalistic-area-card
  card_mod:
    style: |
      ha-card {
        filter: {{'grayscale(0%)' if
                  (is_state('[[main_id]]','on') or
                   is_state('[[motion_id]]','on'))
                  else 'grayscale(100%)'}};
        border-top: {{'1rem solid red' if is_state('[[motion_id]]','on')
              else 'none'}};
      }
  title: '[[title]]'
  hide_unavailable: true
  area: '[[area]]'
  image: /local/images/areas/[[image]]
  shadow: false
  tap_action:
    action: navigate
    navigation_path: /ui-sub-views/[[path]]
  hold_action:
    action: call-service
    service: light.toggle
    service_data:
      entity_id: '[[main_id]]'
  entities:
    - entity: '[[temp_id]]'
    - entity: '[[humid_id]]'

is verbosely copied from the working card itself

Is there an option to check the output of the template, so what is pasted in the file through decluttering card?
I have the problem that some code does not work and i do not know what’s wrong.

if its a decluttering error, you should be seeing the big red card with all yaml?

No, there is nothing showing at all (which is added through the decluttering card).

Template definition:

decluttering_templates:
  test:
    type: conditional
    conditions:
      - entity: switch.flur_eingang_alle_steckdosen
        state: 'on'
    chip:
      type: template
      icon: mdi:lightbulb

Usage:

type: custom:stack-in-card
cards:
  - type: custom:mushroom-chips-card
    chips:
      - type: entity
        entity: person.administrator
      - type: custom:decluttering-card
        template: test
        variables:
          - room: buro
      - type: conditional
        conditions:
          - entity: switch.flur_eingang_alle_steckdosen
            state: 'on'
        chip:
          type: template
          icon: mdi:power-plug

The first chip is showing. As well as the third. It should be the same code (just the icon is different to test which code is actually used).

Any ideas?