Add UI to delete an empty category

app/assets/javascripts/discourse/controllers/list_categories_controller.js

@@ -5,7 +5,7 @@
   @extends Discourse.ObjectController
   @namespace Discourse
   @module Discourse
-**/ 
+**/
 Discourse.ListCategoriesController = Discourse.ObjectController.extend({
   needs: ['modal'],
 
@@ -37,7 +37,7 @@ Discourse.ListCategoriesController = Discourse.ObjectController.extend({
     u = Discourse.get('currentUser');
     return u && u.admin;
   }).property()
-  
+
 });
 
 

app/assets/javascripts/discourse/controllers/list_controller.js

@@ -90,6 +90,20 @@ Discourse.ListController = Discourse.Controller.extend({
   createCategory: function() {
     var _ref;
     return (_ref = this.get('controllers.modal')) ? _ref.show(Discourse.EditCategoryView.create()) : void 0;
+  },
+
+  canEditCategory: function() {
+    if( this.present('category') ) {
+      var u = Discourse.get('currentUser');
+      return u && u.admin;
+    } else {
+      return false;
+    }
+  }.property('category'),
+
+  editCategory: function() {
+    this.get('controllers.modal').show(Discourse.EditCategoryView.create({ category: this.get('category') }));
+    return false;
   }
 
 });

app/assets/javascripts/discourse/templates/list/list.js.handlebars

@@ -10,6 +10,10 @@
       <button class='btn btn-default' {{action createTopic target="controller"}}><i class='icon icon-plus'></i>{{view.createTopicText}}</button>
     {{/if}}
 
+    {{#if controller.canEditCategory}}
+      <button class='btn btn-default' {{action editCategory target="controller"}}>{{i18n category.edit_long}}</button>
+    {{/if}}
+
     {{#if controller.canCreateCategory}}
       <button class='btn btn-default' {{action createCategory target="controller"}}><i class='icon icon-plus'></i>{{i18n category.create}}</button>
     {{/if}}

app/assets/javascripts/discourse/templates/modal/edit_category.js.handlebars

@@ -52,6 +52,9 @@
   </div>
   <div class="modal-footer">
     <button class='btn btn-primary' {{bindAttr disabled="view.disabled"}} {{action saveCategory target="view"}}>{{view.buttonTitle}}</button>
+    {{#if view.deleteVisible}}
+      <button class='btn btn-danger pull-right' {{bindAttr disabled="view.deleteDisabled"}} {{action deleteCategory target="view"}}><i class="icon icon-trash"></i>{{view.deleteButtonTitle}}</button>
+    {{/if}}
   </div>
 
 {{/with}}

app/assets/javascripts/discourse/views/modal/edit_category_view.js

@@ -14,11 +14,19 @@ Discourse.EditCategoryView = Discourse.ModalBodyView.extend({
   foregroundColors: ['FFFFFF', '000000'],
 
   disabled: function() {
-    if (this.get('saving')) return true;
+    if (this.get('saving') || this.get('deleting')) return true;
     if (!this.get('category.name')) return true;
     if (!this.get('category.color')) return true;
     return false;
-  }.property('category.name', 'category.color'),
+  }.property('category.name', 'category.color', 'deleting'),
+
+  deleteVisible: function() {
+    return (this.get('category.id') && this.get('category.topic_count') === 0);
+  }.property('category.id', 'category.topic_count'),
+
+  deleteDisabled: function() {
+    return (this.get('deleting') || this.get('saving') || false);
+  }.property('disabled', 'saving', 'deleting'),
 
   colorStyle: function() {
     return "background-color: #" + (this.get('category.color')) + "; color: #" + (this.get('category.text_color')) + ";";
@@ -52,6 +60,10 @@ Discourse.EditCategoryView = Discourse.ModalBodyView.extend({
     return this.get('title');
   }.property('title', 'saving'),
 
+  deleteButtonTitle: function() {
+    return Em.String.i18n('category.delete');
+  }.property(),
+
   didInsertElement: function() {
     this._super();
 
@@ -81,6 +93,28 @@ Discourse.EditCategoryView = Discourse.ModalBodyView.extend({
       categoryView.displayErrors(errors);
       categoryView.set('saving', false);
     });
+  },
+
+  deleteCategory: function() {
+    var categoryView = this;
+    this.set('deleting', true);
+    $('#discourse-modal').modal('hide');
+    bootbox.confirm(Em.String.i18n("category.delete_confirm"), Em.String.i18n("no_value"), Em.String.i18n("yes_value"), function(result) {
+      if (result) {
+        categoryView.get('category').destroy().then(function(){
+          // success
+          window.location = Discourse.getURL("/categories");
+        }, function(jqXHR){
+          // error
+          $('#discourse-modal').modal('show');
+          categoryView.displayErrors([Em.String.i18n("category.delete_error")]);
+          categoryView.set('deleting', false);
+        });
+      } else {
+        $('#discourse-modal').modal('show');
+        categoryView.set('deleting', false);
+      }
+    });
   }
 
 });

app/assets/stylesheets/application/topic-list.css.scss

@@ -15,6 +15,7 @@
   }
   .btn {
     float: right;
+    margin-left: 8px;
   }
 }
 

config/locales/client.en.yml

@@ -700,7 +700,8 @@ en:
       foreground_color: "Foreground color"
       name_placeholder: "Should be short and succinct."
       color_placeholder: "Any web color"
-      delete_confirm: "Are you sure you want to delete that category?"
+      delete_confirm: "Are you sure you want to delete this category?"
+      delete_error: "There was an error deleting the category."
       list: "List Categories"
       no_description: "There is no description for this category."
       change_in_category_topic: "visit category topic to edit the description"