Introduce a target picker for the logbook card

src/data/script.ts

@@ -40,7 +40,7 @@ export const baseActionStruct = object({
   enabled: optional(boolean()),
 });
 
-const targetStruct = object({
+export const targetStruct = object({
   entity_id: optional(union([string(), array(string())])),
   device_id: optional(union([string(), array(string())])),
   area_id: optional(union([string(), array(string())])),

src/panels/lovelace/cards/hui-logbook-card.ts

@@ -7,13 +7,16 @@
 import "../../../components/ha-card";
 import type { HomeAssistant } from "../../../types";
 import "../../logbook/ha-logbook";
+import type { HassServiceTarget } from "home-assistant-js-websocket";
 import type { HaLogbook } from "../../logbook/ha-logbook";
 import { findEntities } from "../common/find-entities";
 import { processConfigEntities } from "../common/process-config-entities";
 import "../components/hui-warning";
 import type { EntityConfig } from "../entity-rows/types";
 import type { LovelaceCard, LovelaceCardEditor } from "../types";
 import type { LogbookCardConfig } from "./types";
+import { resolveEntityIDs } from "../../../data/selector";
+import memoizeOne from "memoize-one";
 
 export const DEFAULT_HOURS_TO_SHOW = 24;
 
@@ -50,16 +53,16 @@
 
   @state() private _time?: HaLogbook["time"];
 
-  @state() private _entityId?: string[];
+  @state() private _targetPickerValue: HassServiceTarget = {};
 
   public getCardSize(): number {
     return 9 + (this._config?.title ? 1 : 0);
   }
 
   public setConfig(config: LogbookCardConfig): void {
-    if (!config.entities.length) {
+    /*if (!config.entities.length) {
       throw new Error("Entities must be specified");
-    }
+    }*/
 
     this._config = {
       hours_to_show: DEFAULT_HOURS_TO_SHOW,
@@ -68,11 +71,34 @@
     this._time = {
       recent: this._config!.hours_to_show! * 60 * 60,
     };
-    this._entityId = processConfigEntities<EntityConfig>(config.entities).map(
-      (entity) => entity.entity
+
+    this._targetPickerValue = this._config?.target;
+  }
+
+  private _getEntityIds(): string[] | undefined {
+    console.log("test");
+    const entities = this.__getEntityIds(
+      this._targetPickerValue,
+      this.hass.entities,
+      this.hass.devices,
+      this.hass.areas
     );
+    if (entities.length === 0) {
+      return undefined;
+    }
+    return entities;
   }
 
+  private __getEntityIds = memoizeOne(
+    (
+      targetPickerValue: HassServiceTarget,
+      entities: HomeAssistant["entities"],
+      devices: HomeAssistant["devices"],
+      areas: HomeAssistant["areas"]
+    ): string[] =>
+      resolveEntityIDs(this.hass, targetPickerValue, entities, devices, areas)
+  );
+
   protected updated(changedProperties: PropertyValues) {
     super.updated(changedProperties);
     if (!this._config || !this.hass) {
@@ -116,7 +142,7 @@
           <ha-logbook
             .hass=${this.hass}
             .time=${this._time}
-            .entityIds=${this._entityId}
+            .entityIds=${this._getEntityIds()}
             narrow
             relative-time
             virtualize

src/panels/lovelace/editor/config-elements/hui-logbook-card-editor.ts

@@ -9,8 +9,10 @@ import {
   optional,
   string,
 } from "superstruct";
+import type { HassServiceTarget } from "home-assistant-js-websocket";
 import { fireEvent } from "../../../../common/dom/fire_event";
 import "../../../../components/entity/ha-entities-picker";
+import "../../../../components/ha-target-picker";
 import "../../../../components/ha-form/ha-form";
 import type { SchemaUnion } from "../../../../components/ha-form/types";
 import { filterLogbookCompatibleEntities } from "../../../../data/logbook";
@@ -19,6 +21,7 @@ import type { LogbookCardConfig } from "../../cards/types";
 import type { LovelaceCardEditor } from "../../types";
 import { baseLovelaceCardConfig } from "../structs/base-card-struct";
 import { DEFAULT_HOURS_TO_SHOW } from "../../cards/hui-logbook-card";
+import { targetStruct } from "../../../../data/script";
 
 const cardConfigStruct = assign(
   baseLovelaceCardConfig,
@@ -27,6 +30,7 @@ const cardConfigStruct = assign(
     title: optional(string()),
     hours_to_show: optional(number()),
     theme: optional(string()),
+    target: optional(targetStruct),
   })
 );
 
@@ -64,6 +68,10 @@ export class HuiLogbookCardEditor
     return this._config!.entities || [];
   }
 
+  get _targetPicker(): HassServiceTarget {
+    return this._config!.target || {};
+  }
+
   protected render() {
     if (!this.hass || !this._config) {
       return nothing;
@@ -77,25 +85,18 @@ export class HuiLogbookCardEditor
         .computeLabel=${this._computeLabelCallback}
         @value-changed=${this._valueChanged}
       ></ha-form>
-      <h3>
-        ${`${this.hass!.localize(
-          "ui.panel.lovelace.editor.card.generic.entities"
-        )} (${this.hass!.localize(
-          "ui.panel.lovelace.editor.card.config.required"
-        )})`}
-      </h3>
-      <ha-entities-picker
+
+      <ha-target-picker
         .hass=${this.hass}
-        .value=${this._entities}
+        .value=${this._targetPicker}
         .entityFilter=${filterLogbookCompatibleEntities}
         @value-changed=${this._entitiesChanged}
-      >
-      </ha-entities-picker>
+      ></ha-target-picker>
     `;
   }
 
   private _entitiesChanged(ev: CustomEvent): void {
-    this._config = { ...this._config!, entities: ev.detail.value };
+    this._config = { ...this._config!, target: ev.detail.value };
     fireEvent(this, "config-changed", { config: this._config });
   }