move to overflow menu

home-assistant · Sep 27, 2023 · 6def6fd · 6def6fd
1 parent d2076fb
commit 6def6fd
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 2 deletions.
diff --git a/src/panels/developer-tools/ha-panel-developer-tools.ts b/src/panels/developer-tools/ha-panel-developer-tools.ts
@@ -1,9 +1,14 @@
+import { mdiDotsVertical } from "@mdi/js";
 import "@polymer/paper-tabs/paper-tab";
 import "@polymer/paper-tabs/paper-tabs";
 import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
+import type { ActionDetail } from "@material/mwc-list";
 import { navigate } from "../../common/navigate";
 import "../../components/ha-menu-button";
+import "../../components/ha-button-menu";
+import "../../components/ha-icon-button";
+import "../../components/ha-list-item";
 import { haStyle } from "../../resources/styles";
 import { HomeAssistant, Route } from "../../types";
 import "./developer-tools-router";
@@ -34,6 +39,16 @@ class PanelDeveloperTools extends LitElement {
           <div class="main-title">
             ${this.hass.localize("panel.developer_tools")}
           </div>
+          <ha-button-menu slot="actionItems" @action=${this._handleMenuAction}>
+            <ha-icon-button
+              slot="trigger"
+              .label=${this.hass.localize("ui.common.menu")}
+              .path=${mdiDotsVertical}
+            ></ha-icon-button>
+            <ha-list-item>
+              ${this.hass.localize("ui.panel.developer-tools.tabs.debug.title")}
+            </ha-list-item>
+          </ha-button-menu>
         </div>
         <paper-tabs
           scrollable
@@ -66,7 +81,6 @@ class PanelDeveloperTools extends LitElement {
             )}
           </paper-tab>
           <paper-tab page-name="assist">Assist</paper-tab>
-          <paper-tab page-name="debug">Debug</paper-tab>
         </paper-tabs>
       </div>
       <developer-tools-router
@@ -86,6 +100,14 @@ class PanelDeveloperTools extends LitElement {
     }
   }
 
+  private async _handleMenuAction(ev: CustomEvent<ActionDetail>) {
+    switch (ev.detail.index) {
+      case 0:
+        navigate(`/developer-tools/debug`);
+        break;
+    }
+  }
+
   private get _page() {
     return this.route.path.substr(1);
   }

diff --git a/src/translations/en.json b/src/translations/en.json
@@ -5529,7 +5529,7 @@
             "language": "[%key:ui::components::language-picker::language%]"
           },
           "debug": {
-            "title": "Debug Tools",
+            "title": "Debug tools",
             "debug_connection": {
               "title": "Debug connection",
               "description": "Observe requests to the server and responses from the server in browser console."