feat(Recurring Buy): disable recurring if pendingKYC; redesign KYC co…

…mponent

app/partials/coinify/checkout.pug

@@ -21,6 +21,7 @@ bc-tabs(tab="tabs.selectedTab" tab-options="tabs.options" on-select="tabs.select
         on-success="buyHandler(quote, null, frequency, endTime)"
         recurring-buy-limit="recurringBuyLimit()"
         show-recurring="showRecurringBuy"
+        disable-recurring="disableRecurring"
         handle-quote="buyQuoteHandler(amount, baseCurr, quoteCurr)")
     .flex-column.ml-60.col-md-5.col-sm-12.col-xs-12.pln.prn.pv-10-mobile.no-margin-mobile.hidden-xs
       exchange-recurring(ng-if="scheduledRecurring" frequency="vm.frequency" end-time="vm.endTime" t="trade" dollars="dollars" payment-fee="trade.fee")

app/templates/exchange/checkout.pug

@@ -86,7 +86,7 @@ form.bc-form(
           a(href='mailto:support@sfox.com').f-12 support@sfox.com
     .group.inline.mt-10(ng-if="$ctrl.frequencies && !trading().isDisabled && $ctrl.showRecurringBuy")
       .item.inline.check
-        input(type="checkbox" id="frequencyCheck" name="frequencyCheck" ng-model="state.frequencyCheck" ng-disabled="checkoutForm.fiat.$viewValue > $ctrl.recurringBuyLimit() || $ctrl.recurringBuyLimit() < min.fiat")
+        input(type="checkbox" id="frequencyCheck" name="frequencyCheck" ng-model="state.frequencyCheck" ng-disabled="checkoutForm.fiat.$viewValue > $ctrl.recurringBuyLimit() || $ctrl.recurringBuyLimit() < min.fiat || $ctrl.disableRecurring")
         label(for="frequencyCheck" translate="MAKE_RECURRING_ORDER")
     .group.mt-10.recurring-buy(ng-if="state.frequencyCheck && !trading().isDisabled && checkoutForm.fiat.$viewValue <= $ctrl.recurringBuyLimit()")
       .group

app/templates/kyc-status.pug

@@ -1,9 +1,8 @@
-.kyc-status.flex-column.flex-center.flex-justify.border.pbl.ptl.phm(ng-show="$ctrl.getState() && $ctrl.level < 2")
+.flex-center.flex-justify.border-light-blue.pbl.ptl.phm(ng-show="$ctrl.getState() && $ctrl.level < 2")
   div
     h1.mbn.mtn
-      i.type-h4(ng-class="$ctrl.getState().i")
-  .flex-column.flex-center.flex-justify.ph-25
-    span.type-h5.mbs.mts(translate="{{$ctrl.getState().ns}}.TITLE")
-    span.center.type-sm(ng-show="$ctrl.currency" translate="{{$ctrl.getState().ns}}.BODY" translate-values="{ccmax: $ctrl.getCardMax()}")
-  .flex-center
+      i.type-h4.primary(ng-class="$ctrl.getState().i")
+  .flex-column.flex-justify.ph-25
+    span.type-h5.em-400.mbs.mts(translate="{{$ctrl.getState().ns}}.TITLE")
+    span.type-sm(ng-show="$ctrl.currency" translate="{{$ctrl.getState().ns}}.BODY" translate-values="{ccmax: $ctrl.getCardMax()}")
     a.underline.type-sm.ptm(translate="{{$ctrl.getState().ns}}.LINK" ng-click="$ctrl.onTrigger()")

assets/js/components/exchange/exchange-checkout.component.js

@@ -18,6 +18,7 @@ angular
       frequencies: '<',
       collapseSummary: '<',
       showRecurring: '<',
+      disableRecurring: '<',
       recurringBuyLimit: '&',
       onSuccess: '&',
       fiatChange: '&',

assets/js/controllers/coinify/coinify.controller.js

@@ -105,7 +105,7 @@ function CoinifyController ($rootScope, $scope, $q, $state, $timeout, $uibModalI
   this.currentStep = () => Object.keys(this.steps).filter(this.onStep)[0];
   this.goTo = (step) => this.step = this.steps[step];
 
-  if (frequency && this.quote) {
+  if (frequency && this.quote) { // TODO might need something here if KYC pending
     this.goTo('confirm-recurring')
   } else if (!this.user.isEmailVerified && !this.exchange.user) {
     this.goTo('email');

assets/js/controllers/coinify/coinifyCheckout.controller.js

@@ -59,6 +59,7 @@ function CoinifyCheckoutController ($scope, $rootScope, $stateParams, Env, Angul
       }
     };
     $scope.showRecurringBuy = MyWallet.wallet.accountInfo.countryCodeGuess !== 'UK' && env.partners.coinify.showRecurringBuy && $scope.exchange.profile.email; /* && $scope.exchange.profile.tradeSubscriptionsAllowed */
+    $scope.disableRecurring = coinify.getPendingKYC()
 
     if (env.qaDebugger) {
       $scope.qaDebugger = env.qaDebugger;