Add button to download logs from zwave_js logs page (#9395)

src/panels/config/integrations/integration-panels/zwave_js/zwave_js-logs.ts

@@ -1,5 +1,6 @@
 import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
 import "@polymer/paper-listbox/paper-listbox";
+import { mdiDownload } from "@mdi/js";
 import { UnsubscribeFunc } from "home-assistant-js-websocket";
 import { css, CSSResultArray, html, LitElement } from "lit";
 import { customElement, property, state, query } from "lit/decorators";
@@ -13,6 +14,7 @@ import "../../../../../layouts/hass-tabs-subpage";
 import { SubscribeMixin } from "../../../../../mixins/subscribe-mixin";
 import { haStyle } from "../../../../../resources/styles";
 import { HomeAssistant, Route } from "../../../../../types";
+import { fileDownload } from "../../../../../util/file_download";
 import { configTabs } from "./zwave_js-config-router";
 
 @customElement("zwave_js-logs")
@@ -92,6 +94,14 @@ class ZWaveJSLogs extends SubscribeMixin(LitElement) {
                   `
                 : ""}
             </div>
+            <mwc-icon-button
+              .label=${this.hass.localize(
+                "ui.panel.config.zwave_js.logs.download_logs"
+              )}
+              @click=${this._downloadLogs}
+            >
+              <ha-svg-icon .path=${mdiDownload}></ha-svg-icon>
+            </mwc-icon-button>
           </ha-card>
           <textarea readonly></textarea>
         </div>
@@ -114,6 +124,14 @@ class ZWaveJSLogs extends SubscribeMixin(LitElement) {
     );
   }
 
+  private _downloadLogs() {
+    fileDownload(
+      this,
+      `data:text/plain;charset=utf-8,${encodeURI(this._textarea!.value)}`,
+      `zwave_js.log`
+    );
+  }
+
   private _dropdownSelected(ev) {
     if (ev.target === undefined || this._logConfig === undefined) {
       return;

translations/frontend/en.json

@@ -2990,7 +2990,8 @@
                         "log_level": "Log Level",
                         "log_level_changed": "Log Level changed to: {level}",
                         "subscribed_to_logs": "Subscribed to Z-Wave JS Log Messages...",
-                        "title": "Z-Wave JS Logs"
+                        "title": "Z-Wave JS Logs",
+                        "download_logs": "Download Logs"
                     },
                     "navigation": {
                         "logs": "Logs",