Add current user to hass object (#1451)

* Add current user to hass object

* Add enter key support to login form

src/components/ha-sidebar.js

@@ -118,10 +118,18 @@ class HaSidebar extends
         </paper-icon-item>
       </template>
 
+      <template is='dom-if' if='[[!hass.user]]'>
         <paper-icon-item on-click="menuClicked" data-panel="logout" class="logout">
           <ha-icon slot="item-icon" icon="hass:exit-to-app"></ha-icon>
           <span class="item-text">[[localize('ui.sidebar.log_out')]]</span>
         </paper-icon-item>
+      </template>
+      <template is='dom-if' if='[[hass.user]]'>
+        <paper-icon-item on-click="menuClicked" data-panel="profile">
+          <ha-icon slot="item-icon" icon="hass:account"></ha-icon>
+          <span class="item-text">[[hass.user.name]]</span>
+        </paper-icon-item>
+      </template>
     </paper-listbox>
 
     <div>

src/entrypoints/app.js

@@ -175,6 +175,7 @@ class HomeAssistant extends LocalizeMixin(PolymerElement) {
         callApi: null,
         sendWS: null,
         callWS: null,
+        user: null,
       });
       return;
     }
@@ -320,18 +321,22 @@ class HomeAssistant extends LocalizeMixin(PolymerElement) {
 
     let unsubThemes;
 
-    this.hass.connection.sendMessagePromise({
+    this.hass.callWS({
       type: 'frontend/get_themes',
-    }).then((resp) => {
-      this._updateHass({ themes: resp.result });
+    }).then((themes) => {
+      this._updateHass({ themes });
       applyThemesOnElement(
         document.documentElement,
-        resp.result,
+        themes,
         this.hass.selectedTheme,
         true
       );
     });
 
+    this.hass.callWS({
+      type: 'auth/current_user',
+    }).then(user => this._updateHass({ user }), () => {});
+
     conn.subscribeEvents((event) => {
       this._updateHass({ themes: event.data });
       applyThemesOnElement(

src/layouts/partial-panel-resolver.js

@@ -78,6 +78,10 @@ function ensureLoaded(panel) {
       imported = import(/* webpackChunkName: "panel-map" */ '../panels/map/ha-panel-map.js');
       break;
 
+    case 'profile':
+      imported = import(/* webpackChunkName: "panel-profile" */ '../panels/profile/ha-panel-profile.js');
+      break;
+
     case 'shopping-list':
       imported = import(/* webpackChunkName: "panel-shopping-list" */ '../panels/shopping-list/ha-panel-shopping-list.js');
       break;

src/panels/config/dashboard/ha-config-dashboard.js

@@ -48,7 +48,7 @@ class HaConfigDashboard extends LocalizeMixin(PolymerElement) {
             <ha-config-entries-menu hass="[[hass]]"></ha-config-entries-menu>
           </template>
 
-          <template is="dom-if" if="[[computeIsLoaded(hass, 'config.auth_provider_homeassistant')]]">
+          <template is="dom-if" if="[[hass.user.is_owner]]">
             <ha-config-users-menu hass="[[hass]]"></ha-config-users-menu>
           </template>
 

src/panels/profile/ha-panel-profile.js

@@ -0,0 +1,72 @@
+import '@polymer/app-layout/app-header-layout/app-header-layout.js';
+import '@polymer/app-layout/app-header/app-header.js';
+import '@polymer/paper-card/paper-card.js';
+import '@polymer/paper-button/paper-button.js';
+import '@polymer/app-layout/app-toolbar/app-toolbar.js';
+import { html } from '@polymer/polymer/lib/utils/html-tag.js';
+import { PolymerElement } from '@polymer/polymer/polymer-element.js';
+
+import '../../components/ha-menu-button.js';
+import '../../resources/ha-style.js';
+import EventsMixin from '../../mixins/events-mixin.js';
+
+/*
+ * @appliesMixin EventsMixin
+ */
+class HaPanelProfile extends EventsMixin(PolymerElement) {
+  static get template() {
+    return html`
+    <style include="ha-style">
+      :host {
+        -ms-user-select: initial;
+        -webkit-user-select: initial;
+        -moz-user-select: initial;
+      }
+
+      paper-card {
+        display: block;
+        max-width: 600px;
+        margin: 16px auto;
+      }
+    </style>
+
+    <app-header-layout has-scrolling-region>
+      <app-header slot="header" fixed>
+        <app-toolbar>
+          <ha-menu-button narrow='[[narrow]]' show-menu='[[showMenu]]'></ha-menu-button>
+          <div main-title>Profile</div>
+        </app-toolbar>
+      </app-header>
+
+      <div class='content'>
+        <paper-card heading='[[hass.user.name]]'>
+          <div class='card-content'>
+            You are currently logged in as [[hass.user.name]].
+            <template is='dom-if' if='[[hass.user.is_owner]]'>You are an owner.</template>
+          </div>
+          <div class='card-actions'>
+            <paper-button
+              class='warning'
+              on-click='_handleLogOut'
+            >Log out</paper-button>
+          </div>
+        </paper-card>
+      </div>
+    </app-header-layout>
+    `;
+  }
+
+  static get properties() {
+    return {
+      hass: Object,
+      narrow: Boolean,
+      showMenu: Boolean,
+    };
+  }
+
+  _handleLogOut() {
+    this.fire('hass-logout');
+  }
+}
+
+customElements.define('ha-panel-profile', HaPanelProfile);