From 15b85d6f19ae954b05fb4ac302ba917d052003c7 Mon Sep 17 00:00:00 2001 From: Aidan Timson Date: Tue, 27 Jan 2026 11:13:09 +0000 Subject: [PATCH] Move developer tools to settings (admin) area (#29201) --- src/components/ha-sidebar.ts | 17 +++++------------ src/data/panel.ts | 1 - src/dialogs/sidebar/dialog-edit-sidebar.ts | 2 -- src/panels/config/ha-panel-config.ts | 8 ++++++++ .../developer-tools/ha-panel-developer-tools.ts | 13 +++++++++---- src/translations/en.json | 4 ++++ 6 files changed, 26 insertions(+), 19 deletions(-) diff --git a/src/components/ha-sidebar.ts b/src/components/ha-sidebar.ts index ad0cb321fc..2906ff5dbf 100644 --- a/src/components/ha-sidebar.ts +++ b/src/components/ha-sidebar.ts @@ -30,7 +30,6 @@ import { getPanelIcon, getPanelIconPath, getPanelTitle, - SHOW_AFTER_SPACER_PANELS, } from "../data/panel"; import type { PersistentNotification } from "../data/persistent_notification"; import { subscribeNotifications } from "../data/persistent_notification"; @@ -58,7 +57,6 @@ const SORT_VALUE_URL_PATHS = { map: 2, logbook: 3, history: 4, - "developer-tools": 100, }; const panelSorter = ( @@ -135,10 +133,11 @@ export const computePanels = memoizeOne( } const beforeSpacer: PanelInfo[] = []; - const afterSpacer: PanelInfo[] = []; const allPanels = Object.values(panels).filter( - (panel) => !FIXED_PANELS.includes(panel.url_path) + (panel) => + !FIXED_PANELS.includes(panel.url_path) && + panel.url_path !== "developer-tools" ); allPanels.forEach((panel) => { @@ -153,10 +152,7 @@ export const computePanels = memoizeOne( ) { return; } - (SHOW_AFTER_SPACER_PANELS.includes(panel.url_path) - ? afterSpacer - : beforeSpacer - ).push(panel); + beforeSpacer.push(panel); }); const reverseSort = [...panelsOrder].reverse(); @@ -164,11 +160,8 @@ export const computePanels = memoizeOne( beforeSpacer.sort((a, b) => panelSorter(reverseSort, defaultPanel, a, b, locale.language) ); - afterSpacer.sort((a, b) => - panelSorter(reverseSort, defaultPanel, a, b, locale.language) - ); - return [beforeSpacer, afterSpacer]; + return [beforeSpacer, []]; } ); diff --git a/src/data/panel.ts b/src/data/panel.ts index 4f7da71f76..473eb7e4f7 100644 --- a/src/data/panel.ts +++ b/src/data/panel.ts @@ -138,4 +138,3 @@ export const getPanelIconPath = (panel: PanelInfo): string | undefined => PANEL_ICON_PATHS[panel.url_path]; export const FIXED_PANELS = ["profile", "config"]; -export const SHOW_AFTER_SPACER_PANELS = ["developer-tools"]; diff --git a/src/dialogs/sidebar/dialog-edit-sidebar.ts b/src/dialogs/sidebar/dialog-edit-sidebar.ts index 74d2390e37..70b7383ce9 100644 --- a/src/dialogs/sidebar/dialog-edit-sidebar.ts +++ b/src/dialogs/sidebar/dialog-edit-sidebar.ts @@ -29,7 +29,6 @@ import { getPanelIcon, getPanelIconPath, getPanelTitle, - SHOW_AFTER_SPACER_PANELS, } from "../../data/panel"; import type { HomeAssistant } from "../../types"; import { showConfirmationDialog } from "../generic/show-dialog-box"; @@ -144,7 +143,6 @@ class DialogEditSidebar extends LitElement { `${defaultPanel === panel.url_path ? " (default)" : ""}`, icon: getPanelIcon(panel), iconPath: getPanelIconPath(panel), - disableSorting: SHOW_AFTER_SPACER_PANELS.includes(panel.url_path), disableHiding: panel.url_path === defaultPanel, })); diff --git a/src/panels/config/ha-panel-config.ts b/src/panels/config/ha-panel-config.ts index b1a5c220e8..53ddb3eef8 100644 --- a/src/panels/config/ha-panel-config.ts +++ b/src/panels/config/ha-panel-config.ts @@ -9,6 +9,7 @@ import { mdiDatabase, mdiDevices, mdiFlask, + mdiHammer, mdiInformation, mdiInformationOutline, mdiLabel, @@ -196,6 +197,13 @@ export const configSections: Record = { iconColor: "#301ABE", core: true, }, + { + path: "/developer-tools", + translationKey: "developer_tools", + iconPath: mdiHammer, + iconColor: "#7A5AA6", + core: true, + }, { path: "/config/info", translationKey: "about", diff --git a/src/panels/developer-tools/ha-panel-developer-tools.ts b/src/panels/developer-tools/ha-panel-developer-tools.ts index 70cdd2724a..64d1c00bb7 100644 --- a/src/panels/developer-tools/ha-panel-developer-tools.ts +++ b/src/panels/developer-tools/ha-panel-developer-tools.ts @@ -2,10 +2,11 @@ import { mdiDotsVertical } from "@mdi/js"; import type { CSSResultGroup, TemplateResult } from "lit"; import { css, html, LitElement } from "lit"; import { customElement, property } from "lit/decorators"; -import { navigate } from "../../common/navigate"; +import { goBack, navigate } from "../../common/navigate"; import "../../components/ha-dropdown"; import "../../components/ha-dropdown-item"; import "../../components/ha-icon-button"; +import "../../components/ha-icon-button-arrow-prev"; import "../../components/ha-menu-button"; import "../../components/ha-tab-group"; import "../../components/ha-tab-group-tab"; @@ -31,11 +32,11 @@ class PanelDeveloperTools extends LitElement { return html`
- + @click=${this._handleBack} + >
${this.hass.localize("panel.developer_tools")}
@@ -134,6 +135,10 @@ class PanelDeveloperTools extends LitElement { return this.route.path.substr(1); } + private _handleBack() { + goBack("/config"); + } + static get styles(): CSSResultGroup { return [ haStyle, diff --git a/src/translations/en.json b/src/translations/en.json index 8189912a6e..42bd92d26b 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -2368,6 +2368,10 @@ "main": "System", "secondary": "Create backups, check logs, or reboot your system" }, + "developer_tools": { + "main": "Developer tools", + "secondary": "Advanced tools for inspecting and debugging your system" + }, "about": { "main": "About", "secondary": "Version information, credit, and more"