[solved] Issue when accessing HA instance over WireGuard VPN


I have a HA instance in a VM running on top of QNAP NAS.
I also have a VPN (WireGuard) running on raspberry pi which I use to access my local network from internet - this works perfectly fine - with a recent exception of HA.

When accessing the HA (via android app or android chrome) over VPN from internet the main dashboard is blank (all other dashboards i.e. Energy are visible, options are accessible).

This only happens when accessing over a VPN from internet, no issues with a local network access.

Weirdly, sometimes the dashboard is visible, but after closing the app and re-opening it goes away (this is very rare). It will also come up after fresh reboot of HA (also, only once - closing the app and it’s no longer there).

Below is a log that is generated when I click on one of the dashboards tabs:

Logger: frontend.js.latest.202211080
Source: components/system_log/__init__.py:256
First occurred: 09:43:00 (1 occurrences)
Last logged: 09:43:00

http://<local_IP>/frontend_latest/0f300520.js:369:5858 Uncaught TypeError: Cannot read properties of undefined (reading '0')

Screenshot on how it looks:

Did anyone encountered this? I tried switching off integrations one by one (I went with the most suspicious ones, i.e. custom ones) but no luck so far.

edit: After companion app update - all is working fine.

This has been happening for past month or so. It happens from time to time on samsung internet and chrome but not on HA companion app if use wireguard. On Openvpn it can happen on all three. Sometimes all works well. No difference if use homeassistant.local or IP address.

Now it happened on Chrome, in local network, no VPNs.

I leave my vpn on when in local network and no problem so far.

After companion app update - all is working fine.