Use repeat for ha-form schemas

src/components/device/ha-device-automation-picker.ts

@@ -3,7 +3,6 @@ import "@material/mwc-list/mwc-list-item";
 import { css, CSSResultGroup, html, LitElement, nothing } from "lit";
 import { property, state } from "lit/decorators";
 import { fireEvent } from "../../common/dom/fire_event";
-import { stopPropagation } from "../../common/dom/stop_propagation";
 import { fullEntitiesContext } from "../../data/context";
 import {
   DeviceAutomation,
@@ -104,7 +103,6 @@ export abstract class HaDeviceAutomationPicker<
         .label=${this.label}
         .value=${value}
         @selected=${this._automationChanged}
-        @closed=${stopPropagation}
         .disabled=${this._automations.length === 0}
       >
         ${value === NO_AUTOMATION_KEY

src/components/ha-form/ha-form.ts

@@ -9,6 +9,7 @@ import {
   TemplateResult,
 } from "lit";
 import { customElement, property } from "lit/decorators";
+import { repeat } from "lit/directives/repeat";
 import { dynamicElement } from "../../common/dom/dynamic-element-directive";
 import { fireEvent } from "../../common/dom/fire_event";
 import { HomeAssistant } from "../../types";
@@ -110,6 +111,16 @@ export class HaForm extends LitElement implements HaFormElement {
     }
   }
 
+  private _schemaKeys = new WeakMap<HaFormSchema, string>();
+
+  private _getSchemaKey(schema: HaFormSchema) {
+    if (!this._schemaKeys.has(schema)) {
+      this._schemaKeys.set(schema, Math.random().toString());
+    }
+
+    return this._schemaKeys.get(schema)!;
+  }
+
   protected render(): TemplateResult {
     return html`
       <div class="root" part="root">
@@ -120,55 +131,58 @@ export class HaForm extends LitElement implements HaFormElement {
               </ha-alert>
             `
           : ""}
-        ${this.schema.map((item) => {
-          const error = getError(this.error, item);
-          const warning = getWarning(this.warning, item);
-
-          return html`
-            ${error
-              ? html`
-                  <ha-alert own-margin alert-type="error">
-                    ${this._computeError(error, item)}
-                  </ha-alert>
-                `
-              : warning
+        ${repeat(
+          this.schema,
+          (item) => this._getSchemaKey(item),
+          (item) => {
+            const error = getError(this.error, item);
+            const warning = getWarning(this.warning, item);
+            return html`
+              ${error
                 ? html`
-                    <ha-alert own-margin alert-type="warning">
-                      ${this._computeWarning(warning, item)}
+                    <ha-alert own-margin alert-type="error">
+                      ${this._computeError(error, item)}
                     </ha-alert>
                   `
-                : ""}
-            ${"selector" in item
-              ? html`<ha-selector
-                  .schema=${item}
-                  .hass=${this.hass}
-                  .name=${item.name}
-                  .selector=${item.selector}
-                  .value=${getValue(this.data, item)}
-                  .label=${this._computeLabel(item, this.data)}
-                  .disabled=${item.disabled || this.disabled || false}
-                  .placeholder=${item.required ? "" : item.default}
-                  .helper=${this._computeHelper(item)}
-                  .localizeValue=${this.localizeValue}
-                  .required=${item.required || false}
-                  .context=${this._generateContext(item)}
-                ></ha-selector>`
-              : dynamicElement(this.fieldElementName(item.type), {
-                  schema: item,
-                  data: getValue(this.data, item),
-                  label: this._computeLabel(item, this.data),
-                  helper: this._computeHelper(item),
-                  disabled: this.disabled || item.disabled || false,
-                  hass: this.hass,
-                  localize: this.hass?.localize,
-                  computeLabel: this.computeLabel,
-                  computeHelper: this.computeHelper,
-                  localizeValue: this.localizeValue,
-                  context: this._generateContext(item),
-                  ...this.getFormProperties(),
-                })}
-          `;
-        })}
+                : warning
+                  ? html`
+                      <ha-alert own-margin alert-type="warning">
+                        ${this._computeWarning(warning, item)}
+                      </ha-alert>
+                    `
+                  : ""}
+              ${"selector" in item
+                ? html`<ha-selector
+                    .schema=${item}
+                    .hass=${this.hass}
+                    .name=${item.name}
+                    .selector=${item.selector}
+                    .value=${getValue(this.data, item)}
+                    .label=${this._computeLabel(item, this.data)}
+                    .disabled=${item.disabled || this.disabled || false}
+                    .placeholder=${item.required ? "" : item.default}
+                    .helper=${this._computeHelper(item)}
+                    .localizeValue=${this.localizeValue}
+                    .required=${item.required || false}
+                    .context=${this._generateContext(item)}
+                  ></ha-selector>`
+                : dynamicElement(this.fieldElementName(item.type), {
+                    schema: item,
+                    data: getValue(this.data, item),
+                    label: this._computeLabel(item, this.data),
+                    helper: this._computeHelper(item),
+                    disabled: this.disabled || item.disabled || false,
+                    hass: this.hass,
+                    localize: this.hass?.localize,
+                    computeLabel: this.computeLabel,
+                    computeHelper: this.computeHelper,
+                    localizeValue: this.localizeValue,
+                    context: this._generateContext(item),
+                    ...this.getFormProperties(),
+                  })}
+            `;
+          }
+        )}
       </div>
     `;
   }

src/components/ha-service-control.ts

@@ -174,7 +174,6 @@ export class HaServiceControl extends LitElement {
       if (this._value && serviceData) {
         const loadDefaults = this.value && !("data" in this.value);
         // Set mandatory bools without a default value to false
-        this._value = { ...this._value };
         if (!this._value.data) {
           this._value.data = {};
         }

src/data/lovelace/config/action.ts

@@ -1,5 +1,4 @@
 import type { HassServiceTarget } from "home-assistant-js-websocket";
-import { Action } from "../../script";
 
 export interface ToggleActionConfig extends BaseActionConfig {
   action: "toggle";
@@ -29,12 +28,6 @@ export interface UrlActionConfig extends BaseActionConfig {
 
 export interface MoreInfoActionConfig extends BaseActionConfig {
   action: "more-info";
-  entity_id?: string;
-}
-
-export interface SequenceActionConfig extends BaseActionConfig {
-  action: "sequence";
-  actions?: Action[];
 }
 
 export interface AssistActionConfig extends BaseActionConfig {
@@ -73,5 +66,4 @@ export type ActionConfig =
   | MoreInfoActionConfig
   | AssistActionConfig
   | NoActionConfig
-  | CustomActionConfig
-  | SequenceActionConfig;
+  | CustomActionConfig;

src/panels/config/automation/action/types/ha-automation-action-play_media.ts

@@ -52,7 +52,7 @@ export class HaPlayMediaAction extends LitElement implements ActionElement {
     fireEvent(this, "value-changed", {
       value: {
         ...this.action,
-        action: "media_player.play_media",
+        service: "media_player.play_media",
         target: { entity_id: ev.detail.value.entity_id },
         data: {
           media_content_id: ev.detail.value.media_content_id,

src/panels/config/automation/action/types/ha-automation-action-service.ts

@@ -117,7 +117,6 @@ export class HaServiceAction extends LitElement implements ActionElement {
         .value=${this._action}
         .disabled=${this.disabled}
         .showAdvanced=${this.hass.userData?.showAdvanced}
-        .hidePicker=${!!this._action.metadata}
         @value-changed=${this._actionChanged}
       ></ha-service-control>
       ${domain && service && this.hass.services[domain]?.[service]?.response

src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts

@@ -24,7 +24,6 @@ import { haStyle } from "../../../../../resources/styles";
 import { HomeAssistant, Route } from "../../../../../types";
 import { formatAsPaddedHex, sortZHAGroups } from "./functions";
 import { zhaTabs } from "./zha-config-dashboard";
-import { LocalizeFunc } from "../../../../../common/translations/localize";
 
 export interface GroupRowData extends ZHAGroup {
   group?: GroupRowData;
@@ -72,35 +71,38 @@ export class ZHAGroupsDashboard extends LitElement {
   });
 
   private _columns = memoizeOne(
-    (localize: LocalizeFunc): DataTableColumnContainer => {
-      const columns: DataTableColumnContainer<GroupRowData> = {
-        name: {
-          title: localize("ui.panel.config.zha.groups.groups"),
-          sortable: true,
-          filterable: true,
-          showNarrow: true,
-          main: true,
-          hideable: false,
-          moveable: false,
-          direction: "asc",
-          flex: 2,
-        },
-        group_id: {
-          title: localize("ui.panel.config.zha.groups.group_id"),
-          type: "numeric",
-          template: (group) => html` ${formatAsPaddedHex(group.group_id)} `,
-          sortable: true,
-        },
-        members: {
-          title: localize("ui.panel.config.zha.groups.members"),
-          type: "numeric",
-          template: (group) => html` ${group.members.length} `,
-          sortable: true,
-        },
-      };
-
-      return columns;
-    }
+    (narrow: boolean): DataTableColumnContainer<GroupRowData> =>
+      narrow
+        ? {
+            name: {
+              title: "Group",
+              sortable: true,
+              filterable: true,
+              direction: "asc",
+              flex: 2,
+            },
+          }
+        : {
+            name: {
+              title: this.hass.localize("ui.panel.config.zha.groups.groups"),
+              sortable: true,
+              filterable: true,
+              direction: "asc",
+              flex: 2,
+            },
+            group_id: {
+              title: this.hass.localize("ui.panel.config.zha.groups.group_id"),
+              type: "numeric",
+              template: (group) => html` ${formatAsPaddedHex(group.group_id)} `,
+              sortable: true,
+            },
+            members: {
+              title: this.hass.localize("ui.panel.config.zha.groups.members"),
+              type: "numeric",
+              template: (group) => html` ${group.members.length} `,
+              sortable: true,
+            },
+          }
   );
 
   protected render(): TemplateResult {
@@ -110,7 +112,7 @@ export class ZHAGroupsDashboard extends LitElement {
         .hass=${this.hass}
         .narrow=${this.narrow}
         .route=${this.route}
-        .columns=${this._columns(this.hass.localize)}
+        .columns=${this._columns(this.narrow)}
         .data=${this._formattedGroups(this._groups)}
         @row-click=${this._handleRowClicked}
         clickable

src/panels/developer-tools/statistics/developer-tools-statistics.ts

@@ -39,7 +39,6 @@ import {
   StatisticsValidationResult,
   clearStatistics,
   getStatisticIds,
-  updateStatisticsIssues,
   validateStatistics,
 } from "../../../data/recorder";
 import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
@@ -637,8 +636,6 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) {
       validateStatistics(this.hass),
     ]);
 
-    updateStatisticsIssues(this.hass);
-
     const statsIds = new Set();
 
     this._data = statisticIds

src/panels/lovelace/badges/hui-view-badges.ts

@@ -8,7 +8,6 @@ import {
   PropertyValues,
 } from "lit";
 import { customElement, property, state } from "lit/decorators";
-import { classMap } from "lit/directives/class-map";
 import { repeat } from "lit/directives/repeat";
 import { fireEvent } from "../../../common/dom/fire_event";
 import "../../../components/ha-sortable";
@@ -125,7 +124,7 @@ export class HuiViewBadges extends LitElement {
               .options=${BADGE_SORTABLE_OPTIONS}
               invert-swap
             >
-              <div class="badges ${classMap({ "edit-mode": editMode })}">
+              <div class="badges">
                 ${repeat(
                   badges,
                   (badge) => this._getBadgeKey(badge),
@@ -186,8 +185,6 @@ export class HuiViewBadges extends LitElement {
       hui-badge-edit-mode {
         display: block;
         position: relative;
-        min-width: 36px;
-        min-height: 36px;
       }
 
       .add {

src/panels/lovelace/common/handle-action.ts

@@ -3,7 +3,6 @@ import { navigate } from "../../../common/navigate";
 import { forwardHaptic } from "../../../data/haptics";
 import { domainToName } from "../../../data/integration";
 import { ActionConfig } from "../../../data/lovelace/config/action";
-import { callExecuteScript } from "../../../data/service";
 import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
 import { showVoiceCommandDialog } from "../../../dialogs/voice-command-dialog/show-ha-voice-command-dialog";
 import { HomeAssistant } from "../../../types";
@@ -95,13 +94,12 @@ export const handleAction = async (
 
   switch (actionConfig.action) {
     case "more-info": {
-      const entityId =
-        actionConfig.entity_id ||
-        config.entity ||
-        config.camera_image ||
-        config.image_entity;
-      if (entityId) {
-        fireEvent(node, "hass-more-info", { entityId });
+      if (config.entity || config.camera_image || config.image_entity) {
+        fireEvent(node, "hass-more-info", {
+          entityId: (config.entity ||
+            config.camera_image ||
+            config.image_entity)!,
+        });
       } else {
         showToast(node, {
           message: hass.localize(
@@ -178,13 +176,6 @@ export const handleAction = async (
       });
       break;
     }
-    case "sequence": {
-      if (!actionConfig.actions) {
-        return;
-      }
-      callExecuteScript(hass, actionConfig.actions);
-      break;
-    }
     case "fire-dom-event": {
       fireEvent(node, "ll-custom", actionConfig);
     }

src/panels/lovelace/components/hui-action-editor.ts

@@ -1,5 +1,3 @@
-import { ContextProvider } from "@lit-labs/context";
-import { UnsubscribeFunc } from "home-assistant-js-websocket";
 import {
   css,
   CSSResultGroup,
@@ -16,10 +14,7 @@ import "../../../components/ha-assist-pipeline-picker";
 import { HaFormSchema, SchemaUnion } from "../../../components/ha-form/types";
 import "../../../components/ha-help-tooltip";
 import "../../../components/ha-navigation-picker";
-import { HaSelect } from "../../../components/ha-select";
 import "../../../components/ha-service-control";
-import { fullEntitiesContext } from "../../../data/context";
-import { subscribeEntityRegistry } from "../../../data/entity_registry";
 import {
   ActionConfig,
   CallServiceActionConfig,
@@ -27,9 +22,9 @@ import {
   UrlActionConfig,
 } from "../../../data/lovelace/config/action";
 import { ServiceAction } from "../../../data/script";
-import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
 import { HomeAssistant } from "../../../types";
 import { EditorTarget } from "../editor/types";
+import { HaSelect } from "../../../components/ha-select";
 
 export type UiAction = Exclude<ActionConfig["action"], "fire-dom-event">;
 
@@ -39,7 +34,6 @@ const DEFAULT_ACTIONS: UiAction[] = [
   "navigate",
   "url",
   "perform-action",
-  "sequence",
   "assist",
   "none",
 ];
@@ -76,17 +70,8 @@ const ASSIST_SCHEMA = [
   },
 ] as const satisfies readonly HaFormSchema[];
 
-const SEQUENCE_SCHEMA = [
-  {
-    name: "actions",
-    selector: {
-      action: {},
-    },
-  },
-] as const satisfies readonly HaFormSchema[];
-
 @customElement("hui-action-editor")
-export class HuiActionEditor extends SubscribeMixin(LitElement) {
+export class HuiActionEditor extends LitElement {
   @property({ attribute: false }) public config?: ActionConfig;
 
   @property() public label?: string;
@@ -101,19 +86,6 @@ export class HuiActionEditor extends SubscribeMixin(LitElement) {
 
   @query("ha-select") private _select!: HaSelect;
 
-  private _entitiesContext = new ContextProvider(this, {
-    context: fullEntitiesContext,
-    initialValue: [],
-  });
-
-  public hassSubscribe(): UnsubscribeFunc[] {
-    return [
-      subscribeEntityRegistry(this.hass!.connection!, (entities) => {
-        this._entitiesContext.setValue(entities);
-      }),
-    ];
-  }
-
   get _navigation_path(): string {
     const config = this.config as NavigateActionConfig | undefined;
     return config?.navigation_path || "";
@@ -148,11 +120,6 @@ export class HuiActionEditor extends SubscribeMixin(LitElement) {
     }
   }
 
-  protected firstUpdated(_changedProperties: PropertyValues): void {
-    this.hass!.loadFragmentTranslation("config");
-    this.hass!.loadBackendTranslation("device_automation");
-  }
-
   protected render() {
     if (!this.hass) {
       return nothing;
@@ -251,17 +218,6 @@ export class HuiActionEditor extends SubscribeMixin(LitElement) {
             </ha-form>
           `
         : nothing}
-      ${this.config?.action === "sequence"
-        ? html`
-            <ha-form
-              .hass=${this.hass}
-              .schema=${SEQUENCE_SCHEMA}
-              .data=${this.config}
-              .computeLabel=${this._computeFormLabel}
-              @value-changed=${this._formValueChanged}
-            ></ha-form>
-          `
-        : nothing}
     `;
   }
 
@@ -333,15 +289,7 @@ export class HuiActionEditor extends SubscribeMixin(LitElement) {
     });
   }
 
-  private _computeFormLabel(
-    schema:
-      | SchemaUnion<typeof ASSIST_SCHEMA>
-      | SchemaUnion<typeof NAVIGATE_SCHEMA>
-      | SchemaUnion<typeof SEQUENCE_SCHEMA>
-  ) {
-    if (schema.name === "actions") {
-      return "";
-    }
+  private _computeFormLabel(schema: SchemaUnion<typeof ASSIST_SCHEMA>) {
     return this.hass?.localize(
       `ui.panel.lovelace.editor.action-editor.${schema.name}`
     );

src/panels/lovelace/editor/structs/action-struct.ts

@@ -48,12 +48,6 @@ const actionConfigStructService = object({
   confirmation: optional(actionConfigStructConfirmation),
 });
 
-const actionConfigStructSequence = object({
-  action: literal("sequence"),
-  actions: optional(array(object())),
-  confirmation: optional(actionConfigStructConfirmation),
-});
-
 const actionConfigStructNavigate = object({
   action: literal("navigate"),
   navigation_path: string(),
@@ -67,11 +61,6 @@ const actionConfigStructAssist = type({
   start_listening: optional(boolean()),
 });
 
-const actionConfigStructMoreInfo = type({
-  action: literal("more-info"),
-  entity_id: optional(string()),
-});
-
 export const actionConfigStructType = object({
   action: enums([
     "none",
@@ -104,12 +93,6 @@ export const actionConfigStruct = dynamic<any>((value) => {
       case "assist": {
         return actionConfigStructAssist;
       }
-      case "more-info": {
-        return actionConfigStructMoreInfo;
-      }
-      case "sequence": {
-        return actionConfigStructSequence;
-      }
     }
   }
 

src/panels/lovelace/sections/hui-grid-section.ts

@@ -204,10 +204,6 @@ export class GridSection extends LitElement implements LovelaceSectionElement {
           grid-column: span min(var(--column-size, 1), var(--grid-column-count));
         }
 
-        .container.edit-mode .card {
-          min-height: calc((var(--row-height) - var(--row-gap)) / 2);
-        }
-
         .card.fit-rows {
           height: calc(
             (var(--row-size, 1) * (var(--row-height) + var(--row-gap))) - var(

src/state-display/state-display.ts

@@ -99,38 +99,31 @@ class StateDisplay extends LitElement {
     if (content === "name") {
       return html`${this.name || stateObj.attributes.friendly_name}`;
     }
-
-    let relativeDateTime: string | undefined;
-
     // Check last-changed for backwards compatibility
     if (content === "last_changed" || content === "last-changed") {
-      relativeDateTime = stateObj.last_changed;
-    }
-    // Check last_updated for backwards compatibility
-    if (content === "last_updated" || content === "last-updated") {
-      relativeDateTime = stateObj.last_updated;
-    }
-
-    if (
-      content === "last_triggered" ||
-      (domain === "calendar" &&
-        (content === "start_time" || content === "end_time")) ||
-      (domain === "sun" &&
-        (content === "next_dawn" ||
-          content === "next_dusk" ||
-          content === "next_midnight" ||
-          content === "next_noon" ||
-          content === "next_rising" ||
-          content === "next_setting"))
-    ) {
-      relativeDateTime = stateObj.attributes[content];
-    }
-
-    if (relativeDateTime) {
       return html`
         <ha-relative-time
           .hass=${this.hass}
-          .datetime=${relativeDateTime}
+          .datetime=${stateObj.last_changed}
+          capitalize
+        ></ha-relative-time>
+      `;
+    }
+    // Check last_updated for backwards compatibility
+    if (content === "last_updated" || content === "last-updated") {
+      return html`
+        <ha-relative-time
+          .hass=${this.hass}
+          .datetime=${stateObj.last_updated}
+          capitalize
+        ></ha-relative-time>
+      `;
+    }
+    if (content === "last_triggered") {
+      return html`
+        <ha-relative-time
+          .hass=${this.hass}
+          .datetime=${stateObj.attributes.last_triggered}
           capitalize
         ></ha-relative-time>
       `;

src/translations/en.json

@@ -5752,12 +5752,10 @@
               "more-info": "More info",
               "toggle": "Toggle",
               "navigate": "Navigate",
-              "sequence": "Sequence",
               "assist": "Assist",
               "url": "URL",
               "none": "Nothing"
-            },
-            "sequence_actions": "Actions"
+            }
           },
           "condition-editor": {
             "explanation": "The card will be shown when ALL conditions below are fulfilled.",