Decluttering-card javascript error? e.slice is not a function

Configuration Frontend
1

I’m having a terrible time with decluttering, mostly because I’m a newbie at this but at least in part that I followed the storage instructions when I’m a GUI user and I’d never heard of the raw configuration editor.

I downloaded decluttering-card.js with HACS. I can see it in www/community/decluttering-card/decluttering-card.js.

I use the raw configuration editor in my dashboard to add:

decluttering_templates:
  menu:
    card:
      type: custom:button-card
      name: '[[name]]'
      icon: mdi:'[[icon]]'
      tap_action:
        action: call-service
        service: script.togr
        service_data:
          room: '[[room]]'
      styles:
        icon:
          - color: |
              [[[ if (states['[[room]]'].state == 'on') 
                  return "#FF00FF";
                else return "var(--primary-text-color)";  ]]]

and then add a card to my dashboard:

type: custom:decluttering-card
template: menu
variables:
  name: Lights
  icon: home-floor-3
  room: input_boolean.r3

The error I get is

**e.slice is not a function**
type: custom:decluttering-card
template: menu
variables:
  name: Lights
  icon: home-floor-3
  room: input_boolean.r3

This seems to be a javascript error, and the first function in decluttering-card.js is named e.

I restarted HA and cleared my browsing data without changing the outcome.

Advice?

2

Have not checked the template itself, but the call is wrong, the “variables” must be a list, check examples in Readme.


type: custom:decluttering-card
template: menu
variables:
  - name: Lights
  - icon: home-floor-3
  - room: input_boolean.r3

Also, in most cases there is no need to use decluttering card with a button-card, you may use own templates for button-card.

1 Like
3

Thank you! That is embarrassing for me.