Update funds recipents form

app/components/payments/account-setup.js

@@ -5,33 +5,5 @@ const {
 } = Ember;
 
 export default Component.extend({
-  classNames: ['account-setup'],
-
-  // set by binding
-  email: null,
-
-  // Preset values for testing
-  fundsRecipient: {
-    recipientType: 'company',
-    firstName: 'John',
-    lastName: 'Doe',
-
-    businessType: 'sole_prop',
-    businessName: 'Managed LLC',
-    businessEin: '1234-managed',
-
-    dob: '06-12-1986',
-
-    dobDay: '06',
-    dobMonth: '12',
-    dobYear: '1986',
-
-    address1: 'Some street 22',
-    address2: 'PO 23',
-    city: 'Los Angeles',
-    state: 'CA',
-    country: 'US',
-    zip: '10000',
-    ssnLast4: '1234'
-  }
+  classNames: ['account-setup']
 });

app/components/payments/bank-account.js

@@ -13,7 +13,7 @@ export default Component.extend({
   accountNumber: '000123456789',
   routingNumber: '110000000',
 
-  status: computed.alias('account.bankAccountStatus'),
+  status: computed.alias('stripeConnectAccount.bankAccountStatus'),
 
   statusClass: computed('status', function() {
     return `account-setup__section--${get(this, 'status')}`;

app/components/payments/funds-recipient.js

@@ -3,14 +3,15 @@ import Ember from 'ember';
 const {
   Component,
   computed,
+  computed: { alias },
   get
 } = Ember;
 
 export default Component.extend({
   classNameBindings: ['statusClass'],
-  classNames: ['funds-recipient'],
+  classNames: ['funds-recipient', 'account-setup__section'],
 
-  status: computed.alias('account.recipientStatus'),
+  status: alias('stripeConnectAccount.recipientStatus'),
 
   statusClass: computed('status', function() {
     return `account-setup__section--${get(this, 'status')}`;

app/components/payments/funds-recipient/details-form.js

@@ -0,0 +1,54 @@
+import Ember from 'ember';
+
+const {
+  assign,
+  Component,
+  computed: { equal },
+  get,
+  getProperties,
+  set
+} = Ember;
+
+const BUSINESS_PROPERTIES = ['businessName', 'businessEin'];
+
+const INDIVIDUAL_PROPERTIES = [
+  'recipientType',
+  'firstName', 'lastName',
+  'dobDay', 'dobMonth', 'dobYear',
+  'address1', 'address2', 'city', 'state', 'zip', 'country',
+  'ssnLast4'
+];
+
+export default Component.extend({
+  classNames: ['details-form'],
+
+  isBusiness: equal('recipientType', 'business'),
+  isIndividual: equal('recipientType', 'individual'),
+
+  init() {
+    let recipientType = get(this, 'account.recipientType') || 'individual';
+    set(this, 'recipientType', recipientType);
+    this._super(...arguments);
+  },
+
+  actions: {
+    submit() {
+      let details = this._collectIndividualProperties();
+
+      if (get(this, 'isBusiness')) {
+        assign(details, this._collectBusinessProperties());
+      }
+
+      let onSubmit = get(this, 'onSubmit');
+      onSubmit(details);
+    }
+  },
+
+  _collectBusinessProperties() {
+    return getProperties(this, ...BUSINESS_PROPERTIES);
+  },
+
+  _collectIndividualProperties() {
+    return getProperties(this, ...INDIVIDUAL_PROPERTIES);
+  }
+});

app/controllers/project/settings/donations/payments.js

@@ -2,7 +2,6 @@ import Ember from 'ember';
 import FriendlyError from 'code-corps-ember/utils/friendly-error';
 
 const {
-  computed: { alias },
   Controller,
   get,
   inject: { service },
@@ -11,24 +10,16 @@ const {
   set
 } = Ember;
 
-const ACCOUNT_TOKEN_CREATION_ERROR = 'There was a problem in using your bank account information. Please check your input and try again.';
-const ACCOUNT_ADDING_ERROR = 'There was a problem in attaching the provided bank account information to your Stripe account.';
+const ACCOUNT_ADDING_ERROR = 'There was a problem submitting your bank account information.';
+const ACCOUNT_TOKEN_CREATION_ERROR = 'There was a problem with your bank account information. Please check your input and try again.';
+const STRIPE_ACCOUNT_CREATION_ERROR = 'There was a problem with your account information. Please check your input and try again.';
 
 export default Controller.extend({
   currentUser: service(),
   store: service(),
   stripe: service(),
 
-  user: alias('currentUser.user'),
-  stripeConnectAccount: alias('project.organization.stripeConnectAccount'),
-
   actions: {
-    onRecipientInformationSubmitted(organization, email, recipientInformation) {
-      let accountParams = merge(recipientInformation, { organization, email });
-      get(this, 'store').createRecord('stripe-connect-account', accountParams)
-                        .save();
-    },
-
     onBankAccountInformationSubmitted({ accountNumber, routingNumber }) {
       set(this, 'isBusy', true);
 
@@ -41,23 +32,31 @@ export default Controller.extend({
           .then(({ tokenData, stripeConnectAccount }) => this._addBankAccount(tokenData, stripeConnectAccount))
           .catch((response) => this._handleError(response))
           .finally(() => set(this, 'isBusy', false));
-    }
-  },
+    },
 
-  // adding bank account information
+    onPersonalIdNumberSubmitted() {
+      // TODO: FIX THIS
+      return;
+    },
 
-  _createAccountToken(accountNumber, routingNumber) {
-    let stripe = get(this, 'stripe');
-    let params = this._bankAccountTokenParams(accountNumber, routingNumber);
+    onRecipientDetailsSubmitted(recipientInformation) {
+      set(this, 'isBusy', true);
 
-    return stripe.bankAccount.createToken(params)
-                      .then((stripeResponse) => RSVP.resolve(stripeResponse))
-                      .catch((reason) => this._handleBankAccountTokenError(reason));
-  },
+      let promises = {
+        organization: get(this, 'project.organization'),
+        email: get(this, 'currentUser.user.email')
+      };
 
-  _handleBankAccountTokenError() {
-    let friendlyError = new FriendlyError(ACCOUNT_TOKEN_CREATION_ERROR);
-    return RSVP.reject(friendlyError);
+      RSVP.hash(promises)
+          .then(({ organization, email }) => this._createStripeAccount(recipientInformation, organization, email))
+          .catch((reason) => this._handleError(reason))
+          .finally(() => set(this, 'isBusy', false));
+    },
+
+    onVerificationDocumentSubmitted() {
+      // TODO: FIX THIS
+      return;
+    }
   },
 
   _addBankAccount(tokenData, stripeConnectAccount) {
@@ -68,11 +67,6 @@ export default Controller.extend({
             .catch((reason) => this._handleAddBankAccountError(reason));
   },
 
-  _handleAddBankAccountError() {
-    let friendlyError = new FriendlyError(ACCOUNT_ADDING_ERROR);
-    return RSVP.reject(friendlyError);
-  },
-
   _bankAccountTokenParams(accountNumber, routingNumber) {
     return {
       account_number: accountNumber,
@@ -83,9 +77,41 @@ export default Controller.extend({
     };
   },
 
-  // setting error property
+  _createAccountToken(accountNumber, routingNumber) {
+    let stripe = get(this, 'stripe');
+    let params = this._bankAccountTokenParams(accountNumber, routingNumber);
+
+    return stripe.bankAccount.createToken(params)
+                      .then((stripeResponse) => RSVP.resolve(stripeResponse))
+                      .catch((reason) => this._handleBankAccountTokenError(reason));
+  },
+
+  _createStripeAccount(recipientInformation, organization, email) {
+    let accountParams = merge(recipientInformation, { organization, email });
+
+    return get(this, 'store')
+      .createRecord('stripe-connect-account', accountParams)
+      .save()
+      .then((account) => RSVP.resolve(account))
+      .catch((reason) => this._handleStripeAccountCreationError(reason));
+  },
+
+  _handleAddBankAccountError() {
+    let friendlyError = new FriendlyError(ACCOUNT_ADDING_ERROR);
+    return RSVP.reject(friendlyError);
+  },
+
+  _handleBankAccountTokenError() {
+    let friendlyError = new FriendlyError(ACCOUNT_TOKEN_CREATION_ERROR);
+    return RSVP.reject(friendlyError);
+  },
 
   _handleError(error) {
-    this.set('error', error);
+    set(this, 'error', error);
+  },
+
+  _handleStripeAccountCreationError() {
+    let friendlyError = new FriendlyError(STRIPE_ACCOUNT_CREATION_ERROR);
+    return RSVP.reject(friendlyError);
   }
 });

app/controllers/project/tasks/index.js

@@ -16,11 +16,10 @@ export default Controller.extend({
   },
 
   actions: {
-    onDrop(el, target) {
-      let listId = target.dataset.modelId;
-      let position = $(el).index();
-      let taskId = el.dataset.modelId;
-      console.log(taskId, position, listId);
-    }
+    // onDrop(el, target) {
+      // let listId = target.dataset.modelId;
+      // let position = $(el).index();
+      // let taskId = el.dataset.modelId;
+    // }
   }
 });

app/models/stripe-connect-account.js

@@ -3,38 +3,31 @@ import attr from 'ember-data/attr';
 import { belongsTo } from 'ember-data/relationships';
 
 export default Model.extend({
-  email: attr(),
-
-  recipientType: attr(),
-
-  firstName: attr(),
-  lastName: attr(),
-
-  dobDay: attr(),
-  dobMonth: attr(),
-  dobYear: attr(),
-
   address1: attr(),
   address2: attr(),
-  city: attr(),
-  country: attr(),
-  state: attr(),
-  zip: attr(),
-
-  ssnLast4: attr(),
-
   businessEin: attr(),
   businessName: attr(),
   businessType: attr(),
-
   canAcceptDonations: attr(),
   chargesEnabled: attr(),
-
+  city: attr(),
+  country: attr(),
   displayName: attr(),
+  dobDay: attr(),
+  dobMonth: attr(),
+  dobYear: attr(),
+  email: attr(),
+  firstName: attr(),
   idFromStripe: attr(),
-
   insertedAt: attr(),
+  lastName: attr(),
+  recipientStatus: attr(),
+  recipientType: attr(),
+  ssnLast4: attr(),
+  state: attr(),
   updatedAt: attr(),
+  verificationFieldsNeeded: attr(),
+  zip: attr(),
 
   organization: belongsTo('organization', { async: true })
 });

app/styles/_forms.scss

@@ -11,7 +11,7 @@ $outer-border-radius: 4px;
   width: 100%;
 
   #{$all-text-inputs} {
-    border-radius: $inner-border-radius;
+    border-radius: $outer-border-radius;
     float: left;
     max-width: 100%;
     width: 100%;

app/styles/app.scss

@@ -51,6 +51,7 @@
 @import "components/organization-header";
 @import "components/organization-members";
 @import "components/payments/account-setup";
+@import "components/payments/funds-recipient/details-form";
 @import "components/payments/bank-account";
 @import "components/pager-control";
 @import "components/task-card";

app/styles/components/payments/account-setup.scss

@@ -9,6 +9,7 @@
   display: flex;
   min-height: 4em;
   padding: 1.5em;
+  margin-bottom: 15px;
 
   aside {
     @include span-columns(3);