[Request] Secondary Sort

[KairuByte]

A secondary sort would be nice. For instance, if I want to sort things so that unavailable items are shown first, and then sort numerically, I am unable to. A use case would be battery level for devices sorted in reverse numerical order, where a dead battery would result in an unavailable state, which would sort below 100%.

[ildar170975]

You may define more sorting methods using a template option.

[jurgen2005]

could you provide an example?

[ildar170975]

Please check here: #367

[TimothyJCowen]

It would be nice if this could be implemented, honestly. The UI of the card is missing a lot of options that the YAML has (which is a separate issue), but also a multi-level sort is a pretty reasonable thing to expect for something like this. Especially since we shouldn't have to use the template option for 99% of the use-cases.

[royf007]

Can someone provide suggestions or an example on how I can use the template option to sort the entities in this card, first by by state (which is working) and then by the friendly_name? I'm trying to inject the friendly_name into the bar-card, but at the moment it's hard-coded in the bar-card name parameter for this example.

The auto-entities card is sorting by the battery entity ID when the states are equal, i.e. 100% . But, I would love to see My Custom Name (in the proper sort sequence), assuming I manage to inject the friendly-name in the bar-card.

I can always rename the battery entity IDs to force the sorting to accomplish what I'm trying to do. I have a ton of battery sensors.

Also, I don't really want to start creating a bunch input helpers for this purpose.

An awesome feature request would be to allow the auto-entities sort parameter to accept a custom sort key, i.e. states(config.entity) + ":" + "001", so something like "100:001", "100:002", etc, that can be passed in with Jinja2.

....Or a secondary sort parameter for auto-entities that can just use any attribute of the entity when the states of the first sort key are equal. That would probably be the most versatile.

Auto-Entities Dashboard Card YAML

type: custom:auto-entities
card:
  title: Battery Status
  type: entities
  state_color: false
  show_header_toggle: false
filter:
  include:
    - entity_id: sensor.curio_light_switch_battery_plus
      options:
        type: custom:bar-card
        animation: true
        max: 100
        height: 40px
        positions:
          name: outside
          icon: outside
          value: inside
          indicator: 'off'
        unit_of_measurement: '%'
        severity:
          - value: null
            from: 0
            to: 10
            color: red
            icon: mdi:battery-alert
          - value: null
            from: 11
            to: 20
            color: darkred
            icon: mdi:battery-10
          - value: null
            from: 21
            to: 30
            color: darkorange
            icon: mdi:battery-20
          - value: null
            from: 31
            to: 40
            color: orange
            icon: mdi:battery-30
          - value: null
            from: 41
            to: 50
            color: yellow
            icon: mdi:battery-40
          - value: null
            from: 51
            to: 60
            color: yellowgreen
            icon: mdi:battery-50
          - value: null
            from: 61
            to: 70
            color: lightgreen
            icon: mdi:battery-60
          - value: null
            from: 71
            to: 80
            color: limegreen
            icon: mdi:battery-70
          - value: null
            from: 81
            to: 90
            color: green
            icon: mdi:battery-80
          - value: null
            from: 91
            to: 100
            color: darkgreen
            icon: mdi:battery
        card_mod:
          style: |
            ha-card {
              border-style: hidden;
            } 
            .card-content {
              padding: 0px;
            }
            bar-card-card {
              height: 35px;
            }
            bar-card-value {
              color: white;
            }
            bar-card-name:after {
              content: "\A Battery Type: CR2032 x 1";
              white-space: pre;
              font-size: 12px;
              color: green;
              font-weight: bold;
            }
            bar-card-name {
              width: 250px;   
              font-size: 13px;
            }
            ha-icon {
              {% if states(config.entity) | int <= 10 %}
                color: red;
              {% elif states(config.entity) | int <= 20 %}
                color: darkred;
              {% elif states(config.entity) | int <= 30 %}
                color: darkorange;
              {% elif states(config.entity) | int <= 40 %}
                color: orange;
              {% elif states(config.entity) | int <= 50 %}
                color: yellow;
              {% elif states(config.entity) | int <= 60 %}
                color: yellowgreen;
              {% elif states(config.entity) | int <= 70 %}
                color: lightgreen;
              {% elif states(config.entity) | int <= 80 %}
                color: limegreen;
              {% elif states(config.entity) | int <= 90 %}
                color: green;
              {% else %}
                color: darkgreen;
              {% endif %}
            }
    - entity_id: sensor.family_sliding_door_sensor_battery_level
      options:
        type: custom:bar-card
        name: My Custom Name
        animation: true
        max: 100
        height: 40px
        positions:
          name: outside
          icon: outside
          value: inside
          indicator: 'off'
        unit_of_measurement: '%'
        severity:
          - value: null
            from: 0
            to: 10
            color: red
            icon: mdi:battery-alert
          - value: null
            from: 11
            to: 20
            color: darkred
            icon: mdi:battery-10
          - value: null
            from: 21
            to: 30
            color: darkorange
            icon: mdi:battery-20
          - value: null
            from: 31
            to: 40
            color: orange
            icon: mdi:battery-30
          - value: null
            from: 41
            to: 50
            color: yellow
            icon: mdi:battery-40
          - value: null
            from: 51
            to: 60
            color: yellowgreen
            icon: mdi:battery-50
          - value: null
            from: 61
            to: 70
            color: lightgreen
            icon: mdi:battery-60
          - value: null
            from: 71
            to: 80
            color: limegreen
            icon: mdi:battery-70
          - value: null
            from: 81
            to: 90
            color: green
            icon: mdi:battery-80
          - value: null
            from: 91
            to: 100
            color: darkgreen
            icon: mdi:battery
        card_mod:
          style: |
            ha-card {
              border-style: hidden;
            } 
            .card-content {
              padding: 0px;
            }
            bar-card-card {
              height: 35px;
            }
            bar-card-value {
              color: white;
            }
            bar-card-name:after {
              content: "\A Battery Type: CR2032 x 2";
              white-space: pre;
              font-size: 12px;
              color: green;
              font-weight: bold;
            }
            bar-card-name {
              width: 250px;   
              font-size: 13px;
            }
            ha-icon {
              {% if states(config.entity) | int <= 10 %}
                color: red;
              {% elif states(config.entity) | int <= 20 %}
                color: darkred;
              {% elif states(config.entity) | int <= 30 %}
                color: darkorange;
              {% elif states(config.entity) | int <= 40 %}
                color: orange;
              {% elif states(config.entity) | int <= 50 %}
                color: yellow;
              {% elif states(config.entity) | int <= 60 %}
                color: yellowgreen;
              {% elif states(config.entity) | int <= 70 %}
                color: lightgreen;
              {% elif states(config.entity) | int <= 80 %}
                color: limegreen;
              {% elif states(config.entity) | int <= 90 %}
                color: green;
              {% else %}
                color: darkgreen;
              {% endif %}
            }
    - entity_id: sensor.assure_touchscreen_deadbolt_battery_level
      options:
        type: custom:bar-card
        animation: true
        max: 100
        height: 40px
        positions:
          name: outside
          icon: outside
          value: inside
          indicator: 'off'
        unit_of_measurement: '%'
        severity:
          - value: null
            from: 0
            to: 10
            color: red
            icon: mdi:battery-alert
          - value: null
            from: 11
            to: 20
            color: darkred
            icon: mdi:battery-10
          - value: null
            from: 21
            to: 30
            color: darkorange
            icon: mdi:battery-20
          - value: null
            from: 31
            to: 40
            color: orange
            icon: mdi:battery-30
          - value: null
            from: 41
            to: 50
            color: yellow
            icon: mdi:battery-40
          - value: null
            from: 51
            to: 60
            color: yellowgreen
            icon: mdi:battery-50
          - value: null
            from: 61
            to: 70
            color: lightgreen
            icon: mdi:battery-60
          - value: null
            from: 71
            to: 80
            color: limegreen
            icon: mdi:battery-70
          - value: null
            from: 81
            to: 90
            color: green
            icon: mdi:battery-80
          - value: null
            from: 91
            to: 100
            color: darkgreen
            icon: mdi:battery
        card_mod:
          style: |
            ha-card {
              border-style: hidden;
            } 
            .card-content {
              padding: 0px;
            }
            bar-card-card {
              height: 35px;
            }
            bar-card-value {
              color: white;
            }
            bar-card-name:after {
              content: "\A Battery Type: CR2032 x 2";
              white-space: pre;
              font-size: 12px;
              color: green;
              font-weight: bold;
            }
            bar-card-name {
              width: 250px;   
              font-size: 13px;
            }
            ha-icon {
              {% if states(config.entity) | int <= 10 %}
                color: red;
              {% elif states(config.entity) | int <= 20 %}
                color: darkred;
              {% elif states(config.entity) | int <= 30 %}
                color: darkorange;
              {% elif states(config.entity) | int <= 40 %}
                color: orange;
              {% elif states(config.entity) | int <= 50 %}
                color: yellow;
              {% elif states(config.entity) | int <= 60 %}
                color: yellowgreen;
              {% elif states(config.entity) | int <= 70 %}
                color: lightgreen;
              {% elif states(config.entity) | int <= 80 %}
                color: limegreen;
              {% elif states(config.entity) | int <= 90 %}
                color: green;
              {% else %}
                color: darkgreen;
              {% endif %}
            }
    - entity_id: sensor.statue_light_switch_battery_plus
      options:
        type: custom:bar-card
        animation: true
        max: 100
        height: 40px
        positions:
          name: outside
          icon: outside
          value: inside
          indicator: 'off'
        unit_of_measurement: '%'
        severity:
          - value: null
            from: 0
            to: 10
            color: red
            icon: mdi:battery-alert
          - value: null
            from: 11
            to: 20
            color: darkred
            icon: mdi:battery-10
          - value: null
            from: 21
            to: 30
            color: darkorange
            icon: mdi:battery-20
          - value: null
            from: 31
            to: 40
            color: orange
            icon: mdi:battery-30
          - value: null
            from: 41
            to: 50
            color: yellow
            icon: mdi:battery-40
          - value: null
            from: 51
            to: 60
            color: yellowgreen
            icon: mdi:battery-50
          - value: null
            from: 61
            to: 70
            color: lightgreen
            icon: mdi:battery-60
          - value: null
            from: 71
            to: 80
            color: limegreen
            icon: mdi:battery-70
          - value: null
            from: 81
            to: 90
            color: green
            icon: mdi:battery-80
          - value: null
            from: 91
            to: 100
            color: darkgreen
            icon: mdi:battery
        card_mod:
          style: |
            ha-card {
              border-style: hidden;
            } 
            .card-content {
              padding: 0px;
            }
            bar-card-card {
              height: 35px;
            }
            bar-card-value {
              color: white;
            }
            bar-card-name:after {
              content: "\A Battery Type: CR2032 x 1";
              white-space: pre;
              font-size: 12px;
              color: green;
              font-weight: bold;
            }
            bar-card-name {
              width: 250px;   
              font-size: 13px;
            }
            ha-icon {
              {% if states(config.entity) | int <= 10 %}
                color: red;
              {% elif states(config.entity) | int <= 20 %}
                color: darkred;
              {% elif states(config.entity) | int <= 30 %}
                color: darkorange;
              {% elif states(config.entity) | int <= 40 %}
                color: orange;
              {% elif states(config.entity) | int <= 50 %}
                color: yellow;
              {% elif states(config.entity) | int <= 60 %}
                color: yellowgreen;
              {% elif states(config.entity) | int <= 70 %}
                color: lightgreen;
              {% elif states(config.entity) | int <= 80 %}
                color: limegreen;
              {% elif states(config.entity) | int <= 90 %}
                color: green;
              {% else %}
                color: darkgreen;
              {% endif %}
            }
sort:
  method: state
  numeric: true
  reverse: false
show_empty: false