From e2ff51f4253d0fbd41019255fa4207f82b0713fd Mon Sep 17 00:00:00 2001
From: yosilevy <37745463+yosilevy@users.noreply.github.com>
Date: Fri, 1 Feb 2019 19:53:08 +0200
Subject: [PATCH]  RTL fixes for raw config editor and card editor -> card
 preview (#2532)

* RTL fixes for raw config editor and card editor -> card preview

* Fixed missing line break

* Fixed weird vscode line break problems

* Refactored to LitElement + addressed updating RTL only when needed

* Refactor

* Fixed forgotten import

* Reverted to HTMLElement + added RTL check in set hass

* Added conditional update
---
 src/common/util/compute_rtl.ts                        |  4 ++++
 .../lovelace/editor/card-editor/hui-card-preview.ts   | 11 ++++++++---
 src/panels/lovelace/hui-editor.ts                     |  1 +
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/common/util/compute_rtl.ts b/src/common/util/compute_rtl.ts
index 62be0a1c7e..343ec34307 100644
--- a/src/common/util/compute_rtl.ts
+++ b/src/common/util/compute_rtl.ts
@@ -7,3 +7,7 @@ export function computeRTL(hass: HomeAssistant) {
   }
   return false;
 }
+
+export function computeRTLDirection(hass: HomeAssistant) {
+  return computeRTL(hass) ? "rtl" : "ltr";
+}
diff --git a/src/panels/lovelace/editor/card-editor/hui-card-preview.ts b/src/panels/lovelace/editor/card-editor/hui-card-preview.ts
index b143bff434..949785ab35 100644
--- a/src/panels/lovelace/editor/card-editor/hui-card-preview.ts
+++ b/src/panels/lovelace/editor/card-editor/hui-card-preview.ts
@@ -9,15 +9,20 @@ import { LovelaceCard } from "../../types";
 import { ConfigError } from "../types";
 import { getCardElementTag } from "../../common/get-card-element-tag";
 import { createErrorCardConfig } from "../../cards/hui-error-card";
+import { computeRTL } from "../../../../common/util/compute_rtl";
 
 export class HuiCardPreview extends HTMLElement {
   private _hass?: HomeAssistant;
   private _element?: LovelaceCard;
 
-  set hass(value: HomeAssistant) {
-    this._hass = value;
+  set hass(hass: HomeAssistant) {
+    if (!this._hass || this._hass.language !== hass.language) {
+      this.style.direction = computeRTL(hass) ? "rtl" : "ltr";
+    }
+
+    this._hass = hass;
     if (this._element) {
-      this._element.hass = value;
+      this._element.hass = hass;
     }
   }
 
diff --git a/src/panels/lovelace/hui-editor.ts b/src/panels/lovelace/hui-editor.ts
index 8d1c201fb9..fcdb102773 100644
--- a/src/panels/lovelace/hui-editor.ts
+++ b/src/panels/lovelace/hui-editor.ts
@@ -99,6 +99,7 @@ class LovelaceFullConfigEditor extends LitElement {
 
         .content {
           height: calc(100vh - 68px);
+          direction: ltr;
         }
 
         hui-code-editor {