SONAR-7483 rework delete rule modal

4 files changed, 67 insertions, 29 deletions

diff --git a/server/sonar-web/src/main/js/apps/coding-rules/rule-details-view.js b/server/sonar-web/src/main/js/apps/coding-rules/rule-details-view.js
index c93c4202fb9..1a36a9c688d 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/rule-details-view.js
+++ b/server/sonar-web/src/main/js/apps/coding-rules/rule-details-view.js
@@ -29,10 +29,9 @@ import ProfilesView from './rule/rule-profiles-view';
 import CustomRulesView from './rule/custom-rules-view';
 import ManualRuleCreationView from './rule/manual-rule-creation-view';
 import CustomRuleCreationView from './rule/custom-rule-creation-view';
+import DeleteRuleView from './rule/delete-rule-view';
 import IssuesView from './rule/rule-issues-view';
 import Template from './templates/coding-rules-rule-details.hbs';
-import confirmDialog from './confirm-dialog';
-import { translate, translateWithParameters } from '../../helpers/l10n';
 
 export default Marionette.LayoutView.extend({
   className: 'coding-rule-details',
@@ -147,18 +146,12 @@ export default Marionette.LayoutView.extend({
   },
 
   deleteRule () {
-    const that = this;
-    const ruleType = this.model.has('templateKey') ? 'custom' : 'manual';
-    confirmDialog({
-      title: translate('delete'),
-      html: translateWithParameters(`coding_rules.delete.${ruleType}.confirm`, this.model.get('name')),
-      yesHandler () {
-        const url = '/api/rules/delete';
-        const options = { key: that.model.id };
-        $.post(url, options).done(function () {
-          that.options.app.controller.fetchList();
-        });
-      }
+    const deleteRuleView = new DeleteRuleView({
+      model: this.model
+    }).render();
+
+    deleteRuleView.on('delete', () => {
+      this.options.app.controller.fetchList();
     });
   },
 
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/rule/custom-rule-view.js b/server/sonar-web/src/main/js/apps/coding-rules/rule/custom-rule-view.js
index 41f9a7f5912..24a4854e98f 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/rule/custom-rule-view.js
+++ b/server/sonar-web/src/main/js/apps/coding-rules/rule/custom-rule-view.js
@@ -17,12 +17,10 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import $ from 'jquery';
 import _ from 'underscore';
 import Marionette from 'backbone.marionette';
+import DeleteRuleView from './delete-rule-view';
 import Template from '../templates/rule/coding-rules-custom-rule.hbs';
-import confirmDialog from '../confirm-dialog';
-import { translate } from '../../../helpers/l10n';
 
 export default Marionette.ItemView.extend({
   tagName: 'tr',
@@ -37,18 +35,13 @@ export default Marionette.ItemView.extend({
   },
 
   deleteRule () {
-    const that = this;
-    confirmDialog({
-      title: translate('delete'),
-      html: translate('are_you_sure'),
-      yesHandler () {
-        const url = '/api/rules/delete';
-        const options = { key: that.model.id };
-        $.post(url, options).done(function () {
-          that.model.collection.remove(that.model);
-          that.destroy();
-        });
-      }
+    const deleteRuleView = new DeleteRuleView({
+      model: this.model
+    }).render();
+
+    deleteRuleView.on('delete', () => {
+      this.model.collection.remove(this.model);
+      this.destroy();
     });
   },
 
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/rule/delete-rule-view.js b/server/sonar-web/src/main/js/apps/coding-rules/rule/delete-rule-view.js
new file mode 100644
index 00000000000..bfeff19b91f
--- /dev/null
+++ b/server/sonar-web/src/main/js/apps/coding-rules/rule/delete-rule-view.js
@@ -0,0 +1,38 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2016 SonarSource SA
+ * mailto:contact AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import $ from 'jquery';
+
+import ModalFormView from '../../../components/common/modal-form';
+import Template from '../templates/rule/coding-rules-delete-rule.hbs';
+
+export default ModalFormView.extend({
+  template: Template,
+
+  onFormSubmit() {
+    ModalFormView.prototype.onFormSubmit.apply(this, arguments);
+
+    const url = '/api/rules/delete';
+    const options = { key: this.model.id };
+    $.post(url, options).done(() => {
+      this.destroy();
+      this.trigger('delete');
+    });
+  }
+});
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/templates/rule/coding-rules-delete-rule.hbs b/server/sonar-web/src/main/js/apps/coding-rules/templates/rule/coding-rules-delete-rule.hbs
new file mode 100644
index 00000000000..4c9a7f3fbf9
--- /dev/null
+++ b/server/sonar-web/src/main/js/apps/coding-rules/templates/rule/coding-rules-delete-rule.hbs
@@ -0,0 +1,14 @@
+<form>
+  <div class="modal-head">
+    <h2>{{t 'coding_rules.delete_rule'}}</h2>
+  </div>
+
+  <div class="modal-body">
+    {{tp 'coding_rules.delete.custom.confirm' name}}
+  </div>
+
+  <div class="modal-foot">
+    <button className="button-red">{{t 'delete'}}</button>
+    <a class="js-modal-close">{{t 'cancel'}}</a>
+  </div>
+</form>