From 8a9e149d3336deca5621bcffba8ce7633b1a2737 Mon Sep 17 00:00:00 2001
From: Ian Richardson <iantrich@gmail.com>
Date: Wed, 22 Jan 2020 15:01:02 -0600
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20convert=20more-info-script?=
 =?UTF-8?q?=20to=20LitElement/TypeScript=20(#4545)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* ♻️ convert more-info-script to Lit/TypeScript

* ♻️ convert more-info-script to LitElement/TypeScript

* 👌 use relative time
---
 .../more-info/controls/more-info-script.js    | 31 -------------
 .../more-info/controls/more-info-script.ts    | 46 +++++++++++++++++++
 src/translations/en.json                      |  3 +-
 3 files changed, 48 insertions(+), 32 deletions(-)
 delete mode 100644 src/dialogs/more-info/controls/more-info-script.js
 create mode 100644 src/dialogs/more-info/controls/more-info-script.ts

diff --git a/src/dialogs/more-info/controls/more-info-script.js b/src/dialogs/more-info/controls/more-info-script.js
deleted file mode 100644
index fec483e033..0000000000
--- a/src/dialogs/more-info/controls/more-info-script.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
-import { PolymerElement } from "@polymer/polymer/polymer-element";
-import LocalizeMixin from "../../../mixins/localize-mixin";
-
-class MoreInfoScript extends LocalizeMixin(PolymerElement) {
-  static get template() {
-    return html`
-      <style include="iron-flex iron-flex-alignment"></style>
-
-      <div class="layout vertical">
-        <div class="data-entry layout justified horizontal">
-          <div class="key">
-            [[localize('ui.dialogs.more_info_control.script.last_action')]]
-          </div>
-          <div class="value">[[stateObj.attributes.last_action]]</div>
-        </div>
-      </div>
-    `;
-  }
-
-  static get properties() {
-    return {
-      stateObj: {
-        type: Object,
-      },
-    };
-  }
-}
-
-customElements.define("more-info-script", MoreInfoScript);
diff --git a/src/dialogs/more-info/controls/more-info-script.ts b/src/dialogs/more-info/controls/more-info-script.ts
new file mode 100644
index 0000000000..512cac1c43
--- /dev/null
+++ b/src/dialogs/more-info/controls/more-info-script.ts
@@ -0,0 +1,46 @@
+import {
+  LitElement,
+  html,
+  TemplateResult,
+  property,
+  customElement,
+} from "lit-element";
+import { HassEntity } from "home-assistant-js-websocket";
+
+import { HomeAssistant } from "../../../types";
+
+import "../../../components/ha-relative-time";
+
+@customElement("more-info-script")
+class MoreInfoScript extends LitElement {
+  @property() public hass!: HomeAssistant;
+  @property() public stateObj?: HassEntity;
+
+  protected render(): TemplateResult | void {
+    if (!this.hass || !this.stateObj) {
+      return html``;
+    }
+
+    return html`
+      <div>
+        ${this.hass.localize(
+          "ui.dialogs.more_info_control.script.last_triggered"
+        )}:
+        ${this.stateObj.attributes.last_triggered
+          ? html`
+              <ha-relative-time
+                .hass=${this.hass}
+                .datetime=${this.stateObj.attributes.last_triggered}
+              ></ha-relative-time>
+            `
+          : this.hass.localize("ui.components.relative_time.never")}
+      </div>
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "more-info-script": MoreInfoScript;
+  }
+}
diff --git a/src/translations/en.json b/src/translations/en.json
index 490639a65b..f4eb9acaf9 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -574,7 +574,8 @@
         "settings": "Entity settings",
         "edit": "Edit entity",
         "script": {
-          "last_action": "Last Action"
+          "last_action": "Last Action",
+          "last_triggered": "Last Triggered"
         },
         "sun": {
           "elevation": "Elevation",