Lovelace config?

[qui3xote]

I’m poking around at my next round of work in HA and trying to figure out the right toolset to work with before getting started. One aspect I’m looking for is more programmatic control of my dashboards. With pyscript it seems like I can access the file system, so I can always parse the json and just write it back, but I’m wondering if there’s a more elegant way so I can offload more of the work to hass. Any ideas?

[dlashua]

In my case, I don't need to read the Lovelace YAML, I just output it based on logic in pyscript and my pyscript config. However, if I had to read it, the YAML tools available in python are excellent and easy to use, so, even if there was a way to offload it to HASS, there's no real advantage to doing so that I can see.

[qui3xote]

Yeah, I can see that the yaml is easy enough - I was thinking that letting HASS handle the file i/o was generally a good thing and that an API would help future-proof against any changes to the yaml config. Plus, I'm lazy :)

I did find a reference to an API after posting my comment: https://community.home-assistant.io/t/lovelace-api-endpoint/109228 If I find some time to play with it I'll post back here.

[qui3xote]

Are you running a native python app to write out the lovelace definitions? Or is there a hook somewhere to access dashboards?

[dlashua]

I'm just using pyscript and standard modules.

My code is too complicated and specific to my use case to post here, but the meat of it look like this:

	dashboard_yaml = file_helpers.yaml_from_obj(dashboard)
	file_helpers.write_file(config['dashboard'], dashboard_yaml)

config['dashboard'] is just a path to the file to write. and dashboard is just a native dict containing all the elements I want to see in YAML.

It's also using my file_helpers module. but those pieces are pretty simple:

import yaml

@pyscript_compile
def blocking_write_file(filename, data):
    f = open(filename, "w")
    f.write(data)
    f.close()

def write_file(filename, data):
    task.executor(blocking_write_file, filename, data)

@pyscript_compile
def blocking_yaml_from_obj(obj):
    return yaml.dump(obj)

def yaml_from_obj(obj):
    return task.executor(blocking_yaml_from_obj, obj)

[qui3xote]

Thanks! I thought standard file operations weren’t available inside pyscript - is that just outdated docs?

[dlashua]

They are available and always have been. They just have be used correctly (wrapped in an executor so that they don't block the event loop). That's why I have blocking_write_file wrapped in task.executor().

[qui3xote]

Just writing this in here in case it helps someone else. If you want to programmatically work with dashbaords WITHOUT switching lovelace to yaml mode (which will deactivate all gui controls for dashboard) you can call HA's websocket api like so. There are update commands similar that you can sort out (awkwardly) by reading through the lovelace api code

import asyncio
import websockets
import json

ws_server_url = 'ws://127.0.0.1:8123/api/websocket'
token = 'long lived access token'

async def fetch_dashboard():
    async with websockets.connect(ws_server_url) as websocket:
        log.info(websocket.recv())
        await websocket.send(json.dumps({"type": "auth", "access_token": token}))
        log.info(websocket.recv())
        await websocket.send(json.dumps({"type": "lovelace/dashboards/list", 'id': 1})) #list dashboards
        log.info(websocket.recv())
        await websocket.send(json.dumps({"type": "lovelace/config", 
                                         'url_path': 'dashboardurl', 'id':2})) #fetch a specific dashboards config. 
        return websocket.recv()
        
cfg = json.loads(fetch_dashboard())['result']

[qui3xote]

Looks like under the hood it's the exact same config (or extremely similar) just in json rather than yaml, and there are hooks to add/update/delete, so I don't think it will be too bad (but, of course, there's no documentation so it will involve trial and error). Haven't had a chance to test it yet but I plan to sometime this weekend. There are also hooks to listen for changes to the dashboard, which is cool - I've been thinking about writing some 'automagic' helpers to auto-generate input bool/selects/etc for automations and maintain a 'configuration' dashboard. From the look of it, I think with some work you could actually define and display automations directly in lovelace, which would be neat.

[qui3xote]

OK, so as expected the backend lovelace config is just a json-ified yaml config, so this whole thing gets simple real fast. The websocket is a little inconsistent about when it wants to use a url-path vs a dashboard-id as a reference, which is annoying, and there's no real way to know what ancillary fields it supports without just trial and error. But the code here will fetch dashboards and configs, add and delete, etc. There is also an 'lovelace/update' command, but it's totally undocumented which things are mutable so I'm going to ignore it for now. Also, it looks like all the same basic things are supported for resources, so you can load custom cards, etc. Eventually I'll get around to writing a proper class for this at which point I'll try to sort all that out.

import json
import yaml

import websockets

prefix = 'ws://'
ha_location = '127.0.0.1' #should always work in jupyter/pyscript, adjust if connecting remotely
port = '8123'
api_path = '/api/websocket'

ws_server_url = prefix + ha_location + ":" + port + api_path
token = 'long lived token'

async def websocket_command(url, token, command: dict):
    # ids are returned in the receive phase so you tie back to originating command. 
    # The API has feelings about these: they must increment, at least per session
    command['id'] = 1  

    async with websockets.connect(url) as websocket:
        log.info(websocket.recv()) #first receive will give you HA version, if it matters
        await websocket.send(json.dumps({"type": "auth", "access_token": token})) #send auth
        log.info(websocket.recv()) #once ok is received we go into command phase
        await websocket.send(json.dumps(command))
        result = websocket.recv()
        log.info(result)
        return json.loads(result)

# I pulled this straight from an existing dashboard, so if you don't have the same components installed
# it obviously won't work for you
yaml_config= """
views:
- cards:
  - cards:
    - entity: alarm_control_panel.fakename
      name: Security
      states:
      - arm_home
      - arm_away
      type: alarm-panel
    - entities:
      - entity: person.me
      - entity: person.mywife
      show_header_toggle: false
      state_color: true
      type: entities
    - cards:
      - icon: mdi:netflix
        name: Netlix & Chill
        tap_action:
          action: call-service
          service: automation.trigger
          service_data: {}
          target:
            entity_id: automation.new_automation
        type: button
      - icon: mdi:theme-light-dark
        name: Evening
        tap_action:
          action: call-service
          service: automation.trigger
          service_data: {}
          target:
            entity_id: automation.set_evening
        type: button
      - icon: mdi:moon-waning-crescent
        name: Night
        tap_action:
          action: call-service
          service: automation.trigger
          service_data: {}
          target:
            entity_id: automation.set_night
        type: button
      - entity: cover.left_door
        name: Garage
        show_name: true
        tap_action:
          action: toggle
        type: button
      columns: 4
      type: grid
    - entities:
      - entity: light.main_room_lights
      - entity: light.den_lights
      - entity: light.upstairs_lights
      - entity: light.master_bedroom_lights
      - entity: light.living_room_lights
      - entity: light.first_floor_lights
      - entity: light.entry_lights
      show_header_toggle: true
      title: Areas
      type: entities
    type: vertical-stack
  title: Home
- badges: []
  cards:
  - card:
      type: entities
    filter:
      exclude: []
      include:
      - name: '*battery*'
      - name: '*Battery*'
    type: custom:auto-entities
  - card:
      type: entities
    filter:
      exclude: []
      include:
      - domain: automation
    type: custom:auto-entities
  path: config
  theme: ios-light-mode-dark-greenios-light-mode-dark-green
  title: Config
"""


#convert yaml to python object so it's ready to json-ify
config = yaml.load(yaml_config, Loader=yaml.Loader)

dashboardUrl = "lovelace-testboard"
dashboardTitle = "Tesboard"

#example command payloads
listDashboard = {"type": "lovelace/dashboards/list"}
createDashboard =  {"type": "lovelace/dashboards/create", "title": dashboardTitle, "url_path": dashboardUrl}
setDashboardConfig = {"type": "lovelace/config/save", "url_path": dashboardUrl, "config": config}
getDashboardConfig = {"type": "lovelace/config", "url_path": dashboardUrl}

#see what dashboards exist
websocket_command(ws_server_url,token,listDashboard)

#create a new dashboard
result = websocket_command(ws_server_url,token,createDashboard)
dashboard_id = result['result']['id'] #need this to be able to delete later

#set the dashboard config
result = websocket_command(ws_server_url,token,setDashboardConfig)

#now delete
deleteDashboard = {"type": "lovelace/dashboards/delete", "dashboard_id": dashboard_id}
websocket_command(ws_server_url,token,deleteDashboard)

[dlashua]

Thanks for doing all the dirty work!

[qui3xote]

Do you know of a place to grab the schemas for different cards? Writing handlers for cards is pretty simple, but going through each one and reverse engineering what is (and isn't) allowed is a pain and pretty fragile if anything changes in the future.

[dlashua]

The source for, example, button-card is (here)[https://github.com/home-assistant/frontend/blob/dev/src/panels/lovelace/cards/hui-button-card.ts]. But, there isn't any specific schema defined (unlike how the Home Assistant backend uses voluptuous for schema). Even if there was, it'd be in TypeScript, so you'd have to parse and convert it.

Also, since custom cards are a thing, you may never be able to fully validate the schema of a card.

I think perhaps the cards that have specific UI (instead of just the YAML editor) have schema built in to the UI editor (also likely in TypeScript) instead of the card itself. With enough searching you could find those schema, convert them and use them as a guide, but if the card config doesn't match this schema, it should still be allowed since it could simply be a configuration not supported by the UI Editor but still allowed for the card.