WTH: Why most settings are browser instance dependant

Home Assistant 2023.10.5
Supervisor 2023.10.1
Operating System 11.1
Frontend 20231005.0 - latest

I followed your instructions. But when I refresh the page the Console says, “Settings are up to date” even though I haven’t added them to custom.js. And everything that I configured has been reset.

Not working anymore?

It doesn’t work quite the way it is described here, but I defiantly managed to squeeze some usefulness out of it.

Here is my code, it may help someone figure out the naming convention of the sidebar links:

    const settings = {
      defaultPanel: '"lovelace"',
      dockedSidebar: '"docked"',
      enableShortcuts: "true",
	  hiddenTabs: "{}",
      selectedLanguage: "null",
      selectedTheme: '{"dark":true}',
      sidebarHiddenPanels: '["energy","map","overview","core_configurator"]',
      sidebarPanelOrder:
        '["dashboard-time","dashboard-basement","1st-floor","2nd-floor","dashboard-spacer","config/devices","config/integrations","config/automation","dashboard-spacer-2","config/logs","logbook","hassio/dashboard","hacs","developer-tools/yaml","a0d7b954_vscode","7094bb28_docker_wyze_bridge","cebe7a76_hassio_google_drive_backup"]',
      suspendWhenHidden: "true",
      vibrate: "true",
    };

Here’s what I found works.

I added that code to www/config.js as described above. And then call it as an extra_module_url: in configuration.yaml.

Make some tweaks to config.js as desired. See the tweaks by emptying the browser cache (hard refresh).

But some settings can’t be set this way and will be reset every time you hard refresh. For example, Primary and Accent colors keep resetting.

So once I was happy with the sidebar order I disabled the script by commenting out the line in configuration.yaml and then reboot HA.

Now I can set the colors and they won’t get reset by a hard refresh.

So then I go to another browser or device and log in to my HA instance. The sidebar is a mess because, of course, the custom profile settings do not roam between devices.

So now I uncomment the line in configuration.yaml (which means custom.js is being called again).

I reboot HA and refresh device #2 and bingo my custom sidebar order is now carried over to the 2nd device.

Once again I comment out that line in conguration.yaml and reboot HA.

I can now set my custom colors on device #2 and I’m done.

Clear as mud?

This sounds a bit convoluted but, speaking for myself, it is actually much easier than to constantly reorder all of my sidebar items each time I use a new browser, device, URL, clear my cookies, etc.

Thanks for sharing, @ndbroadbent.

I am surprised that this thread isn’t garnering more attention. The need to configure the sidebar for each session is a major HA pet peeve of mine.

3 Likes

‘cause it’s a flogging a dead horse.

Is it dead? Or just sleeping?

Agreed, this would most logical and very beneficial function.

Anyone is able to add this functionality, just takes a volunteer…

I must be completely dense… I’ve tried for an hour now to find out how to find these updated settings in the developer tools console and I can’t figure out how to find them. Any way you can maybe make a short video? I’m assuming this is in chrome? Thank you!

Those settings only appear if you use the attached JS that he posted. They will only appear after you add the resources and restart.

Hello, it would be great to have progress with this issue. I think general rights settings and settings for users is very important for the real usage of the system.

This would be very helpful.

How do we raise the priority on this feature that allows each user of HA to save their UI settings in HA/DB so that when the user logs into HA from any browser/device that they get the latest saved settings? I’m a newbie to how HA is enhanced and would appreciate insight into how to gain focus to solve?