Extract out common "cancel" link functionality from modals

app/assets/javascripts/admin/models/admin-user.js.es6

@@ -106,7 +106,7 @@ const AdminUser = Discourse.User.extend({
           message = I18n.messageFormat('admin.user.delete_all_posts_confirm_MF', { "POSTS": user.get('post_count'), "TOPICS": user.get('topic_count') }),
           buttons = [{
             "label": I18n.t("composer.cancel"),
-            "class": "cancel-inline",
+            "class": "d-modal-cancel",
             "link":  true
           }, {
             "label": `${iconHTML('exclamation-triangle')} ` + I18n.t("admin.user.delete_all_posts"),

app/assets/javascripts/admin/services/admin-tools.js.es6

@@ -44,7 +44,7 @@ export default Ember.Service.extend({
         const buttons = [
           {
             label: I18n.t("composer.cancel"),
-            class: "cancel-inline",
+            class: "d-modal-cancel",
             link:  true
           },
           {

app/assets/javascripts/admin/templates/modal/admin-add-upload.hbs

@@ -10,5 +10,5 @@
 
 <div class="modal-footer">
   {{d-button action="upload" disabled=disabled class='btn btn-primary' icon='upload' label='admin.customize.theme.upload'}}
-  <a href {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/admin/templates/modal/admin-edit-badge-groupings.hbs

@@ -24,5 +24,5 @@
 
 <div class="modal-footer">
   <button class='btn btn-primary' {{action "saveAll"}} disabled={{submitDisabled}}>{{i18n 'admin.badges.save'}}</button>
-  <a {{action "cancel"}}>{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/admin/templates/modal/admin-import-theme.hbs

@@ -23,5 +23,5 @@
 
 <div class="modal-footer">
   {{d-button action="importTheme" disabled=loading class='btn btn-primary' icon='upload' label='admin.customize.import'}}
-  <a href {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/admin/templates/modal/admin-suspend-user.hbs

@@ -43,5 +43,5 @@
     disabled=submitDisabled
     icon="ban"
     label="admin.user.suspend"}}
-  <a {{action "closeModal"}} class="cancel-suspend">{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/discourse/components/d-modal-cancel.js.es6

@@ -0,0 +1,3 @@
+export default Ember.Component.extend({
+  tagName: ''
+});

app/assets/javascripts/discourse/controllers/preferences/account.js.es6

@@ -78,7 +78,7 @@ export default Ember.Controller.extend(CanCheckEmails, PreferencesTabController,
         model = this.get('model'),
         buttons = [
           { label: I18n.t("cancel"),
-            class: "cancel-inline",
+            class: "d-modal-cancel",
             link:  true,
             callback: () => { this.set('deleting', false); }
           },

app/assets/javascripts/discourse/templates/components/d-modal-cancel.hbs

@@ -0,0 +1 @@
+<a {{action close}} class='d-modal-cancel'>{{i18n 'cancel'}}</a>

app/assets/javascripts/discourse/templates/modal/avatar-selector.hbs

@@ -32,5 +32,5 @@
 
 <div class="modal-footer">
   {{d-button action="saveAvatarSelection" class="btn-primary" disabled=uploading label="save"}}
-  <a {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/discourse/templates/modal/edit-topic-timer.hbs

@@ -39,7 +39,7 @@
         label="topic.topic_status_update.save"
         action="saveTimer"}}
 
-    <a {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+    {{d-modal-cancel close=(action "closeModal")}}
     {{conditional-loading-spinner size="small" condition=loading}}
 
     {{#if topicTimer.execute_at}}

app/assets/javascripts/discourse/templates/modal/feature-topic.hbs

@@ -107,5 +107,5 @@
   </div>
 {{/d-modal-body}}
 <div class="modal-footer">
-  <a class="pull-right" {{action "closeModal"}}>{{i18n "cancel"}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/discourse/templates/modal/jump-to-post.hbs

@@ -7,5 +7,5 @@
 
 <div class='modal-footer'>
   {{d-button class="btn-primary" action="jump" label="composer.modal_ok"}}
-  {{d-button class="btn-danger" action="closeModal" label="composer.modal_cancel"}}
+  {{d-modal-cancel close=(action "closeModal")}}
 </div>

app/assets/javascripts/discourse/templates/modal/request-group-membership-form.hbs

@@ -15,7 +15,7 @@
         label="groups.membership_request.submit"
         action="requestMember"}}
 
-    <a {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+    {{d-modal-cancel close=(action "closeModal")}}
     {{conditional-loading-spinner size="small" condition=loading}}
   </div>
 </form>

app/assets/javascripts/discourse/templates/modal/upload-selector.hbs

@@ -42,6 +42,6 @@
 
 <div class="modal-footer">
   {{d-button action="upload" class='btn-primary' icon=uploadIcon label='upload'}}
-  <a href {{action "closeModal"}}>{{i18n 'cancel'}}</a>
+  {{d-modal-cancel close=(action "closeModal")}}
   {{#if remote}}<a {{action "toggleShowMore"}} class="pull-right">{{i18n 'show_more'}}</a>{{/if}}
 </div>

app/assets/stylesheets/common/admin/suspend.scss

@@ -1,5 +1,4 @@
 .suspend-user-modal {
-  font-size: 1.1em;
 
   .duration-controls {
     margin-bottom: 1em;
@@ -17,5 +16,4 @@
     box-sizing: border-box;
     height: 2.5em;
   }
-
 }

app/assets/stylesheets/common/base/modal.scss

@@ -246,13 +246,12 @@
         color: $primary;
       }
     }
-    .cancel {
-      float: right;
-      margin-right: 5px;
-    }
   }
 }
-
+.d-modal-cancel {
+  margin-left: 5px;
+  color: $primary-medium;
+}
 
 .delete-user-modal {
   .modal-footer {
@@ -265,17 +264,9 @@
       display: inline-block;
       margin-left: 0;
     }
-    .cancel {
-      display: block;
-      margin-right: 5px;
-    }
   }
 }
 
-.modal-footer .cancel-inline {
-  margin-left: 10px;
-}
-
 .invite-modal {
   overflow: visible;
   .ember-text-field {

test/javascripts/acceptance/admin-suspend-user-test.js.es6

@@ -10,7 +10,7 @@ QUnit.test("suspend a user - cancel", assert => {
     assert.equal(find('.suspend-user-modal:visible').length, 1);
   });
 
-  click('.cancel-suspend');
+  click('.d-modal-cancel');
   andThen(() => {
     assert.equal(find('.suspend-user-modal:visible').length, 0);
   });