How to add a "Restart Home Assistant" button to Sidebar?

How to add a “Restart Home Assistant” button to Sidebar? It seems like the best I can do is open a URL, not call a service.

2 Likes

why do you want it there

You should be doing a “Check Config” first before a restart.

With this code you can add “Server Controls” panel to your sidebar. It will be two clicks though, not just one like you want.

4 Likes

Thank you. This is even better than what I wanted since I can also validate my configuration file right before doing that.

EDIT: I just added this. What a great hack. Very useful!

If you are running a HA OS install, a config check happens before a Home Assistant restart. (But not a host reboot).
If an error is found a persistent notification is made and it will not actually restart.

Many thanks.

However, in current Home Assistant, this does not work any longer and I got a blank page when clicking on the “Server Controls” item in the sidebar.
I have fixed it accordingly, see here, also with an example of adding a second menu item: Github Gist: Acqua-H/panel-redirect

I figured out how to add a sidebar menu item to restart Home Assistant with one click. I wrote some custom JS that checks for ?shouldRestart=1 in the URL. If this is found, then it calls the homeassistant.restart service via the websocket connection (after clearing the query param so it doesn’t keep restarting in a loop.) If the JS doesn’t work for any reason, then you still end up on the developer-tools/yaml page where you can click the Restart button manually.

  • config/configuration.yaml:
frontend:
  extra_module_url:
    - /local/custom.js

panel_custom:
  - name: ha_restart
    sidebar_title: Restart
    sidebar_icon: mdi:restart
    js_url: /api/hassio/app/entrypoint.js
    url_path: 'developer-tools/yaml?shouldRestart=1'
    embed_iframe: true
    require_admin: true
    config:
      ingress: core_configurator

  • config/www/custom.js:
// We need a 'locationchange' event
(function () {
  const pushState = history.pushState;
  history.pushState = function () {
    pushState.apply(history, arguments);
    window.dispatchEvent(new Event("pushstate"));
    window.dispatchEvent(new Event("locationchange"));
  };
})();

function checkShouldRestart() {
  const urlSearchParams = new URLSearchParams(location.search);
  if (urlSearchParams.get("shouldRestart") !== "1") {
    return;
  }
  console.warn(
    "Found ?shouldRestart=1 in URL, restarting Home Assistant Core..."
  );
  // Clear shouldRestart parameter from URL
  const newUrl = new URL(document.location.href);
  newUrl.search = "";
  history.pushState({}, "", newUrl);

  hassConnection.then(({ conn }) => {
    console.warn("Sending restart command...");
    conn.socket.send(
      JSON.stringify({
        type: "execute_script",
        sequence: [
          {
            service: "homeassistant.restart",
            data: {},
          },
        ],
        id: ++conn.commandId,
      })
    );
  });
}

window.addEventListener("locationchange", checkShouldRestart);
checkShouldRestart();

in case anyone finds this in 2023. I just found a useful chrome addon that puts a check config and restart button into the extensions bar in chrome. Home Assistant Quick Restart - Chrome Web Store
might be useful to someone else

2 Likes

Best Thing since invention of toilet paper!! Thanks for sharing!

1 Like

glad it helped someone !