Support last-changed and last-updated states on all entities (#101)

Author: benct

README.md

@@ -87,6 +87,15 @@ attribute value instead of the state value. `icon` lets you display an icon inst
 
 Note that `hold_action` and `double_tap_action` are currently **not** supported on additional entities.
 
+#### Special attributes
+
+Some special data fields from HA can be displayed by setting the `attribute` field to the following values:
+
+| Value           | Description                                                        |
+| --------------- | ------------------------------------------------------------------ |
+| `last-changed`  | Renders the `last_changed` state of the entity if available        |
+| `last-updated`  | Renders the `last_updated` state of the entity if available        |
+
 ### Secondary Info
 
 The `secondary_info` field can either be _any string_ if you just want to display some text,

src/index.js

@@ -1,6 +1,7 @@
 import { css, html, LitElement } from 'lit';
 import { handleClick } from 'custom-card-helpers';
 
+import { LAST_CHANGED, LAST_UPDATED, TIMESTAMP_FORMATS } from './lib/constants';
 import { checkEntity, entityName, entityStateDisplay, entityStyles } from './entity';
 import { getEntityIds, hasConfigOrEntitiesChanged, hasGenericSecondaryInfo, hideUnavailable, isObject } from './util';
 import { style } from './styles';
@@ -119,7 +120,14 @@ class MultipleEntityRow extends LitElement {
         if (config.toggle === true) {
             return html`<ha-entity-toggle .stateObj="${stateObj}" .hass="${this._hass}"></ha-entity-toggle>`;
         }
-        if (config.format && ['relative', 'total', 'date', 'time', 'datetime'].includes(config.format)) {
+        if (config.attribute && [LAST_CHANGED, LAST_UPDATED].includes(config.attribute)) {
+            return html`<ha-relative-time
+                .hass=${this._hass}
+                .datetime=${stateObj[config.attribute?.replace('-', '_')]}
+                capitalize
+            ></ha-relative-time>`;
+        }
+        if (config.format && [TIMESTAMP_FORMATS].includes(config.format)) {
             const value = config.attribute ? stateObj.attributes[config.attribute] : stateObj.state;
             const timestamp = new Date(value);
             if (!(timestamp instanceof Date) || isNaN(timestamp.getTime())) {

src/lib/constants.js

@@ -7,6 +7,11 @@ export const UNAVAILABLE = 'unavailable';
 export const UNKNOWN = 'unknown';
 export const UNAVAILABLE_STATES = [UNAVAILABLE, UNKNOWN];
 
+export const LAST_CHANGED = 'last-changed';
+export const LAST_UPDATED = 'last-updated';
+
+export const TIMESTAMP_FORMATS = ['relative', 'total', 'date', 'time', 'datetime'];
+
 export const SECONDARY_INFO_VALUES = [
     'entity-id',
     'last-changed',