jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-28 11:46:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add area to automation, scene, script tables (#20366)

Browse Source 
* Add area to automation, scene, script tables

* typing
This commit is contained in:
Bram Kragten 2024-04-03 13:04:47 +02:00 committed by GitHub
parent 5315545a4d
commit bfdc9a3d86
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 218 additions and 180 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
src/panels/config/automation/ha-automation-picker.ts
View File

@ -103,6 +103,7 @@ import { showNewAutomationDialog } from "./show-dialog-new-automation";
type AutomationItem = AutomationEntity & { type AutomationItem = AutomationEntity & {
name: string; name: string;
area: string | undefined;
last_triggered?: string | undefined; last_triggered?: string | undefined;
formatted_state: string; formatted_state: string;
category: string | undefined; category: string | undefined;
@ -152,6 +153,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
( (
automations: AutomationEntity[], automations: AutomationEntity[],
entityReg: EntityRegistryEntry[], entityReg: EntityRegistryEntry[],
areas: HomeAssistant["areas"],
categoryReg?: CategoryRegistryEntry[], categoryReg?: CategoryRegistryEntry[],
labelReg?: LabelRegistryEntry[], labelReg?: LabelRegistryEntry[],
filteredAutomations?: string[] | null filteredAutomations?: string[] | null
@ -174,6 +176,9 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
return { return {
...automation, ...automation,
name: computeStateName(automation), name: computeStateName(automation),
area: entityRegEntry?.area_id
? areas[entityRegEntry?.area_id]?.name
: undefined,
last_triggered: automation.attributes.last_triggered || undefined, last_triggered: automation.attributes.last_triggered || undefined,
formatted_state: this.hass.formatEntityState(automation), formatted_state: this.hass.formatEntityState(automation),
category: category category: category
@ -242,6 +247,13 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
`; `;
}, },
}, },
area: {
title: localize("ui.panel.config.automation.picker.headers.area"),
hidden: true,
groupable: true,
filterable: true,
sortable: true,
},
category: { category: {
title: localize("ui.panel.config.automation.picker.headers.category"), title: localize("ui.panel.config.automation.picker.headers.category"),
hidden: true, hidden: true,
@ -256,34 +268,32 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
template: (automation) => template: (automation) =>
automation.labels.map((lbl) => lbl.name).join(" "), automation.labels.map((lbl) => lbl.name).join(" "),
}, },
}; last_triggered: {
columns.last_triggered = { sortable: true,
sortable: true, width: "130px",
width: "130px", title: localize("ui.card.automation.last_triggered"),
title: localize("ui.card.automation.last_triggered"), hidden: narrow,
hidden: narrow, template: (automation) => {
template: (automation) => { if (!automation.last_triggered) {
if (!automation.last_triggered) { return this.hass.localize("ui.components.relative_time.never");
return this.hass.localize("ui.components.relative_time.never"); }
} const date = new Date(automation.last_triggered);
const date = new Date(automation.last_triggered); const now = new Date();
const now = new Date(); const dayDifference = differenceInDays(now, date);
const dayDifference = differenceInDays(now, date); return html`
return html` ${dayDifference > 3
${dayDifference > 3 ? formatShortDateTime(date, locale, this.hass.config)
? formatShortDateTime(date, locale, this.hass.config) : relativeTime(date, locale)}
: relativeTime(date, locale)} `;
`; },
}, },
}; formatted_state: {
if (!this.narrow) {
columns.formatted_state = {
width: "82px", width: "82px",
sortable: true, sortable: true,
groupable: true, groupable: true,
title: "", title: "",
type: "overflow", type: "overflow",
hidden: narrow,
label: this.hass.localize("ui.panel.config.automation.picker.state"), label: this.hass.localize("ui.panel.config.automation.picker.state"),
template: (automation) => html` template: (automation) => html`
<ha-entity-toggle <ha-entity-toggle
@ -291,21 +301,20 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
.hass=${this.hass} .hass=${this.hass}
></ha-entity-toggle> ></ha-entity-toggle>
`, `,
}; },
} actions: {
title: "",
columns.actions = { width: "64px",
title: "", type: "icon-button",
width: "64px", template: (automation) => html`
type: "icon-button", <ha-icon-button
template: (automation) => html` .automation=${automation}
<ha-icon-button .label=${this.hass.localize("ui.common.overflow_menu")}
.automation=${automation} .path=${mdiDotsVertical}
.label=${this.hass.localize("ui.common.overflow_menu")} @click=${this._showOverflowMenu}
.path=${mdiDotsVertical} ></ha-icon-button>
@click=${this._showOverflowMenu} `,
></ha-icon-button> },
`,
}; };
return columns; return columns;
} }
@ -401,6 +410,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
.data=${this._automations( .data=${this._automations(
this.automations, this.automations,
this._entityReg, this._entityReg,
this.hass.areas,
this._categories, this._categories,
this._labels, this._labels,
this._filteredAutomations this._filteredAutomations

166
src/panels/config/scene/ha-scene-dashboard.ts
View File

@ -91,6 +91,7 @@ import { computeCssColor } from "../../../common/color/compute-color";
type SceneItem = SceneEntity & { type SceneItem = SceneEntity & {
name: string; name: string;
area: string | undefined;
category: string | undefined; category: string | undefined;
labels: LabelRegistryEntry[]; labels: LabelRegistryEntry[];
}; };
@ -136,6 +137,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
( (
scenes: SceneEntity[], scenes: SceneEntity[],
entityReg: EntityRegistryEntry[], entityReg: EntityRegistryEntry[],
areas: HomeAssistant["areas"],
categoryReg?: CategoryRegistryEntry[], categoryReg?: CategoryRegistryEntry[],
labelReg?: LabelRegistryEntry[], labelReg?: LabelRegistryEntry[],
filteredScenes?: string[] | null filteredScenes?: string[] | null
@ -156,6 +158,9 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
return { return {
...scene, ...scene,
name: computeStateName(scene), name: computeStateName(scene),
area: entityRegEntry?.area_id
? areas[entityRegEntry?.area_id]?.name
: undefined,
category: category category: category
? categoryReg?.find((cat) => cat.category_id === category)?.name ? categoryReg?.find((cat) => cat.category_id === category)?.name
: undefined, : undefined,
@ -198,6 +203,13 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
: nothing} : nothing}
`, `,
}, },
area: {
title: localize("ui.panel.config.scene.picker.headers.area"),
hidden: true,
groupable: true,
filterable: true,
sortable: true,
},
category: { category: {
title: localize("ui.panel.config.scene.picker.headers.category"), title: localize("ui.panel.config.scene.picker.headers.category"),
hidden: true, hidden: true,
@ -211,14 +223,13 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
filterable: true, filterable: true,
template: (scene) => scene.labels.map((lbl) => lbl.name).join(" "), template: (scene) => scene.labels.map((lbl) => lbl.name).join(" "),
}, },
}; state: {
if (!narrow) {
columns.state = {
title: localize( title: localize(
"ui.panel.config.scene.picker.headers.last_activated" "ui.panel.config.scene.picker.headers.last_activated"
), ),
sortable: true, sortable: true,
width: "30%", width: "30%",
hidden: narrow,
template: (scene) => { template: (scene) => {
const lastActivated = scene.state; const lastActivated = scene.state;
if (!lastActivated || isUnavailableState(lastActivated)) { if (!lastActivated || isUnavailableState(lastActivated)) {
@ -233,80 +244,80 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
: relativeTime(date, this.hass.locale)} : relativeTime(date, this.hass.locale)}
`; `;
}, },
}; },
} only_editable: {
columns.only_editable = { title: "",
title: "", width: "56px",
width: "56px", template: (scene) =>
template: (scene) => !scene.attributes.id
!scene.attributes.id ? html`
? html` <simple-tooltip animation-delay="0" position="left">
<simple-tooltip animation-delay="0" position="left"> ${this.hass.localize(
${this.hass.localize( "ui.panel.config.scene.picker.only_editable"
"ui.panel.config.scene.picker.only_editable" )}
)} </simple-tooltip>
</simple-tooltip> <ha-svg-icon
<ha-svg-icon .path=${mdiPencilOff}
.path=${mdiPencilOff} style="color: var(--secondary-text-color)"
style="color: var(--secondary-text-color)" ></ha-svg-icon>
></ha-svg-icon> `
` : "",
: "", },
}; actions: {
columns.actions = { title: "",
title: "", width: "64px",
width: "64px", type: "overflow-menu",
type: "overflow-menu", template: (scene) => html`
template: (scene) => html` <ha-icon-overflow-menu
<ha-icon-overflow-menu .hass=${this.hass}
.hass=${this.hass} narrow
narrow .items=${[
.items=${[ {
{ path: mdiInformationOutline,
path: mdiInformationOutline, label: this.hass.localize(
label: this.hass.localize( "ui.panel.config.scene.picker.show_info"
"ui.panel.config.scene.picker.show_info" ),
), action: () => this._showInfo(scene),
action: () => this._showInfo(scene), },
}, {
{ path: mdiPlay,
path: mdiPlay, label: this.hass.localize(
label: this.hass.localize( "ui.panel.config.scene.picker.activate"
"ui.panel.config.scene.picker.activate" ),
), action: () => this._activateScene(scene),
action: () => this._activateScene(scene), },
}, {
{ path: mdiTag,
path: mdiTag, label: this.hass.localize(
label: this.hass.localize( `ui.panel.config.scene.picker.${scene.category ? "edit_category" : "assign_category"}`
`ui.panel.config.scene.picker.${scene.category ? "edit_category" : "assign_category"}` ),
), action: () => this._editCategory(scene),
action: () => this._editCategory(scene), },
}, {
{ divider: true,
divider: true, },
}, {
{ path: mdiContentDuplicate,
path: mdiContentDuplicate, label: this.hass.localize(
label: this.hass.localize( "ui.panel.config.scene.picker.duplicate"
"ui.panel.config.scene.picker.duplicate" ),
), action: () => this._duplicate(scene),
action: () => this._duplicate(scene), disabled: !scene.attributes.id,
disabled: !scene.attributes.id, },
}, {
{ label: this.hass.localize(
label: this.hass.localize( "ui.panel.config.scene.picker.delete"
"ui.panel.config.scene.picker.delete" ),
), path: mdiDelete,
path: mdiDelete, action: () => this._deleteConfirm(scene),
action: () => this._deleteConfirm(scene), warning: scene.attributes.id,
warning: scene.attributes.id, disabled: !scene.attributes.id,
disabled: !scene.attributes.id, },
}, ]}
]} >
> </ha-icon-overflow-menu>
</ha-icon-overflow-menu> `,
`, },
}; };
return columns; return columns;
@ -386,6 +397,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
.data=${this._scenes( .data=${this._scenes(
this.scenes, this.scenes,
this._entityReg, this._entityReg,
this.hass.areas,
this._categories, this._categories,
this._labels, this._labels,
this._filteredScenes this._filteredScenes

139
src/panels/config/script/ha-script-picker.ts
View File

@ -93,6 +93,7 @@ import { computeCssColor } from "../../../common/color/compute-color";
type ScriptItem = ScriptEntity & { type ScriptItem = ScriptEntity & {
name: string; name: string;
area: string | undefined;
category: string | undefined; category: string | undefined;
labels: LabelRegistryEntry[]; labels: LabelRegistryEntry[];
}; };
@ -140,6 +141,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
( (
scripts: ScriptEntity[], scripts: ScriptEntity[],
entityReg: EntityRegistryEntry[], entityReg: EntityRegistryEntry[],
areas: HomeAssistant["areas"],
categoryReg?: CategoryRegistryEntry[], categoryReg?: CategoryRegistryEntry[],
labelReg?: LabelRegistryEntry[], labelReg?: LabelRegistryEntry[],
filteredScripts?: string[] | null filteredScripts?: string[] | null
@ -162,6 +164,9 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
return { return {
...script, ...script,
name: computeStateName(script), name: computeStateName(script),
area: entityRegEntry?.area_id
? areas[entityRegEntry?.area_id]?.name
: undefined,
last_triggered: script.attributes.last_triggered || undefined, last_triggered: script.attributes.last_triggered || undefined,
category: category category: category
? categoryReg?.find((cat) => cat.category_id === category)?.name ? categoryReg?.find((cat) => cat.category_id === category)?.name
@ -227,6 +232,13 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
`; `;
}, },
}, },
area: {
title: localize("ui.panel.config.script.picker.headers.area"),
hidden: true,
groupable: true,
filterable: true,
sortable: true,
},
category: { category: {
title: localize("ui.panel.config.script.picker.headers.category"), title: localize("ui.panel.config.script.picker.headers.category"),
hidden: true, hidden: true,
@ -240,9 +252,8 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
filterable: true, filterable: true,
template: (script) => script.labels.map((lbl) => lbl.name).join(" "), template: (script) => script.labels.map((lbl) => lbl.name).join(" "),
}, },
}; last_triggered: {
if (!narrow) { hidden: narrow,
columns.last_triggered = {
sortable: true, sortable: true,
width: "40%", width: "40%",
title: localize("ui.card.automation.last_triggered"), title: localize("ui.card.automation.last_triggered"),
@ -262,66 +273,67 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
: this.hass.localize("ui.components.relative_time.never")} : this.hass.localize("ui.components.relative_time.never")}
`; `;
}, },
}; },
} actions: {
title: "",
columns.actions = { width: "64px",
title: "", type: "overflow-menu",
width: "64px", template: (script) => html`
type: "overflow-menu", <ha-icon-overflow-menu
template: (script) => html` .hass=${this.hass}
<ha-icon-overflow-menu narrow
.hass=${this.hass} .items=${[
narrow {
.items=${[ path: mdiInformationOutline,
{ label: this.hass.localize(
path: mdiInformationOutline, "ui.panel.config.script.picker.show_info"
label: this.hass.localize( ),
"ui.panel.config.script.picker.show_info" action: () => this._showInfo(script),
), },
action: () => this._showInfo(script), {
}, path: mdiTag,
{ label: this.hass.localize(
path: mdiTag, `ui.panel.config.script.picker.${script.category ? "edit_category" : "assign_category"}`
label: this.hass.localize( ),
`ui.panel.config.script.picker.${script.category ? "edit_category" : "assign_category"}` action: () => this._editCategory(script),
), },
action: () => this._editCategory(script), {
}, path: mdiPlay,
{ label: this.hass.localize(
path: mdiPlay, "ui.panel.config.script.picker.run"
label: this.hass.localize("ui.panel.config.script.picker.run"), ),
action: () => this._runScript(script), action: () => this._runScript(script),
}, },
{ {
path: mdiTransitConnection, path: mdiTransitConnection,
label: this.hass.localize( label: this.hass.localize(
"ui.panel.config.script.picker.show_trace" "ui.panel.config.script.picker.show_trace"
), ),
action: () => this._showTrace(script), action: () => this._showTrace(script),
}, },
{ {
divider: true, divider: true,
}, },
{ {
path: mdiContentDuplicate, path: mdiContentDuplicate,
label: this.hass.localize( label: this.hass.localize(
"ui.panel.config.script.picker.duplicate" "ui.panel.config.script.picker.duplicate"
), ),
action: () => this._duplicate(script), action: () => this._duplicate(script),
}, },
{ {
label: this.hass.localize( label: this.hass.localize(
"ui.panel.config.script.picker.delete" "ui.panel.config.script.picker.delete"
), ),
path: mdiDelete, path: mdiDelete,
action: () => this._deleteConfirm(script), action: () => this._deleteConfirm(script),
warning: true, warning: true,
}, },
]} ]}
> >
</ha-icon-overflow-menu> </ha-icon-overflow-menu>
`, `,
},
}; };
return columns; return columns;
@ -401,6 +413,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
.data=${this._scripts( .data=${this._scripts(
this.scripts, this.scripts,
this._entityReg, this._entityReg,
this.hass.areas,
this._categories, this._categories,
this._labels, this._labels,
this._filteredScripts this._filteredScripts

9
src/translations/en.json
View File

@ -2686,7 +2686,8 @@
"trigger": "Trigger", "trigger": "Trigger",
"actions": "Actions", "actions": "Actions",
"state": "State", "state": "State",
"category": "Category" "category": "Category",
"area": "Area"
}, },
"bulk_action": "Action", "bulk_action": "Action",
"bulk_actions": { "bulk_actions": {
@ -3560,7 +3561,8 @@
"headers": { "headers": {
"name": "Name", "name": "Name",
"state": "State", "state": "State",
"category": "Category" "category": "Category",
"area": "Area"
}, },
"edit_category": "[%key:ui::panel::config::automation::picker::edit_category%]", "edit_category": "[%key:ui::panel::config::automation::picker::edit_category%]",
"assign_category": "[%key:ui::panel::config::automation::picker::assign_category%]", "assign_category": "[%key:ui::panel::config::automation::picker::assign_category%]",
@ -3669,7 +3671,8 @@
"state": "State", "state": "State",
"name": "Name", "name": "Name",
"last_activated": "Last activated", "last_activated": "Last activated",
"category": "Category" "category": "Category",
"area": "Area"
}, },
"edit_category": "[%key:ui::panel::config::automation::picker::edit_category%]", "edit_category": "[%key:ui::panel::config::automation::picker::edit_category%]",
"assign_category": "[%key:ui::panel::config::automation::picker::assign_category%]", "assign_category": "[%key:ui::panel::config::automation::picker::assign_category%]",