Edit categories from their data table group headers

src/panels/config/automation/ha-automation-picker.ts

@@ -122,6 +122,7 @@ import { documentationUrl } from "../../../util/documentation-url";
 import { turnOnOffEntity } from "../../lovelace/common/entity/turn-on-off-entity";
 import { showAreaRegistryDetailDialog } from "../areas/show-dialog-area-registry-detail";
 import { showAssignCategoryDialog } from "../category/show-dialog-assign-category";
+import { renderCategoryGroupActions } from "../category/render-category-group-actions";
 import { showCategoryRegistryDetailDialog } from "../category/show-dialog-category-registry-detail";
 import {
   getAreaTableColumn,
@@ -564,6 +565,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
           .path=${mdiHelpCircleOutline}
           @click=${this._showHelp}
         ></ha-icon-button>
+        ${renderCategoryGroupActions(this.hass, "automation", this._categories)}
         <ha-filter-floor-areas
           .type=${"automation"}
           .value=${this._filters["ha-filter-floor-areas"]?.value}

src/panels/config/category/render-category-group-actions.ts

@@ -0,0 +1,45 @@
+import { mdiPencil } from "@mdi/js";
+import { html } from "lit";
+import type { HASSDomCurrentTargetEvent } from "../../../common/dom/fire_event";
+import { groupActionsSlot } from "../../../components/data-table/ha-data-table";
+import "../../../components/ha-icon-button";
+import type { CategoryRegistryEntry } from "../../../data/category_registry";
+import { updateCategoryRegistryEntry } from "../../../data/category_registry";
+import type { HomeAssistant } from "../../../types";
+import { showCategoryRegistryDetailDialog } from "./show-dialog-category-registry-detail";
+
+type CategoryEditButton = HTMLElement & {
+  category: CategoryRegistryEntry;
+  scope: string;
+  hass: HomeAssistant;
+};
+
+const editCategory = (ev: HASSDomCurrentTargetEvent<CategoryEditButton>) => {
+  const { category, scope, hass } = ev.currentTarget;
+  showCategoryRegistryDetailDialog(ev.currentTarget, {
+    scope,
+    entry: category,
+    updateEntry: (updates) =>
+      updateCategoryRegistryEntry(hass, scope, category.category_id, updates),
+  });
+};
+
+// Edit buttons for the category group headers of a table grouped by category,
+// which names its groups after the categories
+export const renderCategoryGroupActions = (
+  hass: HomeAssistant,
+  scope: string,
+  categories: CategoryRegistryEntry[] | undefined
+) =>
+  categories?.map(
+    (category) =>
+      html`<ha-icon-button
+        slot=${groupActionsSlot(category.name)}
+        .label=${hass.localize("ui.panel.config.category.editor.edit")}
+        .path=${mdiPencil}
+        .category=${category}
+        .scope=${scope}
+        .hass=${hass}
+        @click=${editCategory}
+      ></ha-icon-button>`
+  );

src/panels/config/helpers/ha-config-helpers.ts

@@ -121,6 +121,7 @@ import { haStyle } from "../../../resources/styles";
 import type { HomeAssistant, Route } from "../../../types";
 import { fileDownload } from "../../../util/file_download";
 import { showAssignCategoryDialog } from "../category/show-dialog-assign-category";
+import { renderCategoryGroupActions } from "../category/render-category-group-actions";
 import { showCategoryRegistryDetailDialog } from "../category/show-dialog-category-registry-detail";
 import {
   getAreaTableColumn,
@@ -869,6 +870,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
           .hass=${this.hass}
           slot="toolbar-icon"
         ></ha-integration-overflow-menu>
+        ${renderCategoryGroupActions(this.hass, "helpers", this._categories)}
         <ha-button slot="fab" size="l" @click=${this._createHelper}>
           <ha-svg-icon slot="start" .path=${mdiPlus}></ha-svg-icon>
           ${this.hass.localize("ui.panel.config.helpers.picker.create_helper")}

src/panels/config/scene/ha-scene-dashboard.ts

@@ -109,6 +109,7 @@ import { documentationUrl } from "../../../util/documentation-url";
 import { showToast } from "../../../util/toast";
 import { showAreaRegistryDetailDialog } from "../areas/show-dialog-area-registry-detail";
 import { showAssignCategoryDialog } from "../category/show-dialog-assign-category";
+import { renderCategoryGroupActions } from "../category/render-category-group-actions";
 import { showCategoryRegistryDetailDialog } from "../category/show-dialog-category-registry-detail";
 import {
   getAreaTableColumn,
@@ -562,6 +563,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
           .label=${this.hass.localize("ui.common.help")}
           .path=${mdiHelpCircleOutline}
         ></ha-icon-button>
+        ${renderCategoryGroupActions(this.hass, "scene", this._categories)}
 
         <ha-filter-floor-areas
           .type=${"scene"}

src/panels/config/script/ha-script-picker.ts

@@ -113,6 +113,7 @@ import { showToast } from "../../../util/toast";
 import { showAreaRegistryDetailDialog } from "../areas/show-dialog-area-registry-detail";
 import { showNewAutomationDialog } from "../automation/show-dialog-new-automation";
 import { showAssignCategoryDialog } from "../category/show-dialog-assign-category";
+import { renderCategoryGroupActions } from "../category/render-category-group-actions";
 import { showCategoryRegistryDetailDialog } from "../category/show-dialog-category-registry-detail";
 import {
   getAreaTableColumn,
@@ -496,6 +497,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
           .path=${mdiHelpCircleOutline}
           @click=${this._showHelp}
         ></ha-icon-button>
+        ${renderCategoryGroupActions(this.hass, "script", this._categories)}
         <ha-filter-floor-areas
           .type=${"script"}
           .value=${this._filters["ha-filter-floor-areas"]?.value}