Fixed code formatting, tweaked css, moved remaining hardcoded strings to translations and removed all console.log calls

assets/javascripts/discourse/controllers/admin-wizards-transfer.js.es6

@@ -1,4 +1,4 @@
-import {ajax} from 'discourse/lib/ajax';
+import { ajax } from 'discourse/lib/ajax';
 
 export default Ember.Controller.extend({
   init() {
@@ -7,16 +7,15 @@ export default Ember.Controller.extend({
     this.set('filePath', Ember.A());
   },
 
-
   actions: {
     checkChanged(event) {
+      this.set('noneSelected','')
       let selected = this.get('selected');
       if (event.target.checked) {
         selected.addObject(event.target.id)
       } else if (!event.target.checked) {
         selected.removeObject(event.target.id)
       }
-      console.log(selected);
       this.set('selected', selected)
     },
 
@@ -26,7 +25,7 @@ export default Ember.Controller.extend({
       let route = '/admin/wizards/transfer/export';
       url += route + '?';
       if (!wizards.length) {
-        this.set('noneSelected', "Please select atleast one wizard")
+        this.set('noneSelected', I18n.t("admin.wizard.transfer.export.noneSelected"))
       } else {
         this.set('noneSelected', '')
         wizards.forEach((wizard) => {
@@ -39,6 +38,7 @@ export default Ember.Controller.extend({
     },
 
     setFilePath(event) {
+      this.set('noFile', '')
       // 512 kb is the max file size
       let maxFileSize = 512 * 1024;
       if (event.target.files[0] === undefined) {
@@ -46,24 +46,22 @@ export default Ember.Controller.extend({
         return
       }
       if (maxFileSize < event.target.files[0].size) {
-        this.set('fileError', 'The file size is too big')
+        this.set('fileSizeError', I18n.t('admin.wizard.transfer.import.fileSizeError'))
       } else {
+        this.set('fileSizeError', '')
         // emptying the array as we allow only one file upload at a time
         this.get('filePath').length = 0
         // interestingly, this.get gives us the actual reference to the object so modifying it
         // actually modifies the actual value
         this.get('filePath').addObject(event.target.files[0])
-        console.log(this.get('filePath'))
       }
     },
 
     import() {
       let $formData = new FormData();
-      console.log(this.get('filePath'))
       if (this.get('filePath').length) {
         this.set('noFile', '')
         $formData.append('file', this.get('filePath')[0]);
-        console.log($formData);
         ajax('/admin/wizards/transfer/import', {
           type: 'POST',
           data: $formData,
@@ -78,7 +76,7 @@ export default Ember.Controller.extend({
           }
         })
       } else {
-        this.set('noFile', 'Please choose a file to export')
+        this.set('noFile',I18n.t("admin.wizard.transfer.import.noFile"))
       }
     }
   }

assets/javascripts/discourse/templates/admin-wizards-transfer.hbs

@@ -1,55 +1,44 @@
-<h2>Export</h2>
+<div class="container export">
-
+<h2>{{i18n 'admin.wizard.transfer.export.label'}}</h2>
 <ul class="wizard-list-select">
   {{#each model as |w|}}
-
+    <li>
-    <li style="list-style-type: none;">
       {{input type="checkbox" id=(dasherize w.id) change=(action 'checkChanged')}}
-
       {{#link-to "adminWizard" (dasherize w.id)}}{{w.name}}{{/link-to}}
     </li>
   {{/each}}
-
 </ul>
+  {{d-button id="export-button" class="btn btn-primary side" label="admin.wizard.transfer.export.label" action=(action "export")}}
+  {{#if this.noneSelected}}
+    <p>{{this.noneSelected}}</p>
+  {{/if}}
+</div>
 
-{{d-button id="export-button" class="btn btn-primary side" label="admin.wizard.transfer.export"
+<div class="container import">
-           action=(action "export")}}
+<h2>{{i18n 'admin.wizard.transfer.import.label'}}</h2>
-
-
-
-<h2>Import</h2>
 {{input id='file_url'  type="file" change=(action "setFilePath")}}
+{{d-button id="import-button" class="btn btn-primary side" label="admin.wizard.transfer.import.label" action=(action "import")}}
+  {{#if this.noFile}}
+    <p>{{this.noFile}}</p>
+  {{/if}}
 
+  {{#if this.fileSizeError}}
+    <p>{{this.fileSizeError}}</p>
+  {{/if}}
 
+  {{#if this.success_ids}}
+    {{#each this.success_ids as |id|}}
+      <p>{{i18n "admin.wizard.transfer.import.success"}}</p>
+    {{/each}}
+  {{/if}}
 
-{{d-button id="import-button" class="btn btn-primary side" label="admin.wizard.transfer.import"
+  {{#if this.failure_ids}}
-           action=(action "import")}}
+    {{#each this.failure_ids as |id|}}
-
+      <p>{{i18n "admin.wizard.transfer.import.failure" id=id}}</p>
-{{#if this.noneSelected}}
+    {{/each}}
-  <p>{{this.noneSelected}}</p>
+  {{/if}}
-{{/if}}
+</div>
-
+{{!-- server side error--}}
-{{#if this.noFile}}
-  <p>{{this.noFile}}</p>
-{{/if}}
-{{#if this.fileError}}
-  <p>{{this.fileError}}</p>
-{{/if}}
-
 {{#if this.error}}
   <p>{{this.error}}</p>
 {{/if}}
-
-{{#if this.success_ids}}
-  {{#each this.success_ids as |id|}}
-    <p>Wizard: {{id}} saved successfully</p>
-  {{/each}}
-{{/if}}
-
-{{#if this.failure_ids}}
-  {{#each this.failure_ids as |id|}}
-    <p>Wizard: {{id}} could not be saved</p>
-  {{/each}}
-{{/if}}
-
-

assets/stylesheets/wizard/wizard_transfer.scss

@@ -1,19 +0,0 @@
-#export-button{
-  margin-left: 30px;
-}
-#import-button{
-  margin-left: 15px;
-}
-#file_url {
-  display: inline;
-}
-
-.wizard-list-select {
-  display: inline-block;
-
-}
-
-.wizard-action-buttons{
-  display: inline-flex;
-  flex-direction: column;
-}

assets/stylesheets/wizard_custom_admin.scss

@@ -480,3 +480,22 @@
 .wizard-step-contents{
   height: unset !important;
 }
+
+// Tansfer tab
+#file_url {
+  display: block;
+  margin-bottom: 10px;
+}
+
+.wizard-list-select {
+  list-style-type: none;
+}
+
+.wizard-action-buttons{
+  flex-direction: column;
+}
+
+.container{
+  margin-bottom: 20px;
+}
+

config/locales/client.en.yml

@@ -217,8 +217,15 @@ en:
 
         transfer:
           nav_label: "Transfer"
-          export: "Export"
+          export:
-          import: "Import"
+            label: "Export"
+            noneSelected: "Please select atleast one wizard"
+          import:
+            label: "Import"
+            success: "Wizard: {{id}} saved successfully"
+            failure: "Wizard: {{id}} could not be saved"
+            noFile: "Please choose a file to import"
+            fileSizeError: "The file size is too big"
 
   wizard_js:
     location:

controllers/transfer.rb

@@ -9,6 +9,7 @@ class CustomWizard::TransferController < ::ApplicationController
   def export
     wizards = params['wizards']
     wizard_objects = []
+
     if wizards.nil?
       render json: {error: I18n.t('wizard.export.error.select_one')}
       return
@@ -19,7 +20,6 @@ class CustomWizard::TransferController < ::ApplicationController
     end
 
     send_data wizard_objects.to_json, type: "application/json", disposition: 'attachment', filename: 'wizards.json'
-
   end
 
   def is_json(string)
@@ -32,12 +32,15 @@ class CustomWizard::TransferController < ::ApplicationController
 
   def import
     file = File.read(params['file'].tempfile)
+
     if file.nil?
       render json: {error: I18n.t('wizard.import.error.no_file')}
       return
     end
+
     fileSize = file.size
     maxFileSize = 512 * 1024
+
     if maxFileSize < fileSize
       render json: {error: I18n.t('wizard.import.error.file_large')}
       return
@@ -49,7 +52,6 @@ class CustomWizard::TransferController < ::ApplicationController
     end
 
     jsonObject = JSON.parse file
-
     countValid = 0
     success_ids = []
     failed_ids = []
@@ -71,6 +73,4 @@ class CustomWizard::TransferController < ::ApplicationController
       render json: {success: success_ids, failed: failed_ids}
     end
   end
-
-
 end

plugin.rb

@@ -5,7 +5,6 @@
 # url: https://github.com/angusmcleod/discourse-custom-wizard
 
 register_asset 'stylesheets/wizard_custom_admin.scss'
-register_asset 'stylesheets/wizard/wizard_transfer.scss'
 register_asset 'lib/jquery.timepicker.min.js'
 register_asset 'lib/jquery.timepicker.scss'