Auto-populating Dashboard with Strategy Pack - Area Dashboard Strategy
Hey, after months of lurking around the forum, I wanted to try to give something back and share something myself.
The Strategy Pack!
It’s a collection of Home Assistant Strategies and is supposed to keep growing.
First, what are Strategies?
A strategy is JavaScript code that gets executed to create Dashboards and Views automatically. They make it easy to have auto-populated Dashboards with next to no configuration! More on them here.
What does Strategy Pack do?
At the moment, there are 3 Strategies, but I am only going to mention one here as it clearly is the most interesting one for others. However, feel free to look at the others, suggest new ones, or even make your own!
Now back to the most important one:
The Area Dashboard Strategy is a Dashboard Strategy, meaning it creates a whole Dashboard for you that looks like this:
with only 2 lines of YAML!
Dashboard → Edit Dashboard → Raw Configuration Editor (kebap menu) → Paste the following
strategy:
type: custom:area-dashboard-strategy
The Dashboard generated will have a view for every Area in your Home Assistant instance.
I always found myself drawn to this solution in Dashboards as my number of entities grew. One single page was always way too cluttered.
This Dashboard additionally has a Tab menu on the right side to group entities and also Grids (=the rows you see with the headers), helping with the distinction between different types of entities.
Nice-looking Dashboard and all, but what’s special about this?
The clue is that it auto-generates everything. Meaning you do not need to list all entities and cards you want in some cumbersome way.
You can just let the Strategy work its magic with the default configuration.
And if you don’t like that, just say something like this with some config: I want all my light entities from the Hue integration belonging to some area in one grid, and the strategy does the rest for you.
You can start out without doing this! There’s a sensible default I use myself which creates this whole dashboard with really just 2 lines! But you can configure it!
It looks like it needs a whole lot of space on the screen. Do I need a second Dashboard for my phone?
The Dashboard is also fully responsive, meaning you can use it on Tablets and Phones as well!
I like it, but I want to change some things.
Perfect, it was designed with that in mind! You can’t make one Dashboard fitting for everyone, so this is highly configurable. You can change these things with some YAML configuration:
-
the navigation menu (=the area-cards)
-
the part above the navigation menu (=topCards)
-
number of tabs and their names, icons, etc.
-
number of rows with grids and their headings
-
what is displayed in these rows, e.g., which entities (lights, switches, and all other possible ones)
and
- how these entities are displayed, e.g., which card should be shown (default uses mostly tile, but you can use absolutely every card there is, including custom ones and HACS ones)
Just take a look at the Github Repo for more information!
Also, look at the documentation, especially the installation instructions! This Dashboard has some dependencies from other HACS Cards and Functions!
The code is a hot mess right now, but I am going to refactor everything once I am happy with all the features!
I hope this helps some people, and if there are issues, just let me know!
Thanks to this awesome community! Some more influential people to this are also mentioned in a credit section! Special thanks to all of them!