feat(Swap): tiers and limits rendering finished and tested

packages/blockchain-info-components/src/Images/Images.js

@@ -18,6 +18,7 @@ import coinifyLogo from './img/coinify-logo.svg'
 import emptySearch from './img/empty-search.svg'
 import emptyTx from './img/empty-tx.svg'
 import facebookWhite from './img/facebook-white.svg'
+import failedKyc from './img/failed-kyc.png'
 import googleAuthenticator from './img/google-authenticator.png'
 import googlePlayBadge from './img/google-play-badge.png'
 import halfBitcoin from './img/half-bitcoin.svg'
@@ -108,6 +109,7 @@ export default {
   'empty-search': emptySearch,
   'empty-tx': emptyTx,
   'facebook-white': facebookWhite,
+  'failed-kyc': failedKyc,
   'google-authenticator': googleAuthenticator,
   'google-play-badge': googlePlayBadge,
   'half-bitcoin': halfBitcoin,

packages/blockchain-wallet-v4-frontend/src/data/modules/profile/model.js

@@ -1,3 +1,4 @@
+import { complement, findLast, propEq } from 'ramda'
 import PropTypes from 'prop-types'
 
 export const USER_ACTIVATION_STATES = {
@@ -62,3 +63,15 @@ export const CountryPropType = PropTypes.shape({
   regions: PropTypes.arrayOf(PropTypes.string),
   scopes: PropTypes.arrayOf(PropTypes.string)
 })
+
+export const getLastAttemptedTier = findLast(
+  complement(propEq('state', TIERS_STATES.NONE))
+)
+
+export const getLastUnrejectedTier = findLast(
+  complement(propEq('state', TIERS_STATES.REJECTED))
+)
+
+export const getLastVerifiedTier = findLast(
+  propEq('state', TIERS_STATES.VERIFIED)
+)

packages/blockchain-wallet-v4-frontend/src/data/modules/profile/sagas.spec.js

@@ -227,12 +227,11 @@ describe('fetch user saga', () => {
 
 describe('fetch tiers saga', () => {
   it('should call fetchTiers api and update state', () => {
-    api.fetchTiers.mockReturnValueOnce(INITIAL_TIERS)
+    api.fetchTiers.mockReturnValueOnce({ tiers: INITIAL_TIERS })
     return expectSaga(fetchTiers)
       .put(A.fetchTiersLoading())
       .call(api.fetchTiers)
-      .put(A.fetchTiersSuccess(INITIAL_TIERS.tiers))
-      .returns()
+      .put(A.fetchTiersSuccess(INITIAL_TIERS))
       .run()
   })
 })

packages/blockchain-wallet-v4-frontend/src/scenes/Exchange/ExchangeForm/LimitInfo/LimitInfo.js

@@ -53,17 +53,6 @@ const LimitMessage = ({
       </LimitText>
     )
 
-  if (showPending)
-    return (
-      <LimitText color='btc'>
-        &nbsp;
-        <FormattedMessage
-          id='scenes.exchange.exchangeform.limit_info.in_review'
-          defaultMessage='In Review'
-        />
-      </LimitText>
-    )
-
   if (showLimit)
     return (
       <LimitText color='success'>
@@ -81,13 +70,24 @@ const LimitMessage = ({
       </LimitText>
     )
 
+  if (showPending)
+    return (
+      <LimitText color='btc'>
+        &nbsp;
+        <FormattedMessage
+          id='scenes.exchange.exchangeform.limit_info.in_review'
+          defaultMessage='In Review'
+        />
+      </LimitText>
+    )
+
   return null
 }
 
 export const LimitAction = ({
   nextTier,
   nextTierAvailable,
-  nextTierInReview,
+  lastTierInReview,
   upgradeRequired,
   upgradeTier
 }) => {
@@ -116,7 +116,7 @@ export const LimitAction = ({
         <TierIcon name='down-arrow-filled' color='brand-secondary' />
       </TierLink>
     )
-  if (nextTierInReview)
+  if (lastTierInReview)
     return (
       <LinkContainer to='/swap/profile'>
         <TierLink>
@@ -150,7 +150,7 @@ export class LimitInfo extends React.PureComponent {
       hideTier,
       currencySymbol,
       nextTierAvailable,
-      nextTierInReview,
+      lastTierInReview,
       upgradeRequired
     } = this.props
 
@@ -178,7 +178,7 @@ export class LimitInfo extends React.PureComponent {
         <LimitAction
           nextTier={nextTier}
           nextTierAvailable={nextTierAvailable}
-          nextTierInReview={nextTierInReview}
+          lastTierInReview={lastTierInReview}
           upgradeRequired={upgradeRequired}
           upgradeTier={this.upgradeTier}
         />