Add last activated column to scenes data table (#13622)

This commit is contained in:
Bram Kragten 2022-09-06 17:34:49 +02:00 committed by GitHub
parent 5e8c54b00f
commit e78c875e8e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 92 additions and 72 deletions

View File

@ -42,6 +42,8 @@ import { HomeAssistant, Route } from "../../../types";
import { documentationUrl } from "../../../util/documentation-url"; import { documentationUrl } from "../../../util/documentation-url";
import { showToast } from "../../../util/toast"; import { showToast } from "../../../util/toast";
import { configSections } from "../ha-panel-config"; import { configSections } from "../ha-panel-config";
import { formatDateTime } from "../../../common/datetime/format_date_time";
import { UNAVAILABLE_STATES } from "../../../data/entity";
@customElement("ha-scene-dashboard") @customElement("ha-scene-dashboard")
class HaSceneDashboard extends LitElement { class HaSceneDashboard extends LitElement {
@ -77,24 +79,45 @@ class HaSceneDashboard extends LitElement {
} }
); );
private _columns = memoizeOne((_language): DataTableColumnContainer => { private _columns = memoizeOne(
const columns: DataTableColumnContainer = { (_language, narrow): DataTableColumnContainer => {
icon: { const columns: DataTableColumnContainer = {
title: "", icon: {
label: this.hass.localize("ui.panel.config.scene.picker.headers.state"), title: "",
type: "icon", label: this.hass.localize(
template: (_, scene) => "ui.panel.config.scene.picker.headers.state"
html` <ha-state-icon .state=${scene}></ha-state-icon> `, ),
}, type: "icon",
name: { template: (_, scene) =>
title: this.hass.localize("ui.panel.config.scene.picker.headers.name"), html` <ha-state-icon .state=${scene}></ha-state-icon> `,
sortable: true, },
filterable: true, name: {
direction: "asc", title: this.hass.localize(
grows: true, "ui.panel.config.scene.picker.headers.name"
}, ),
only_editable: { sortable: true,
filterable: true,
direction: "asc",
grows: true,
},
};
if (!narrow) {
columns.state = {
title: this.hass.localize(
"ui.panel.config.scene.picker.headers.last_activated"
),
sortable: true,
width: "30%",
template: (last_activated) => html`
${last_activated && !UNAVAILABLE_STATES.includes(last_activated)
? formatDateTime(new Date(last_activated), this.hass.locale)
: this.hass.localize("ui.components.relative_time.never")}
`,
};
}
columns.only_editable = {
title: "", title: "",
width: "56px",
template: (_info, scene: any) => template: (_info, scene: any) =>
!scene.attributes.id !scene.attributes.id
? html` ? html`
@ -109,57 +132,57 @@ class HaSceneDashboard extends LitElement {
></ha-svg-icon> ></ha-svg-icon>
` `
: "", : "",
}, };
}; columns.actions = {
title: "",
width: "72px",
type: "overflow-menu",
template: (_: string, scene: any) =>
html`
<ha-icon-overflow-menu
.hass=${this.hass}
narrow
.items=${[
{
path: mdiInformationOutline,
label: this.hass.localize(
"ui.panel.config.scene.picker.show_info"
),
action: () => this._showInfo(scene),
},
{
path: mdiPlay,
label: this.hass.localize(
"ui.panel.config.scene.picker.activate"
),
action: () => this._activateScene(scene),
},
{
path: mdiContentDuplicate,
label: this.hass.localize(
"ui.panel.config.scene.picker.duplicate"
),
action: () => this._duplicate(scene),
disabled: !scene.attributes.id,
},
{
label: this.hass.localize(
"ui.panel.config.scene.picker.delete"
),
path: mdiDelete,
action: () => this._deleteConfirm(scene),
warning: scene.attributes.id,
disabled: !scene.attributes.id,
},
]}
>
</ha-icon-overflow-menu>
`,
};
columns.actions = { return columns;
title: "", }
type: "overflow-menu", );
template: (_: string, scene: any) =>
html`
<ha-icon-overflow-menu
.hass=${this.hass}
narrow
.items=${[
{
path: mdiInformationOutline,
label: this.hass.localize(
"ui.panel.config.scene.picker.show_info"
),
action: () => this._showInfo(scene),
},
{
path: mdiPlay,
label: this.hass.localize(
"ui.panel.config.scene.picker.activate"
),
action: () => this._activateScene(scene),
},
{
path: mdiContentDuplicate,
label: this.hass.localize(
"ui.panel.config.scene.picker.duplicate"
),
action: () => this._duplicate(scene),
disabled: !scene.attributes.id,
},
{
label: this.hass.localize(
"ui.panel.config.scene.picker.delete"
),
path: mdiDelete,
action: () => this._deleteConfirm(scene),
warning: scene.attributes.id,
disabled: !scene.attributes.id,
},
]}
>
</ha-icon-overflow-menu>
`,
};
return columns;
});
protected render(): TemplateResult { protected render(): TemplateResult {
return html` return html`
@ -169,7 +192,7 @@ class HaSceneDashboard extends LitElement {
back-path="/config" back-path="/config"
.route=${this.route} .route=${this.route}
.tabs=${configSections.automations} .tabs=${configSections.automations}
.columns=${this._columns(this.hass.language)} .columns=${this._columns(this.hass.locale, this.narrow)}
id="entity_id" id="entity_id"
.data=${this._scenes(this.scenes, this._filteredScenes)} .data=${this._scenes(this.scenes, this._filteredScenes)}
.activeFilters=${this._activeFilters} .activeFilters=${this._activeFilters}

View File

@ -2332,11 +2332,8 @@
"duplicate_scene": "Duplicate scene", "duplicate_scene": "Duplicate scene",
"duplicate": "[%key:ui::common::duplicate%]", "duplicate": "[%key:ui::common::duplicate%]",
"headers": { "headers": {
"activate": "Activate",
"state": "State",
"name": "Name", "name": "Name",
"show_info": "Show information", "last_activated": "Last activated"
"edit": "Edit"
} }
}, },
"editor": { "editor": {