From 681f43913acc1a51b34ca63b1d188381b134be9c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Peter=20V=C3=A1gner?= <pvdeejay@gmail.com>
Date: Fri, 10 Nov 2017 11:26:53 +0100
Subject: [PATCH] Make the disabled PowerSelector element showing custom value
 translatable. Fixes #5547

---
 src/components/views/elements/PowerSelector.js | 12 ++++++------
 src/i18n/strings/en_EN.json                    |  1 +
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/views/elements/PowerSelector.js b/src/components/views/elements/PowerSelector.js
index a0aaa12ff1..8e60a7066d 100644
--- a/src/components/views/elements/PowerSelector.js
+++ b/src/components/views/elements/PowerSelector.js
@@ -18,7 +18,7 @@ limitations under the License.
 
 import React from 'react';
 import * as Roles from '../../../Roles';
-import { _t } from '../../../languageHandler';
+import { _t, _tJsx } from '../../../languageHandler';
 
 let LEVEL_ROLE_MAP = {};
 const reverseRoles = {};
@@ -85,13 +85,11 @@ module.exports = React.createClass({
     render: function() {
         let customPicker;
         if (this.state.custom) {
-            let input;
             if (this.props.disabled) {
-                input = <span>{ this.props.value }</span>;
+                customPicker = <span>{ _tJsx('Custom of <span/>', [/<span\/>/], [(sub) => <span>{ this.props.value }</span>]) }</span>;
             } else {
-                input = <input ref="custom" type="text" size="3" defaultValue={this.props.value} onBlur={this.onCustomBlur} onKeyDown={this.onCustomKeyDown} />;
+                customPicker = <span><input ref="custom" type="text" size="3" defaultValue={this.props.value} onBlur={this.onCustomBlur} onKeyDown={this.onCustomKeyDown} /></span>;
             }
-            customPicker = <span> of { input }</span>;
         }
 
         let selectValue;
@@ -102,7 +100,9 @@ module.exports = React.createClass({
         }
         let select;
         if (this.props.disabled) {
-            select = <span>{ selectValue }</span>;
+            if (!this.state.custom) {
+                select = <span>{ selectValue }</span>;
+            }
         } else {
             // Each level must have a definition in LEVEL_ROLE_MAP
             const levels = [0, 50, 100];
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index 83793291c9..cfc28e3432 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -581,6 +581,7 @@
     "%(items)s and %(count)s others|other": "%(items)s and %(count)s others",
     "%(items)s and %(count)s others|one": "%(items)s and one other",
     "%(items)s and %(lastItem)s": "%(items)s and %(lastItem)s",
+    "Custom of <span/>": "Custom of <span/>",
     "Custom level": "Custom level",
     "Room directory": "Room directory",
     "Start chat": "Start chat",