From 6447e98caa4ed4136562aa889fcea6d2a5c83d2e Mon Sep 17 00:00:00 2001
From: NovapaX <maarten@maartenenliesbeth.nl>
Date: Sun, 1 Apr 2018 02:31:27 +0200
Subject: [PATCH] Fix language selection (#1056)

* fix attr-for-selected not finding language-tag

* look for attribute instead of property

* change to data-binding structure
---
 .../core/ha-config-section-translation.html    | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/panels/config/core/ha-config-section-translation.html b/panels/config/core/ha-config-section-translation.html
index 9379c8e187..c727929e81 100644
--- a/panels/config/core/ha-config-section-translation.html
+++ b/panels/config/core/ha-config-section-translation.html
@@ -18,7 +18,7 @@
       <paper-card>
         <div class='card-content'>
           <paper-dropdown-menu label="[[localize('ui.panel.config.core.section.translation.language')]]" dynamic-align>
-            <paper-listbox slot="dropdown-content" on-selected-item-changed="handleLanguageSelect" attr-for-selected="language-tag" selected="[[language]]">
+            <paper-listbox slot="dropdown-content" attr-for-selected="language-tag" selected="{{languageSelection}}">
               <template is='dom-repeat' items='[[languages]]'>
                 <paper-item language-tag$="[[item.tag]]">[[item.nativeName]]</paper-item>
               </template>
@@ -48,13 +48,17 @@ class HaConfigSectionTranslation extends
       isWide: {
         type: Boolean,
       },
-
+      languageSelection: {
+        type: String,
+        observer: 'languageSelectionChanged',
+      },
       languages: {
         type: Array,
         computed: 'computeLanguages(hass)',
       },
     };
   }
+  static get observers() { return ['setLanguageSelection(language)']; }
 
   computeLanguages(hass) {
     if (!hass || !hass.translationMetadata) {
@@ -66,11 +70,15 @@ class HaConfigSectionTranslation extends
     }));
   }
 
-  handleLanguageSelect(ev) {
+  setLanguageSelection(language) {
+    this.languageSelection = language;
+  }
+
+  languageSelectionChanged(newVal) {
     // Only fire event if language was changed. This prevents select updates when
     // responding to hass changes.
-    if (ev.detail.value && ev.detail.value.languageTag !== this.language) {
-      this.fire('hass-language-select', { language: ev.detail.value.languageTag });
+    if (newVal !== this.language) {
+      this.fire('hass-language-select', { language: newVal });
     }
   }
 }