Add no devices available hint to person editor (#3906)

* Add no devices available hint to person editor (#3731)

* Fix device_tracker check and adjust messages

* fix lint

* Add location, fix memoize usage, hide entity picker and update text

* Move links to a list
This commit is contained in:
Sven 2019-10-13 13:22:37 +02:00 committed by Bram Kragten
parent 476525e0d4
commit 300ffdae04
2 changed files with 64 additions and 18 deletions

View File

@ -9,9 +9,9 @@ import {
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
import "@polymer/paper-input/paper-input";
import "@material/mwc-button";
import memoizeOne from "memoize-one";
import "../../../components/dialog/ha-paper-dialog";
import "../../../components/entity/ha-entities-picker";
import "../../../components/user/ha-user-picker";
import { PersonDetailDialogParams } from "./show-dialog-person-detail";
@ -29,6 +29,13 @@ class DialogPersonDetail extends LitElement {
@property() private _params?: PersonDetailDialogParams;
@property() private _submitting: boolean = false;
private _deviceTrackersAvailable = memoizeOne((hass) => {
return Object.keys(hass.states).some(
(entityId) =>
entityId.substr(0, entityId.indexOf(".")) === "device_tracker"
);
});
public async showDialog(params: PersonDetailDialogParams): Promise<void> {
this._params = params;
this._error = undefined;
@ -87,6 +94,8 @@ class DialogPersonDetail extends LitElement {
.users=${this._params.users}
@value-changed=${this._userChanged}
></ha-user-picker>
${this._deviceTrackersAvailable(this.hass)
? html`
<p>
${this.hass.localize(
"ui.panel.config.person.detail.device_tracker_intro"
@ -103,7 +112,37 @@ class DialogPersonDetail extends LitElement {
"ui.panel.config.person.detail.device_tracker_pick"
)}
@value-changed=${this._deviceTrackersChanged}
></ha-entities-picker>
>
</ha-entities-picker>
`
: html`
<p>
${this.hass!.localize(
"ui.panel.config.person.detail.no_device_tracker_available_intro"
)}
</p>
<ul>
<li>
<a
href="https://www.home-assistant.io/integrations/#presence-detection"
target="_blank"
>${this.hass!.localize(
"ui.panel.config.person.detail.link_presence_detection_integrations"
)}</a
>
</li>
<li>
<a
@click="${this._closeDialog}"
href="/config/integrations"
>
${this.hass!.localize(
"ui.panel.config.person.detail.link_integrations_page"
)}</a
>
</li>
</ul>
`}
</div>
</paper-dialog-scrollable>
<div class="paper-dialog-buttons">
@ -131,6 +170,10 @@ class DialogPersonDetail extends LitElement {
`;
}
private _closeDialog() {
this._params = undefined;
}
private _nameChanged(ev: PolymerChangedEvent<string>) {
this._error = undefined;
this._name = ev.detail.value;

View File

@ -1148,6 +1148,9 @@
"name_error_msg": "Name is required",
"linked_user": "Linked User",
"device_tracker_intro": "Select the devices that belong to this person.",
"no_device_tracker_available_intro": "When you have devices that indicate the presence of a person, you will be able to assign them to a person here. You can add your first device by adding a presence-detection integration from the integrations page.",
"link_presence_detection_integrations": "Presence Detection Integrations",
"link_integrations_page": "Integrations page",
"device_tracker_picked": "Track Device",
"device_tracker_pick": "Pick device to track",
"delete": "Delete",