From ce687f334be524cb69ccc39c73a3156a6fb30a0d Mon Sep 17 00:00:00 2001
From: Gerhard Schlager <mail@gerhard-schlager.at>
Date: Tue, 29 May 2018 15:47:07 +0200
Subject: [PATCH] UX: The "enable 2FA" string was hard to translate

---
 .../components/discourse-linked-text.js.es6    | 18 ++++++++++++++++++
 .../controllers/preferences/account.js.es6     | 10 +++++-----
 .../discourse/routes/preferences.js.es6        |  4 ----
 .../components/discourse-linked-text.hbs       |  1 +
 .../templates/preferences/account.hbs          |  4 +---
 config/locales/client.en.yml                   |  2 +-
 6 files changed, 26 insertions(+), 13 deletions(-)
 create mode 100644 app/assets/javascripts/discourse/components/discourse-linked-text.js.es6
 create mode 100644 app/assets/javascripts/discourse/templates/components/discourse-linked-text.hbs

diff --git a/app/assets/javascripts/discourse/components/discourse-linked-text.js.es6 b/app/assets/javascripts/discourse/components/discourse-linked-text.js.es6
new file mode 100644
index 00000000000..44e8bf9e596
--- /dev/null
+++ b/app/assets/javascripts/discourse/components/discourse-linked-text.js.es6
@@ -0,0 +1,18 @@
+import { default as computed } from 'ember-addons/ember-computed-decorators';
+
+export default Ember.Component.extend({
+  tagName: 'span',
+
+  @computed("text")
+  translatedText(text) {
+    if (text) return I18n.t(text);
+  },
+
+  click(event) {
+    if (event.target.tagName.toUpperCase() === 'A') {
+      this.sendAction("action", this.get("actionParam"));
+    }
+
+    return false;
+  }
+});
diff --git a/app/assets/javascripts/discourse/controllers/preferences/account.js.es6 b/app/assets/javascripts/discourse/controllers/preferences/account.js.es6
index e370efdfafd..40befe7218c 100644
--- a/app/assets/javascripts/discourse/controllers/preferences/account.js.es6
+++ b/app/assets/javascripts/discourse/controllers/preferences/account.js.es6
@@ -4,6 +4,7 @@ import { default as computed } from "ember-addons/ember-computed-decorators";
 import PreferencesTabController from "discourse/mixins/preferences-tab-controller";
 import { setting } from 'discourse/lib/computed';
 import { popupAjaxError } from 'discourse/lib/ajax-error';
+import showModal from 'discourse/lib/show-modal';
 
 export default Ember.Controller.extend(CanCheckEmails, PreferencesTabController, {
 
@@ -41,11 +42,6 @@ export default Ember.Controller.extend(CanCheckEmails, PreferencesTabController,
     return !this.siteSettings.enable_sso && this.siteSettings.enable_local_logins;
   },
 
-  @computed
-  showTwoFactorModalText() {
-    return I18n.t('user.second_factor.title').toLowerCase();
-  },
-
   actions: {
     save() {
       this.set('saved', false);
@@ -105,6 +101,10 @@ export default Ember.Controller.extend(CanCheckEmails, PreferencesTabController,
           }
         ];
       bootbox.dialog(message, buttons, {"classes": "delete-account"});
+    },
+
+    showTwoFactorModal() {
+      showModal('second-factor-intro');
     }
   }
 });
diff --git a/app/assets/javascripts/discourse/routes/preferences.js.es6 b/app/assets/javascripts/discourse/routes/preferences.js.es6
index 128a3017315..1eb3d4b3e17 100644
--- a/app/assets/javascripts/discourse/routes/preferences.js.es6
+++ b/app/assets/javascripts/discourse/routes/preferences.js.es6
@@ -15,10 +15,6 @@ export default RestrictedUserRoute.extend({
   },
 
   actions: {
-    showTwoFactorModal() {
-      showModal('second-factor-intro');
-    },
-
     showAvatarSelector() {
       showModal('avatar-selector');
 
diff --git a/app/assets/javascripts/discourse/templates/components/discourse-linked-text.hbs b/app/assets/javascripts/discourse/templates/components/discourse-linked-text.hbs
new file mode 100644
index 00000000000..dd15a6dc6a4
--- /dev/null
+++ b/app/assets/javascripts/discourse/templates/components/discourse-linked-text.hbs
@@ -0,0 +1 @@
+{{{translatedText}}}
diff --git a/app/assets/javascripts/discourse/templates/preferences/account.hbs b/app/assets/javascripts/discourse/templates/preferences/account.hbs
index c9a6b01105f..2a7f3a0d192 100644
--- a/app/assets/javascripts/discourse/templates/preferences/account.hbs
+++ b/app/assets/javascripts/discourse/templates/preferences/account.hbs
@@ -71,9 +71,7 @@
     {{#if model.second_factor_enabled}}
       {{i18n 'user.second_factor.disable'}}
     {{else}}
-      {{i18n 'enable'}}
-      <a href {{action "showTwoFactorModal"}}>{{showTwoFactorModalText}}</a>
-      {{i18n 'user.second_factor.enable'}}
+      {{discourse-linked-text action="showTwoFactorModal" text="user.second_factor.enable"}}
     {{/if}}
 
     {{#if isCurrentUser}}
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 53520a97d0c..e433e46f120 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -741,7 +741,7 @@ en:
       second_factor:
         title: "Two Factor Authentication"
         disable: "Disable two factor authentication"
-        enable: "for enhanced account security"
+        enable: "Enable <a href>two factor authentication</a> for enhanced account security"
         confirm_password_description: "Please confirm your password to continue"
         label: "Code"
         enable_description: |