From c038758f8cfbd1227e566cb4487401d5da09f45f Mon Sep 17 00:00:00 2001
From: Kane York <rikingcoding@gmail.com>
Date: Thu, 10 Sep 2015 13:42:10 -0700
Subject: [PATCH] FIX: Several fixes related to category reorder

 - Move "New Category" and "Reorder Categories" into a dropdown
 - Always show "New Topic" on categories page, even for admins
 - Make category reorder modal full-height (.full-height-modal)
 - Move category reorder stylesheet out of admin stylesheet
---
 .../categories-admin-dropdown.js.es6          | 37 +++++++++++
 .../components/dropdown-button.js.es6         |  4 +-
 .../routes/discovery-categories.js.es6        |  3 +-
 .../templates/modal/reorder-categories.hbs    | 66 +++++++++----------
 .../templates/navigation/categories.hbs       |  5 +-
 .../common/{admin => base}/cat_reorder.scss   |  3 +
 app/assets/stylesheets/common/base/modal.scss |  3 +
 config/locales/client.en.yml                  |  3 +-
 8 files changed, 80 insertions(+), 44 deletions(-)
 create mode 100644 app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6
 rename app/assets/stylesheets/common/{admin => base}/cat_reorder.scss (92%)

diff --git a/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6 b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6
new file mode 100644
index 00000000000..ac53485198d
--- /dev/null
+++ b/app/assets/javascripts/discourse/components/categories-admin-dropdown.js.es6
@@ -0,0 +1,37 @@
+import { iconHTML } from 'discourse/helpers/fa-icon';
+import DropdownButton from 'discourse/components/dropdown-button';
+import computed from "ember-addons/ember-computed-decorators";
+
+export default DropdownButton.extend({
+  buttonExtraClasses: 'no-text',
+  title: '',
+  text: iconHTML('bars') + ' ' + iconHTML('caret-down'),
+  classNames: ['category-notification-menu', 'category-admin-menu'],
+
+  @computed()
+  dropDownContent() {
+    const includeReorder = this.get('siteSettings.fixed_category_positions');
+    const items = [
+      { id: 'createCategory',
+        title: I18n.t('category.create'),
+        description: I18n.t('category.create_long'),
+        styleClasses: 'fa fa-plus' }
+    ];
+    if (includeReorder) {
+      items.push({
+        id: 'reorderCategories',
+        title: I18n.t('categories.reorder.title'),
+        description: I18n.t('categories.reorder.title_long'),
+        styleClasses: 'fa fa-random'
+      });
+    }
+    return items;
+  },
+
+  // sendAction() is pretty silly if you ask me
+  actionFor_createCategory: 'createCategory',
+  actionFor_reorderCategories: 'reorderCategories',
+  clicked(id) {
+    this.sendAction('actionFor_' + id);
+  }
+});
diff --git a/app/assets/javascripts/discourse/components/dropdown-button.js.es6 b/app/assets/javascripts/discourse/components/dropdown-button.js.es6
index 99d211bbe38..0037ec17f2a 100644
--- a/app/assets/javascripts/discourse/components/dropdown-button.js.es6
+++ b/app/assets/javascripts/discourse/components/dropdown-button.js.es6
@@ -29,9 +29,7 @@ export default Ember.Component.extend(StringBuffer, {
       buffer.push("<h4 class='title'>" + title + "</h4>");
     }
 
-    buffer.push("<button class='btn standard dropdown-toggle' data-toggle='dropdown'>");
-    buffer.push(this.get('text'));
-    buffer.push("</button>");
+    buffer.push(`<button class='btn standard dropdown-toggle ${this.get('buttonExtraClasses')}' data-toggle='dropdown'>${this.get('text')}</button>`);
     buffer.push("<ul class='dropdown-menu'>");
 
     const contents = this.get('dropDownContent');
diff --git a/app/assets/javascripts/discourse/routes/discovery-categories.js.es6 b/app/assets/javascripts/discourse/routes/discovery-categories.js.es6
index 297fc1ac1ee..47a04ae92a0 100644
--- a/app/assets/javascripts/discourse/routes/discovery-categories.js.es6
+++ b/app/assets/javascripts/discourse/routes/discovery-categories.js.es6
@@ -34,9 +34,8 @@ const DiscoveryCategoriesRoute = Discourse.Route.extend(OpenComposer, {
   setupController(controller, model) {
     controller.set("model", model);
 
-    // Only show either the Create Category or Create Topic button
     this.controllerFor("navigation/categories").set("canCreateCategory", model.get("can_create_category"));
-    this.controllerFor("navigation/categories").set("canCreateTopic", model.get("can_create_topic") && !model.get("can_create_category"));
+    this.controllerFor("navigation/categories").set("canCreateTopic", model.get("can_create_topic"));
 
     this.openTopicDraft(model);
   },
diff --git a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs
index b23f2572923..b9ae576799b 100644
--- a/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs
+++ b/app/assets/javascripts/discourse/templates/modal/reorder-categories.hbs
@@ -1,35 +1,33 @@
-<div>
-  <div class="modal-body reorder-categories">
-    <div id="rc-scroll-anchor"></div>
-    <table>
-      <thead>
-      <th class="th-pos">Position</th>
-      <th class="th-cat">Category</th>
-      </thead>
-      {{#each categoriesOrdered as |cat|}}
-        <tr data-category-id="{{cat.id}}">
-          <td>
-            {{number-field number=cat.position}}
-            {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}}
-            {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}}
-            {{#if cat.hasBufferedChanges}}
-              {{d-button class="no-text" action="commit" icon="check"}}
-            {{/if}}
-          </td>
-          <td>{{category-badge cat allowUncategorized="true"}}</td>
-        </tr>
-      {{/each}}
-    </table>
-    <div id="rc-scroll-bottom"></div>
-  </div>
-
-  <div class="modal-footer">
-    {{#if showFixIndices}}
-      {{d-button action="fixIndices" icon="random" label="categories.reorder.fix_order" title="categories.reorder.fix_order_tooltip"}}
-    {{/if}}
-    {{#if showApplyAll}}
-      {{d-button action="commit" icon="check" label="categories.reorder.apply_all"}}
-    {{/if}}
-    {{d-button class="btn-primary" disabled=saveDisabled action="saveOrder" label="categories.reorder.save"}}
-  </div>
+<div class="modal-body reorder-categories full-height-modal">
+  <div id="rc-scroll-anchor"></div>
+  <table>
+    <thead>
+    <th class="th-pos">Position</th>
+    <th class="th-cat">Category</th>
+    </thead>
+    {{#each categoriesOrdered as |cat|}}
+      <tr data-category-id="{{cat.id}}">
+        <td>
+          {{number-field number=cat.position}}
+          {{d-button class="no-text" action="moveUp" actionParam=cat icon="arrow-up"}}
+          {{d-button class="no-text" action="moveDown" actionParam=cat icon="arrow-down"}}
+          {{#if cat.hasBufferedChanges}}
+            {{d-button class="no-text" action="commit" icon="check"}}
+          {{/if}}
+        </td>
+        <td>{{category-badge cat allowUncategorized="true"}}</td>
+      </tr>
+    {{/each}}
+  </table>
+  <div id="rc-scroll-bottom"></div>
+</div>
+
+<div class="modal-footer">
+  {{#if showFixIndices}}
+    {{d-button action="fixIndices" icon="random" label="categories.reorder.fix_order" title="categories.reorder.fix_order_tooltip"}}
+  {{/if}}
+  {{#if showApplyAll}}
+    {{d-button action="commit" icon="check" label="categories.reorder.apply_all"}}
+  {{/if}}
+  {{d-button class="btn-primary" disabled=saveDisabled action="saveOrder" label="categories.reorder.save"}}
 </div>
diff --git a/app/assets/javascripts/discourse/templates/navigation/categories.hbs b/app/assets/javascripts/discourse/templates/navigation/categories.hbs
index c6b4c1cbbc9..e6a650cfbe2 100644
--- a/app/assets/javascripts/discourse/templates/navigation/categories.hbs
+++ b/app/assets/javascripts/discourse/templates/navigation/categories.hbs
@@ -3,10 +3,7 @@
 {{navigation-bar navItems=navItems filterMode=filterMode}}
 
 {{#if canCreateCategory}}
-  {{d-button action="createCategory" icon="plus" label="category.create"}}
-  {{#if siteSettings.fixed_category_positions}}
-    {{d-button action="reorderCategories" icon="random" label="category.reorder"}}
-  {{/if}}
+  {{categories-admin-dropdown}}
 {{/if}}
 {{#if canCreateTopic}}
   <button id="create-topic" class='btn btn-default' {{action "createTopic"}}><i class='fa fa-plus'></i>{{i18n 'topic.create'}}</button>
diff --git a/app/assets/stylesheets/common/admin/cat_reorder.scss b/app/assets/stylesheets/common/base/cat_reorder.scss
similarity index 92%
rename from app/assets/stylesheets/common/admin/cat_reorder.scss
rename to app/assets/stylesheets/common/base/cat_reorder.scss
index d5619e993c3..c1f1ea9943f 100644
--- a/app/assets/stylesheets/common/admin/cat_reorder.scss
+++ b/app/assets/stylesheets/common/base/cat_reorder.scss
@@ -26,3 +26,6 @@
     padding-bottom: 150px;
   }
 }
+.category-admin-menu ul {
+  width: 320px;
+}
diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss
index 7674cd42f86..74291ab406b 100644
--- a/app/assets/stylesheets/common/base/modal.scss
+++ b/app/assets/stylesheets/common/base/modal.scss
@@ -129,6 +129,9 @@
   }
 
   .modal-body {
+    &.full-height-modal {
+      max-height: calc(100vh - 150px);
+    }
     textarea {
       width: 99%;
       height: 80px;
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 49a681770be..e3576d80358 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -370,6 +370,7 @@ en:
       category: "Category"
       reorder:
         title: "Reorder Categories"
+        title_long: "Reorganize the category list"
         fix_order: "Fix Positions"
         fix_order_tooltip: "Not all categories have a unique position number, which may cause unexpected results."
         save: "Save Order"
@@ -1519,6 +1520,7 @@ en:
       topic_template: "Topic Template"
       delete: 'Delete Category'
       create: 'New Category'
+      create_long: 'Create a new category'
       save: 'Save Category'
       slug: 'Category Slug'
       slug_placeholder: '(Optional) dashed-words for url'
@@ -1554,7 +1556,6 @@ en:
       add_permission: "Add Permission"
       this_year: "this year"
       position: "position"
-      reorder: "Reorder"
       default_position: "Default Position"
       position_disabled: "Categories will be displayed in order of activity. To control the order of categories in lists, "
       position_disabled_click: 'enable the "fixed category positions" setting.'