I thought I would post about the solution I have found for how to post notifications/alerts my HA dashboard.
The problem
I wanted to find an easy way that my automations could pop up some sort of notification on the dashboard. There are lots of guides about how to send notifications to phones etc, but very little about how to put things on a dashboard.
A lot of solutions require you to create an input boolean for each thing you want to be notified about, with a conditional card set to pop up when the boolean is triggered. I wanted something a little more dynamic, so that I could fire a notification to the dashboard as easily as sending one to my phone.
My use cases
The two things I wanted to do were:
- Automations can set a notification on the dashboard. The notification can be tapped to dismiss. I use these to do things like remind me that the washing machine is finished and needs emptying.
- Calendar events can trigger a notification. I use these for particular reminders for events in my calendar, like putting the bins out. Tapping the notification dismisses it.
I canāt really do YAML, so needed something super easy.
What doesnāt work (for me)
When I first hunted around for a solution, I happened across this article:
https://chrisirwin.ca/posts/homeassistant-notifications-sync-dashboard-mobile/#notifications-in-dashboard
This uses persistent notifications coupled with an auto entities card.
Unfortunately, as I found out from this thread, persistent notifications no longer appear as entities that can just be put in a card.:
In that thread, there are smart people proposing solutions involving a lot of YAML. This was entirely beyond my capabilities, so I kept looking.
I also found this thread:
Which might provide some answers, but is entirely beyond my understanding.
Here is the solution I came up with
To Do Lists as notifications
Home Assistant has built-in to do list support. You can add items to lists, and create separate lists for different things.
In order to display my notifications, I simply add an item to the right list and it pops right up on my dash.
I have set out a few details of what I have done, in case it helps anyone else.
Setting up the lists
I have set up two to-do lists on the āTo do listsā section of Home Assistant. One is called āDashboard Alertsā and one is called āCalendar Remindersā
Displaying the lists
I use the built-in To Do card, set to hide completed items and hide the āAdd itemā field. The item tap behaviour is set to toggle. I use a separate card for each to do list. The card is set to be hidden when the list is empty (set visibility based on numeric state above 0).
To make it look more like an alert, I have also used a bit of card-mod:
card_mod:
style: |
div.header {
display: none;
}
div.mdc-checkbox {
display: none;
}
ha-card {
background: darkmagenta;
--mdc-typography-subtitle1-font-size: 1.5em;
}
The calendar card is set to blue, the automation reminders are purple.
Iām not sure it the code to get rid of the checkboxes works consistently ā Iām not very good with code (any help would be welcome).
I can slightly cheat to get icons next to my todo items, by including Unicode emoji in the todo item text. It would be nicer to be able to use proper icons though. There is a handy list of emoji here: Emoji - Unicode Explorer
It would be nicer to have more customisation/flexibility in the built in todo card ā or a decent alternative.
Here is an example of the cards:
Notifications from automations
To fire off a notification on the dashboard, I just use the ātodo list add itemā action. A YAML code example (generated from the GUI) is:
- action: todo.add_item
metadata: {}
data:
item: 𩲠Washing Machine is Finished!
target:
entity_id: todo.dashboard_alerts
Notifications from calendars
In order to be able to set a calendar event to throw up a notification on my dashboard, I simply include the text āflgā (short for flag) in the event description. I then have an automation that triggers on calendar events and adds a todo item if it encounters the magic text.
The code for this is:
alias: Calendar events trigger dashboard notification
description: ""
triggers:
- trigger: calendar
entity_id: calendar.main
event: start
offset: "0:0:0"
conditions:
- condition: or
conditions:
- condition: template
value_template: "{{ 'Flg' in trigger.calendar_event.description }}"
- condition: template
value_template: "{{ 'flg' in trigger.calendar_event.description }}"
actions:
- action: todo.add_item
metadata: {}
data:
item: "{{trigger.calendar_event.summary}}"
target:
entity_id: todo.calendar_reminders
mode: single
My wife loves this as she controls the family calendar. We have a calendar card on our family dashboard which shows the entire day but it is great to be able to have separate reminders that have to be dismissed (like āPut kids packed lunch in school bagsā or āPut the bins outā).
Triggering events on dismiss
The main aim of this system is to keep everything simple. The todo-based notifications are fairly dumb and just disappear on a tap.
However, sometime you want to trigger something else when the notification is dismissed. For example, I have a smart bulb that changes colour when my washing machine is finished. When I get rid of my washing machine dashboard notification, I want the bulb to change its colour back.
Unfortunately, there is not a simple trigger that tells me that an item has been dismissed.
However, there is a general trigger for todo events, and that can be used to identify when an item is marked as complete. This is the code I found on a thread somewhere. In the example, it just triggers a persistent notification:
alias: Washing Machine notification cleared
triggers:
- trigger: event
event_type: call_service
event_data:
domain: todo
conditions:
- condition: template
value_template: >-
{{ trigger.event.data.service_data.entity_id == ['todo.dashboard_alerts']
}}
- condition: template
value_template: "{{ trigger.event.data.service == 'update_item' }}"
- condition: template
value_template: "{{ trigger.event.data.service_data.status == 'completed' }}"
- condition: template
value_template: "{{ 'Washing Machine' in trigger.event.data.service_data.rename }}"
actions:
- action: notify.persistent_notification
metadata: {}
data:
message: Washing machine notification cleared
I also have a daily automation that runs overnight and clears out any completed items in my lists. The code is:
- action: todo.remove_completed_items
metadata: {}
data: {}
target:
entity_id:
- todo.calendar_reminders
- todo.dashboard_alerts
Possible improvements
It would be excellent to be able to use the āDescriptionā attribute of a to do list item to pass metadata to the card ā like having a custom icon or colour for each todo list item.
Someone has come up with a way of doing this, but it uses far more custom YAML than I can cope with. See here:
āhttps://www.youtube.com/watch?v=UBG2rfUvzd0&t=27sā
If the HA card could support icons for todo list items natively, that would be superb. It would also be great if there were options in the card to clear out the checkboxes and other bits of the card I donāt need.
I hope this is of some use to others trying to do something similar