Import members: added UI

2 files changed, 40 insertions, 10 deletions

diff --git a/client/components/import/import.jade b/client/components/import/import.jade
index f63661af..799834fa 100644
--- a/client/components/import/import.jade
+++ b/client/components/import/import.jade
@@ -5,3 +5,11 @@ template(name="importPopup")
     p: label(for='import-textarea') {{_ getLabel}}
     textarea#import-textarea.js-import-json(placeholder="{{_ 'import-json-placeholder'}}" autofocus)
     input.primary.wide(type="submit" value="{{_ 'import'}}")
+
+template(name="mapMembersPopup")
+  p {{_ 'import-members-map'}}
+  ul
+    each members
+      li.item {{ fullName }} > world
+  form
+    input.primary.wide(type="submit" value="{{_ 'import'}}")
diff --git a/client/components/import/import.js b/client/components/import/import.js
index c6957fa9..f46f15bc 100644
--- a/client/components/import/import.js
+++ b/client/components/import/import.js
@@ -13,32 +13,44 @@ const ImportPopup = BlazeComponent.extendComponent({
 
   events() {
     return [{
-      'submit': (evt) => {
+      submit(evt) {
         evt.preventDefault();
         const dataJson = $(evt.currentTarget).find('.js-import-json').val();
         let dataObject;
         try {
           dataObject = JSON.parse(dataJson);
+          this.setError('');
         } catch (e) {
           this.setError('error-json-malformed');
           return;
         }
-        Meteor.call(this.getMethodName(), dataObject, this.getAdditionalData(),
-          (error, response) => {
-            if (error) {
-              this.setError(error.error);
-            } else {
-              Filter.addException(response);
-              this.onFinish(response);
+        if(dataObject.members.length > 0) {
+          this.data().toImport = dataObject;
+          members.forEach(
+            // todo if there is a Wekan user with same name, add it as a field 'wekanUser'
+          );
+          this.data().members = dataObject.members;
+          // we bind to preserve data context
+          Popup.open('mapMembers').bind(this)(evt);
+        } else {
+          Meteor.call(this.getMethodName(), dataObject, this.getAdditionalData(),
+            (error, response) => {
+              if (error) {
+                this.setError(error.error);
+              } else {
+                Filter.addException(response);
+                this.onFinish(response);
+              }
             }
-          }
-        );
+          );
+        }
       },
     }];
   },
 
   onCreated() {
     this.error = new ReactiveVar('');
+    this.dataToImport = '';
   },
 
   setError(error) {
@@ -88,3 +100,13 @@ ImportPopup.extendComponent({
   },
 }).register('boardImportBoardPopup');
 
+BlazeComponent.extendComponent({
+  events() {
+    return [{
+      'submit': (evt) => {
+        evt.preventDefault();
+        console.log(this.data());
+      },
+    }];
+  },
+}).register('mapMembersPopup');