From d39cfe906895fb8bab0c1350c469178e98ffe072 Mon Sep 17 00:00:00 2001
From: Guo Xiang Tan <tgx_world@hotmail.com>
Date: Mon, 31 Aug 2015 09:21:58 +0800
Subject: [PATCH] UX: Combine closed and archived icon.

---
 .../discourse/components/topic-status.js.es6  | 23 +++++++++++++------
 .../discourse/views/topic-status.js.es6       |  8 +++----
 config/locales/client.en.yml                  |  2 ++
 3 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/app/assets/javascripts/discourse/components/topic-status.js.es6 b/app/assets/javascripts/discourse/components/topic-status.js.es6
index 4f4eb934f97..9b8c6445612 100644
--- a/app/assets/javascripts/discourse/components/topic-status.js.es6
+++ b/app/assets/javascripts/discourse/components/topic-status.js.es6
@@ -28,21 +28,30 @@ export default Ember.Component.extend(StringBuffer, {
   renderString(buffer) {
     const self = this;
 
-    const renderIconIf = function(conditionProp, name, key, actionable) {
-      if (!self.get(conditionProp)) { return; }
-
-      const title = Handlebars.Utils.escapeExpression(I18n.t("topic_statuses." + key + ".help")),
+    const renderIcon = function(name, key, actionable) {
+      const title = Handlebars.Utils.escapeExpression(I18n.t(`topic_statuses.${key}.help`)),
             startTag = actionable ? "a href" : "span",
             endTag = actionable ? "a" : "span",
             iconArgs = key === 'unpinned' ? { 'class': 'unpinned' } : null,
             icon = iconHTML(name, iconArgs);
 
-      buffer.push("<" + startTag + " title='" + title + "' class='topic-status'>" + icon + "</" + endTag + ">");
+      buffer.push(`<${startTag} title='${title}' class='topic-status'>${icon}</${endTag}>`);
+    };
+
+    const renderIconIf = function(conditionProp, name, key, actionable) {
+      if (!self.get(conditionProp)) { return; }
+      renderIcon(name, key, actionable);
     };
 
     renderIconIf('topic.is_warning', 'envelope', 'warning');
-    renderIconIf('topic.closed', 'lock', 'locked');
-    renderIconIf('topic.archived', 'lock', 'archived');
+
+    if (this.get('topic.closed') && this.get('topic.archived')) {
+      renderIcon('lock', 'locked_and_archived');
+    } else {
+      renderIconIf('topic.closed', 'lock', 'locked');
+      renderIconIf('topic.archived', 'lock', 'archived');
+    }
+
     renderIconIf('topic.pinned', 'thumb-tack', 'pinned', this.get("canAct") );
     renderIconIf('topic.unpinned', 'thumb-tack', 'unpinned', this.get("canAct"));
     renderIconIf('topic.invisible', 'eye-slash', 'invisible');
diff --git a/app/assets/javascripts/discourse/views/topic-status.js.es6 b/app/assets/javascripts/discourse/views/topic-status.js.es6
index c47026e3c4d..17e370bc6ee 100644
--- a/app/assets/javascripts/discourse/views/topic-status.js.es6
+++ b/app/assets/javascripts/discourse/views/topic-status.js.es6
@@ -26,11 +26,11 @@ export default Ember.Object.extend({
       results.push({extraClasses: extraClasses, icon: 'bookmark', key: 'bookmarked', href: url});
     }
 
-    if(topic.get('closed')){
+    if (topic.get('closed') && topic.get('archived')) {
+      results.push({icon: 'lock', key: 'locked_and_archived'});
+    } else if(topic.get('closed')){
       results.push({icon: 'lock', key: 'locked'});
-    }
-
-    if(topic.get('archived')){
+    } else if(topic.get('archived')){
       results.push({icon: 'lock', key: 'archived'});
     }
 
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index c491327ed12..dbfbbf46d7f 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -1593,6 +1593,8 @@ en:
         help: "This topic is closed; it no longer accepts new replies"
       archived:
         help: "This topic is archived; it no longer accepts new replies"
+      locked_and_archived:
+        help: "This topic is closed and archived; it no longer accepts new replies"
       unpinned:
         title: "Unpinned"
         help: "This topic is unpinned for you; it will display in regular order"