[Home Assistant] Lovelace Custom QuickBar Commands

custom-quickbar.js

customElements.whenDefined("ha-quick-bar").then(() => {
  const fireEvent = (node, type, detail, options) => {
    options = options || {};
    detail = detail === null || detail === undefined ? {} : detail;
    const event = new Event(type, {
        bubbles: options.bubbles === undefined ? true : options.bubbles,
        cancelable: Boolean(options.cancelable),
        composed: options.composed === undefined ? true : options.composed,
    });
    event.detail = detail;
    node.dispatchEvent(event);
    return event;
  };

  const navigate = (path, replace = false) => {
    if (replace) {
      history.replaceState(null, "", path);
    } else {
      history.pushState(null, "", path);
    }

    fireEvent(window, "location-changed", {
      replace,
    });
  };

  const haQuickBar = customElements.get("ha-quick-bar");

  haQuickBar.prototype._generateServerControlCommandsDefault = haQuickBar.prototype._generateServerControlCommands;
  haQuickBar.prototype._generateServerControlCommands = function() {
    let commands = [
      {
        text: "Navigate to Overview",
        icon: "mdi:view-dashboard",
        action: () => navigate("/lovelace"),
      },
      {
        text: "Navigate to Integrations",
        icon: "mdi:puzzle",
        action: () => navigate("/config/integrations"),
      },
      {
        text: "Navigate to States",
        icon: "mdi:code-tags",
        action: () => navigate("/developer-tools/state"),
      },
      {
        text: "Navigate to Services",
        icon: "mdi:remote",
        action: () => navigate("/developer-tools/service"),
      },
      {
        text: "Navigate to Template",
        icon: "mdi:file-code",
        action: () => navigate("/developer-tools/template"),
      },
      {
        text: "Navigate to Events",
        icon: "mdi:radio-tower",
        action: () => navigate("/developer-tools/event"),
      },
      {
        text: "Navigate to Lovelace Dashboards",
        icon: "mdi:view-dashboard",
        action: () => navigate("/config/lovelace/dashboards"),
      },
      {
        text: "Navigate to Lovelace Resources",
        icon: "mdi:cog-box",
        action: () => navigate("/config/lovelace/resources"),
      },
    ];

    return [...commands, ...this._generateServerControlCommandsDefault()];
  };
});

Love this gist by the way! It stopped working for me a few months ago -- have you had any recent issues with it @dale3h ?