From 0ce98a86e6423d90500508bd3ff741a614c81148 Mon Sep 17 00:00:00 2001 From: Simon Lamon <32477463+silamon@users.noreply.github.com> Date: Wed, 11 Dec 2024 08:48:10 +0100 Subject: [PATCH] Combine Edit in yaml and Edit in visual editor (1/2) (#23142) * yaml / visual part 1 * clean up * clean up --- .../action/ha-automation-action-row.ts | 84 +++++++---------- .../condition/ha-automation-condition-row.ts | 89 ++++++++----------- .../config/automation/ha-automation-editor.ts | 36 +++----- .../trigger/ha-automation-trigger-row.ts | 89 ++++++++----------- src/panels/config/scene/ha-scene-editor.ts | 54 +++-------- src/panels/config/script/ha-script-editor.ts | 36 +++----- .../config/script/ha-script-field-row.ts | 45 +++------- 7 files changed, 149 insertions(+), 284 deletions(-) diff --git a/src/panels/config/automation/action/ha-automation-action-row.ts b/src/panels/config/automation/action/ha-automation-action-row.ts index dd678e3b8474..bd4fa868a18a 100644 --- a/src/panels/config/automation/action/ha-automation-action-row.ts +++ b/src/panels/config/automation/action/ha-automation-action-row.ts @@ -1,11 +1,9 @@ import { consume } from "@lit-labs/context"; import type { ActionDetail } from "@material/mwc-list/mwc-list-foundation"; -import "@material/mwc-list/mwc-list-item"; import { mdiAlertCircleCheck, mdiArrowDown, mdiArrowUp, - mdiCheck, mdiContentCopy, mdiContentCut, mdiContentDuplicate, @@ -13,6 +11,7 @@ import { mdiDotsVertical, mdiPlay, mdiPlayCircleOutline, + mdiPlaylistEdit, mdiRenameBox, mdiStopCircleOutline, } from "@mdi/js"; @@ -253,23 +252,23 @@ export default class HaAutomationActionRow extends LitElement { .label=${this.hass.localize("ui.common.menu")} .path=${mdiDotsVertical} > - + ${this.hass.localize( "ui.panel.config.automation.editor.actions.run" )} - + - + ${this.hass.localize( "ui.panel.config.automation.editor.actions.rename" )} - +
  • - + ${this.hass.localize( "ui.panel.config.automation.editor.actions.duplicate" )} @@ -277,31 +276,31 @@ export default class HaAutomationActionRow extends LitElement { slot="graphic" .path=${mdiContentDuplicate} > - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.copy" )} - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.cut" )} - + - ${this.hass.localize("ui.panel.config.automation.editor.move_up")} + > - @@ -309,37 +308,21 @@ export default class HaAutomationActionRow extends LitElement { "ui.panel.config.automation.editor.move_down" )} + > -
  • - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${!yamlMode - ? html`` - : ``} - - - + ${this.hass.localize( - "ui.panel.config.automation.editor.edit_yaml" + `ui.panel.config.automation.editor.edit_${!yamlMode ? "yaml" : "ui"}` )} - ${yamlMode - ? html`` - : ``} - + +
  • - + ${this.action.enabled === false ? this.hass.localize( "ui.panel.config.automation.editor.actions.enable" @@ -353,8 +336,8 @@ export default class HaAutomationActionRow extends LitElement { ? mdiPlayCircleOutline : mdiStopCircleOutline} > - - + - +
    - + ${this.hass.localize( "ui.panel.config.automation.editor.conditions.test" )} - - + + ${this.hass.localize( "ui.panel.config.automation.editor.conditions.rename" )} - +
  • - + ${this.hass.localize( "ui.panel.config.automation.editor.actions.duplicate" )} @@ -178,31 +178,31 @@ export default class HaAutomationConditionRow extends LitElement { slot="graphic" .path=${mdiContentDuplicate} > - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.copy" )} - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.cut" )} - + - ${this.hass.localize("ui.panel.config.automation.editor.move_up")} + > - @@ -210,37 +210,21 @@ export default class HaAutomationConditionRow extends LitElement { "ui.panel.config.automation.editor.move_down" )} + > -
  • - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${!this._yamlMode - ? html`` - : ``} - - - + ${this.hass.localize( - "ui.panel.config.automation.editor.edit_yaml" + `ui.panel.config.automation.editor.edit_${!this._yamlMode ? "yaml" : "ui"}` )} - ${this._yamlMode - ? html`` - : ``} - + +
  • - + ${this.condition.enabled === false ? this.hass.localize( "ui.panel.config.automation.editor.actions.enable" @@ -254,8 +238,8 @@ export default class HaAutomationConditionRow extends LitElement { ? mdiPlayCircleOutline : mdiStopCircleOutline} > - - + - +
    - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${this._mode === "gui" - ? html`` - : ``} - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_yaml")} - ${this._mode === "yaml" - ? html`` - : ``} + + ${this.hass.localize( + `ui.panel.config.automation.editor.edit_${this._mode === "gui" ? "yaml" : "ui"}` + )} +
  • @@ -903,9 +892,6 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) { ha-fab.dirty { bottom: 0; } - .selected_menu_item { - color: var(--primary-color); - } li[role="separator"] { border-bottom-color: var(--divider-color); } diff --git a/src/panels/config/automation/trigger/ha-automation-trigger-row.ts b/src/panels/config/automation/trigger/ha-automation-trigger-row.ts index 532e6c91999e..b45d776ba027 100644 --- a/src/panels/config/automation/trigger/ha-automation-trigger-row.ts +++ b/src/panels/config/automation/trigger/ha-automation-trigger-row.ts @@ -1,10 +1,8 @@ import { consume } from "@lit-labs/context"; import type { ActionDetail } from "@material/mwc-list/mwc-list-foundation"; -import "@material/mwc-list/mwc-list-item"; import { mdiArrowDown, mdiArrowUp, - mdiCheck, mdiContentCopy, mdiContentCut, mdiContentDuplicate, @@ -12,6 +10,7 @@ import { mdiDotsVertical, mdiIdentifier, mdiPlayCircleOutline, + mdiPlaylistEdit, mdiRenameBox, mdiStopCircleOutline, } from "@mdi/js"; @@ -34,6 +33,7 @@ import "../../../../components/ha-card"; import "../../../../components/ha-expansion-panel"; import "../../../../components/ha-icon-button"; import "../../../../components/ha-textfield"; +import "../../../../components/ha-list-item"; import type { HaYamlEditor } from "../../../../components/ha-yaml-editor"; import type { AutomationClipboard, Trigger } from "../../../../data/automation"; import { @@ -182,7 +182,7 @@ export default class HaAutomationTriggerRow extends LitElement { .path=${mdiDotsVertical} > - @@ -190,9 +190,9 @@ export default class HaAutomationTriggerRow extends LitElement { "ui.panel.config.automation.editor.triggers.rename" )} - +     - @@ -200,11 +200,11 @@ export default class HaAutomationTriggerRow extends LitElement { "ui.panel.config.automation.editor.triggers.edit_id" )} - +
  • - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.duplicate" )} @@ -212,31 +212,31 @@ export default class HaAutomationTriggerRow extends LitElement { slot="graphic" .path=${mdiContentDuplicate} > - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.copy" )} - + - + ${this.hass.localize( "ui.panel.config.automation.editor.triggers.cut" )} - + - ${this.hass.localize("ui.panel.config.automation.editor.move_up")} + > - @@ -244,37 +244,21 @@ export default class HaAutomationTriggerRow extends LitElement { "ui.panel.config.automation.editor.move_down" )} + > -
  • - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${!yamlMode - ? html`` - : ``} - - - + ${this.hass.localize( - "ui.panel.config.automation.editor.edit_yaml" + `ui.panel.config.automation.editor.edit_${!yamlMode ? "yaml" : "ui"}` )} - ${yamlMode - ? html`` - : ``} - + +
  • - @@ -292,8 +276,8 @@ export default class HaAutomationTriggerRow extends LitElement { ? mdiPlayCircleOutline : mdiStopCircleOutline} > - - + - +
    ${this.hass.localize("ui.panel.config.scene.picker.apply")} - + ${this.hass.localize("ui.panel.config.scene.picker.show_info")} @@ -281,45 +276,21 @@ export class HaSceneEditor extends SubscribeMixin( ${this.hass.localize( "ui.panel.config.automation.picker.show_settings" )} - + ${this.hass.localize( `ui.panel.config.scene.picker.${this._getCategory(this._entityRegistryEntries, this._scene?.entity_id) ? "edit_category" : "assign_category"}` )} - + -
  • - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${this._mode !== "yaml" - ? html`` - : nothing} - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_yaml")} - ${this._mode === "yaml" - ? html`` - : nothing} + ${this.hass.localize( + `ui.panel.config.automation.editor.edit_${this._mode !== "yaml" ? "yaml" : "ui"}` + )} +
  • @@ -717,17 +688,14 @@ export class HaSceneEditor extends SubscribeMixin( if (this._mode === "yaml") { this._initEntities(this._config!); this._exitYamlMode(); - } - break; - case 5: - if (this._mode !== "yaml") { + } else { this._enterYamlMode(); } break; - case 6: + case 5: this._duplicate(); break; - case 7: + case 6: this._deleteTapped(); break; } diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts index a9606e00bac4..033760471309 100644 --- a/src/panels/config/script/ha-script-editor.ts +++ b/src/panels/config/script/ha-script-editor.ts @@ -1,6 +1,5 @@ import "@material/mwc-button"; import { - mdiCheck, mdiContentDuplicate, mdiContentSave, mdiDebugStepOver, @@ -10,6 +9,7 @@ import { mdiFormTextbox, mdiInformationOutline, mdiPlay, + mdiPlaylistEdit, mdiRenameBox, mdiRobotConfused, mdiTransitConnection, @@ -245,27 +245,16 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) { ` : nothing} -
  • - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${this._mode === "gui" - ? html` ` - : ``} - - - ${this.hass.localize("ui.panel.config.automation.editor.edit_yaml")} - ${this._mode === "yaml" - ? html`` - : ``} + + ${this.hass.localize( + `ui.panel.config.automation.editor.edit_${this._mode === "gui" ? "yaml" : "ui"}` + )} +
  • @@ -874,9 +863,6 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) { ha-fab.dirty { bottom: 0; } - .selected_menu_item { - color: var(--primary-color); - } li[role="separator"] { border-bottom-color: var(--divider-color); } diff --git a/src/panels/config/script/ha-script-field-row.ts b/src/panels/config/script/ha-script-field-row.ts index a36bab0faa61..2542394ce953 100644 --- a/src/panels/config/script/ha-script-field-row.ts +++ b/src/panels/config/script/ha-script-field-row.ts @@ -1,6 +1,5 @@ import type { ActionDetail } from "@material/mwc-list/mwc-list-foundation"; -import "@material/mwc-list/mwc-list-item"; -import { mdiCheck, mdiDelete, mdiDotsVertical } from "@mdi/js"; +import { mdiDelete, mdiDotsVertical, mdiPlaylistEdit } from "@mdi/js"; import type { CSSResultGroup } from "lit"; import { LitElement, css, html, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; @@ -13,6 +12,7 @@ import "../../../components/ha-button-menu"; import "../../../components/ha-card"; import "../../../components/ha-form/ha-form"; import "../../../components/ha-expansion-panel"; +import "../../../components/ha-list-item"; import type { SchemaUnion } from "../../../components/ha-form/types"; import "../../../components/ha-icon-button"; import "../../../components/ha-yaml-editor"; @@ -98,31 +98,17 @@ export default class HaScriptFieldRow extends LitElement { .path=${mdiDotsVertical} > - - ${this.hass.localize("ui.panel.config.automation.editor.edit_ui")} - ${!this._yamlMode - ? html` ` - : ``} - - - + ${this.hass.localize( - "ui.panel.config.automation.editor.edit_yaml" + `ui.panel.config.automation.editor.edit_${!this._yamlMode ? "yaml" : "ui"}` )} - ${this._yamlMode - ? html`` - : ``} - - - +     + + - +
    ) { switch (ev.detail.index) { case 0: - this._yamlMode = false; + this._yamlMode = !this._yamlMode; break; case 1: - this._yamlMode = true; - break; - case 2: this._onDelete(); break; } @@ -348,7 +331,7 @@ export default class HaScriptFieldRow extends LitElement { border-top-left-radius: var(--ha-card-border-radius); } - mwc-list-item[disabled] { + ha-list-item[disabled] { --mdc-theme-text-primary-on-background: var(--disabled-text-color); } .warning ul {