Skip to content

Commit fb35194

Browse files
piitayapiitaya
authored
Share favorites editor and security entity filter (#53785)
1 parent d4e3ec8 commit fb35194

6 files changed

Lines changed: 68 additions & 68 deletions

File tree

src/panels/home/components/home-favorite-entity-list-item.ts renamed to src/components/entity/ha-favorite-entity-list-item.ts

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,28 +3,28 @@ import { mdiDelete } from "@mdi/js";
33
import type { HassEntity } from "home-assistant-js-websocket";
44
import { css, html, LitElement, nothing } from "lit";
55
import { customElement, property, state } from "lit/decorators";
6-
import { consumeEntityState } from "../../../common/decorators/consume-context-entry";
7-
import { computeEntityPickerDisplay } from "../../../common/entity/compute_entity_name_display";
8-
import { fireEvent } from "../../../common/dom/fire_event";
9-
import "../../../components/entity/state-badge";
10-
import "../../../components/ha-icon-button";
11-
import "../../../components/ha-settings-row";
6+
import { consumeEntityState } from "../../common/decorators/consume-context-entry";
7+
import { computeEntityPickerDisplay } from "../../common/entity/compute_entity_name_display";
8+
import { fireEvent } from "../../common/dom/fire_event";
9+
import "./state-badge";
10+
import "../ha-icon-button";
11+
import "../ha-settings-row";
1212
import {
1313
internationalizationContext,
1414
registriesContext,
15-
} from "../../../data/context";
15+
} from "../../data/context";
1616

1717
declare global {
1818
interface HASSDomEvents {
1919
"delete-favorite-entity": { index: number };
2020
}
2121
interface HTMLElementTagNameMap {
22-
"home-favorite-entity-list-item": HomeFavoriteEntityListItem;
22+
"ha-favorite-entity-list-item": HaFavoriteEntityListItem;
2323
}
2424
}
2525

26-
@customElement("home-favorite-entity-list-item")
27-
export class HomeFavoriteEntityListItem extends LitElement {
26+
@customElement("ha-favorite-entity-list-item")
27+
export class HaFavoriteEntityListItem extends LitElement {
2828
@property({ attribute: "entity-id" }) public entityId!: string;
2929

3030
@property({ type: Number }) public index = 0;

src/panels/home/components/home-favorites-editor.ts renamed to src/components/entity/ha-favorites-editor.ts

Lines changed: 19 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,18 @@
11
import { mdiDragHorizontalVariant } from "@mdi/js";
22
import { css, html, LitElement, nothing } from "lit";
3-
import { customElement, property, state } from "lit/decorators";
3+
import { customElement, property } from "lit/decorators";
44
import { repeat } from "lit/directives/repeat";
5-
import { consumeLocalize } from "../../../common/decorators/consume-context-entry";
6-
import { fireEvent, type HASSDomEvent } from "../../../common/dom/fire_event";
7-
import type { LocalizeFunc } from "../../../common/translations/localize";
8-
import type { HaEntityPicker } from "../../../components/entity/ha-entity-picker";
9-
import "../../../components/entity/ha-entity-picker";
10-
import "../../../components/ha-sortable";
11-
import "../../../components/ha-svg-icon";
12-
import type { HaEntityPickerEntityFilterFunc } from "../../../data/entity/entity";
13-
import type { ValueChangedEvent } from "../../../types";
14-
import "./home-favorite-entity-list-item";
15-
16-
@customElement("home-favorites-editor")
17-
export class HomeFavoritesEditor extends LitElement {
5+
import { fireEvent, type HASSDomEvent } from "../../common/dom/fire_event";
6+
import type { HaEntityPicker } from "./ha-entity-picker";
7+
import "./ha-entity-picker";
8+
import "../ha-sortable";
9+
import "../ha-svg-icon";
10+
import type { HaEntityPickerEntityFilterFunc } from "../../data/entity/entity";
11+
import type { ValueChangedEvent } from "../../types";
12+
import "./ha-favorite-entity-list-item";
13+
14+
@customElement("ha-favorites-editor")
15+
export class HaFavoritesEditor extends LitElement {
1816
@property({ attribute: false }) public favorites: string[] = [];
1917

2018
@property() public label?: string;
@@ -26,45 +24,36 @@ export class HomeFavoritesEditor extends LitElement {
2624

2725
@property({ attribute: "add-button-label" }) public addButtonLabel?: string;
2826

29-
@state()
30-
@consumeLocalize()
31-
private _localize!: LocalizeFunc;
32-
3327
protected render() {
3428
return html`
3529
${this.label ? html`<p class="field-label">${this.label}</p>` : nothing}
3630
${
3731
this.helper ? html`<p class="field-helper">${this.helper}</p>` : nothing
3832
}
3933
<ha-sortable handle-selector=".handle" @item-moved=${this._moved}>
40-
<div class="home-list">
34+
<div class="favorites-list">
4135
${repeat(
4236
this.favorites,
4337
(entityId) => entityId,
4438
(entityId, index) => html`
45-
<div class="home-list-item favorite-row">
39+
<div class="favorite-row">
4640
<div class="handle">
4741
<ha-svg-icon .path=${mdiDragHorizontalVariant}></ha-svg-icon>
4842
</div>
49-
<home-favorite-entity-list-item
43+
<ha-favorite-entity-list-item
5044
class="favorite-content"
5145
.entityId=${entityId}
5246
.index=${index}
5347
@delete-favorite-entity=${this._remove}
54-
></home-favorite-entity-list-item>
48+
></ha-favorite-entity-list-item>
5549
</div>
5650
`
5751
)}
5852
</div>
5953
</ha-sortable>
6054
<ha-entity-picker
6155
add-button
62-
.addButtonLabel=${
63-
this.addButtonLabel ??
64-
this._localize(
65-
"ui.panel.lovelace.editor.strategy.home.add_favorite_entity"
66-
)
67-
}
56+
.addButtonLabel=${this.addButtonLabel}
6857
.excludeEntities=${this.favorites}
6958
.entityFilter=${this.entityFilter}
7059
@value-changed=${this._add}
@@ -115,7 +104,7 @@ export class HomeFavoritesEditor extends LitElement {
115104
color: var(--secondary-text-color);
116105
font-size: 12px;
117106
}
118-
.home-list {
107+
.favorites-list {
119108
display: flex;
120109
flex-direction: column;
121110
}
@@ -144,6 +133,6 @@ export class HomeFavoritesEditor extends LitElement {
144133

145134
declare global {
146135
interface HTMLElementTagNameMap {
147-
"home-favorites-editor": HomeFavoritesEditor;
136+
"ha-favorites-editor": HaFavoritesEditor;
148137
}
149138
}

‎src/panels/home/dialogs/dialog-edit-home.ts‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import type { HassDialog } from "../../../dialogs/make-dialog-manager";
1616
import { DirtyStateProviderMixin } from "../../../mixins/dirty-state-provider-mixin";
1717
import { haStyleDialog } from "../../../resources/styles";
1818
import type { HomeAssistant, ValueChangedEvent } from "../../../types";
19-
import "../components/home-favorites-editor";
19+
import "../../../components/entity/ha-favorites-editor";
2020
import "../components/home-shortcuts-editor";
2121
import type { EditHomeDialogParams } from "./show-dialog-edit-home";
2222

@@ -123,13 +123,16 @@ export class DialogEditHome
123123
@value-changed=${this._welcomeChanged}
124124
></ha-form>
125125
126-
<home-favorites-editor
126+
<ha-favorites-editor
127127
.favorites=${this._state.favorite_entities}
128128
.label=${this.hass.localize(
129129
"ui.panel.lovelace.editor.strategy.home.favorite_entities"
130130
)}
131+
.addButtonLabel=${this.hass.localize(
132+
"ui.panel.lovelace.editor.strategy.home.add_favorite_entity"
133+
)}
131134
@value-changed=${this._favoriteEntitiesChanged}
132-
></home-favorites-editor>
135+
></ha-favorites-editor>
133136
134137
<ha-form
135138
.hass=${this.hass}
@@ -308,7 +311,7 @@ export class DialogEditHome
308311
display: block;
309312
}
310313
311-
home-favorites-editor {
314+
ha-favorites-editor {
312315
display: block;
313316
margin-top: var(--ha-space-2);
314317
margin-bottom: var(--ha-space-4);

‎src/panels/security/components/security-alerts-editor.ts‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { consume, type ContextType } from "@lit/context";
22
import { mdiDelete, mdiDragHorizontalVariant } from "@mdi/js";
3-
import type { HassEntity } from "home-assistant-js-websocket";
43
import { css, html, LitElement, nothing, type PropertyValues } from "lit";
54
import { customElement, property, state } from "lit/decorators";
65
import { repeat } from "lit/directives/repeat";
@@ -29,11 +28,13 @@ import "../../../components/ha-settings-row";
2928
import "../../../components/ha-sortable";
3029
import "../../../components/ha-svg-icon";
3130
import { computeDefaultSecurityAlertSeverity } from "../strategies/security-alerts";
32-
import { isSecurityPanelEntity } from "../strategies/security-view-strategy";
31+
import {
32+
createSecurityEntityFilter,
33+
type SecurityEntityContext,
34+
} from "../security-entity-filter";
3335
import type { ValueChangedEvent } from "../../../types";
3436

35-
type SecurityEditorContext = ContextType<typeof registriesContext> & {
36-
states: ContextType<typeof statesContext>;
37+
type SecurityEditorContext = SecurityEntityContext & {
3738
language: ContextType<typeof internationalizationContext>["language"];
3839
translationMetadata: ContextType<
3940
typeof internationalizationContext
@@ -92,7 +93,7 @@ export class SecurityAlertsEditor extends LitElement {
9293
"ui.panel.security.editor.add_alert_entity"
9394
)}
9495
.excludeEntities=${this.alertEntities.map(({ entity }) => entity)}
95-
.entityFilter=${this._alertEntityFilter}
96+
.entityFilter=${this._entityFilter}
9697
@value-changed=${this._add}
9798
></ha-entity-picker>
9899
`;
@@ -154,10 +155,7 @@ export class SecurityAlertsEditor extends LitElement {
154155
fireEvent(this, "value-changed", { value: next });
155156
}
156157

157-
private _alertEntityFilter = (entity: HassEntity) =>
158-
this._entityContext
159-
? isSecurityPanelEntity(this._entityContext, entity)
160-
: false;
158+
private _entityFilter = createSecurityEntityFilter(() => this._entityContext);
161159

162160
private _getIndex(
163161
ev: HASSDomCurrentTargetEvent<HTMLElement>

‎src/panels/security/dialogs/dialog-edit-security.ts‎

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import { consume, type ContextType } from "@lit/context";
2-
import type { HassEntity } from "home-assistant-js-websocket";
32
import { css, html, LitElement, nothing, type PropertyValues } from "lit";
43
import { customElement, state } from "lit/decorators";
54
import "../../../components/ha-button";
@@ -17,15 +16,14 @@ import { DialogMixin } from "../../../dialogs/dialog-mixin";
1716
import { DirtyStateProviderMixin } from "../../../mixins/dirty-state-provider-mixin";
1817
import { haStyleDialog } from "../../../resources/styles";
1918
import type { ValueChangedEvent } from "../../../types";
20-
import "../../home/components/home-favorites-editor";
19+
import "../../../components/entity/ha-favorites-editor";
2120
import "../components/security-alerts-editor";
22-
import { isSecurityPanelEntity } from "../strategies/security-view-strategy";
21+
import {
22+
createSecurityEntityFilter,
23+
type SecurityEntityContext,
24+
} from "../security-entity-filter";
2325
import type { EditSecurityDialogParams } from "./show-dialog-edit-security";
2426

25-
type SecurityDialogContext = ContextType<typeof registriesContext> & {
26-
states: ContextType<typeof statesContext>;
27-
};
28-
2927
@customElement("dialog-edit-security")
3028
export class DialogEditSecurity extends DirtyStateProviderMixin<SecurityFrontendSystemData>()(
3129
DialogMixin<EditSecurityDialogParams>(LitElement)
@@ -46,7 +44,7 @@ export class DialogEditSecurity extends DirtyStateProviderMixin<SecurityFrontend
4644
@consume({ context: registriesContext, subscribe: true })
4745
private _registries!: ContextType<typeof registriesContext>;
4846

49-
private _entityContext?: SecurityDialogContext;
47+
private _entityContext?: SecurityEntityContext;
5048

5149
protected willUpdate(changedProps: PropertyValues): void {
5250
super.willUpdate(changedProps);
@@ -128,14 +126,14 @@ export class DialogEditSecurity extends DirtyStateProviderMixin<SecurityFrontend
128126
>
129127
<ha-icon slot="leading-icon" icon="mdi:star-outline"></ha-icon>
130128
<div class="expansion-content">
131-
<home-favorites-editor
129+
<ha-favorites-editor
132130
.favorites=${this._state?.favorite_entities ?? []}
133-
.entityFilter=${this._alertEntityFilter}
131+
.entityFilter=${this._entityFilter}
134132
.addButtonLabel=${this._i18n.localize(
135133
"ui.panel.security.editor.add_favorite_entity"
136134
)}
137135
@value-changed=${this._favoriteEntitiesChanged}
138-
></home-favorites-editor>
136+
></ha-favorites-editor>
139137
</div>
140138
</ha-expansion-panel>
141139
<ha-expansion-panel
@@ -180,10 +178,7 @@ export class DialogEditSecurity extends DirtyStateProviderMixin<SecurityFrontend
180178
this._updateDirtyState(this._state);
181179
}
182180

183-
private _alertEntityFilter = (entity: HassEntity) =>
184-
this._entityContext
185-
? isSecurityPanelEntity(this._entityContext, entity)
186-
: false;
181+
private _entityFilter = createSecurityEntityFilter(() => this._entityContext);
187182

188183
private async _save(): Promise<void> {
189184
if (!this.params || !this._state) return;

‎src/panels/security/security-entity-filter.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import type { ContextType } from "@lit/context";
2+
import type { HassEntity } from "home-assistant-js-websocket";
3+
import type { registriesContext, statesContext } from "../../data/context";
4+
import { isSecurityPanelEntity } from "./strategies/security-view-strategy";
5+
6+
export type SecurityEntityContext = ContextType<typeof registriesContext> & {
7+
states: ContextType<typeof statesContext>;
8+
};
9+
10+
export const createSecurityEntityFilter =
11+
(getContext: () => SecurityEntityContext | undefined) =>
12+
(entity: HassEntity): boolean => {
13+
const context = getContext();
14+
return context ? isSecurityPanelEntity(context, entity) : false;
15+
};

0 commit comments

Comments
 (0)